{users[dataIndex].client ? users[dataIndex].client : '-'}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"role\",\r\n label: \"Role\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n{users[dataIndex].role}
\r\n )\r\n }\r\n },\r\n },\r\n\r\n // {\r\n // name: \"isAdmin\",\r\n // label: \"Is Admin?\",\r\n // options: {\r\n // filter: true,\r\n // sort: true,\r\n // customBodyRenderLite: (dataIndex) => {\r\n // return (\r\n //\r\n
\r\n )\r\n}\r\n\r\nconst mapStateToProps = (state) => ({\r\n auth: state.auth\r\n})\r\nexport default connect(mapStateToProps, { ...alert.actions, ...confirmModal.actions })(UserListingPage);","import * as Yup from \"yup\";\r\n\r\nexport default Yup.object().shape({\r\n id: Yup.number(),\r\n logoFile: Yup.string().nullable(),\r\n businessName: Yup.string().required(\"Business is required\"),\r\n clientTierId: Yup.string().required(\"Client Tier is required\"),\r\n noOfProject: Yup.number().required(\"Please specify no of projects\"),\r\n noOfProject: Yup.number().nullable(),\r\n contactName: Yup.string().required(\"Contact Name is required\"),\r\n contactEmail: Yup.string().email(\"Please enter a valid email\").required(\"Contact Email is required\"),\r\n contactPhone: Yup.string().required(\"Contact Phone is required\"),\r\n companyAddress: Yup.string().required(\"Company Address is required\"),\r\n});","import axiosInstance from '../apiService';\r\nimport constants from '../../constants/constants';\r\n\r\nconst ENDPOINTORIGIN = \"ClientTier/\";\r\n\r\nconst getClientTierById = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetClientTierById?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getClientTiers = async () => await axiosInstance.get(ENDPOINTORIGIN + 'GetClientTiers', constants.REQUIRE_INTERCEPTORS);\r\nconst getProductsFromChargify = async () => await axiosInstance.get(ENDPOINTORIGIN + 'GetProductsFromChargify', constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst saveClientTier = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'SaveClientTier', model, { ...constants.REQUIRE_INTERCEPTORS, fileHandler: true });\r\n\r\nconst deleteClientTierByIsDeleteFlag = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'DeleteClientTierByIsDeletedFlag', model, constants.REQUIRE_INTERCEPTORS)\r\n\r\nexport {\r\n getClientTierById,\r\n getClientTiers,\r\n saveClientTier,\r\n getProductsFromChargify,\r\n deleteClientTierByIsDeleteFlag\r\n}","import React, { useEffect, useState } from 'react';\r\nimport { Modal, Button } from 'react-bootstrap';\r\nimport { connect } from 'react-redux';\r\nimport constants from \"../../constants/constants\";\r\nimport { useFormik } from \"formik\";\r\nimport { blue } from '@material-ui/core/colors';\r\nimport ClientValidator from \"../../helpers/validators/ClientValidator\";\r\nimport { getErrorField, convertJsonToFormData } from \"../../helpers/helper\";\r\nimport { makeStyles, withStyles } from '@material-ui/core';\r\nimport * as clientService from \"../../services/management/clientService\";\r\nimport * as clientTierService from \"../../services/management/clientTierService\";\r\nimport Checkbox from '@material-ui/core/Checkbox';\r\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\r\nimport * as alert from \"../../redux/alertSnackBarRedux\";\r\nimport * as confirmModal from \"../../redux/confirmModalRedux\";\r\n\r\nimport { FilePond } from \"react-filepond\";\r\nimport TextField from '@material-ui/core/TextField';\r\nimport FormControl from '@material-ui/core/FormControl';\r\nimport Select from '@material-ui/core/Select';\r\nimport InputLabel from '@material-ui/core/InputLabel';\r\n\r\nconst BlueCheckbox = withStyles({\r\n root: {\r\n color: blue[400],\r\n '&$checked': {\r\n color: blue[600],\r\n },\r\n },\r\n checked: {},\r\n})((props) => \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Users\r\n \r\n \r\n View and Manage Users\r\n \r\n
\r\n {\r\n (auth.role === 'SuperAdmin' || auth.role === 'Admin') &&\r\n\r\n {\r\n setUserToEditId(null);\r\n setUserModalVisible(true)\r\n }}\r\n className=\"btn btn-success font-weight-bolder font-size-sm mr-3\"\r\n >\r\n Add User\r\n \r\n
\r\n }\r\n \r\n loadUsersTable()}\r\n show={userModalVisible}\r\n resetUserToEdit={() => setUserToEditId(null)}\r\n hide={() => setUserModalVisible(false)}\r\n />\r\n loadUsersTable()}\r\n show={assignProjectModalVisible}\r\n hide={() => setAssignProjectModalVisible(false)}\r\n />\r\n setUserToEditId(null)}\r\n hide={() => setChangePasswordModalIsVisible(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 name: \"contactName\",\r\n label: \"Contact Name\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n },\r\n }, {\r\n name: \"contactPhone\",\r\n label: \"Contact Phone\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n },\r\n }, {\r\n name: \"contactEmail\",\r\n label: \"Contact Email\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n },\r\n },\r\n {\r\n name: \"noOfProject\",\r\n label: \"No of Nspections\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n },\r\n },\r\n {\r\n name: \"noOfReport\",\r\n label: \"No of Reports\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n {clients[dataIndex].noOfReport ? clients[dataIndex].noOfReport : 'Default'}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"clientTier\",\r\n label: \"Tier Plan\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n{clients[dataIndex].clientTier}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"id\",\r\n label: \"Actions\",\r\n options: {\r\n filter: false,\r\n sort: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n\r\n {\r\n setClientToEditId(clients[dataIndex].id);\r\n setClientModalVisible(true);\r\n }}\r\n >\r\n Edit\r\n \r\n {\r\n loadPaymentProfileLink(clients[dataIndex].refId);\r\n }}\r\n >\r\n Billing\r\n \r\n {\r\n auth.role === \"SuperAdmin\" ?\r\n showConfirmModal({\r\n title: \"Delete Client\",\r\n text: \"Are you sure you want to delete this client? Note that deleting the client will delete the subscriptions associated with the client which cannot be recovered.\",\r\n rightBtnText: `Confirm`,\r\n btnAction: () => deleteClient(clients[dataIndex].id),\r\n })\r\n }\r\n >\r\n Delete\r\n \r\n : <>\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\nconst mapStateToProps = (state) => ({\r\n auth: state.auth\r\n})\r\n\r\nexport default connect(mapStateToProps, { ...alert.actions, ...confirmModal.actions })(ClientListingPage);","import * as Yup from \"yup\";\r\n\r\nexport default Yup.object().shape({\r\n id: Yup.number(),\r\n projectName: Yup.string().required(\"Nspection Name is required\"),\r\n clientId: Yup.string().required(\"Client is required\"),\r\n scanDate: Yup.string().required(\"Scan Date is required\"),\r\n modelLink: Yup.string().nullable(),\r\n projectTypeId: Yup.string().required(\"Nspection Type is required\"),\r\n notes: Yup.string().nullable(),\r\n});","import axiosInstance from '../apiService';\r\nimport constants from '../../constants/constants';\r\n\r\nconst ENDPOINTORIGIN = \"ProjectType/\";\r\n\r\nconst getProjectTypes = async (clientId) => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectTypes?clientId=' + clientId, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getProjectTypeById = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectTypeById?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst setDefaultProjectType = async (clientId, id) => await axiosInstance.get(ENDPOINTORIGIN + `SetDefaultProjectType?clientId=${clientId}&projectTypeId=${id}`, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getAllProjectTypes = async () => await axiosInstance.get(ENDPOINTORIGIN + 'GetAllProjectTypes', constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst saveProjectType = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'SaveProjectType', model, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst deleteProjectType = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'DeleteProjectType?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst deleteProjectTypeIsDeletedFlag = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'DeleteProjectTypeIsDeletedFlag', model, constants.REQUIRE_INTERCEPTORS);\r\n\r\nexport {\r\n getProjectTypes,\r\n getProjectTypeById,\r\n getAllProjectTypes,\r\n saveProjectType,\r\n setDefaultProjectType,\r\n deleteProjectType,\r\n deleteProjectTypeIsDeletedFlag\r\n}","/* eslint-disable no-restricted-imports */\r\nimport React, { useState, useEffect, useRef } from 'react';\r\nimport { Modal, Button } from 'react-bootstrap';\r\nimport { connect } from 'react-redux';\r\nimport FormControl from '@material-ui/core/FormControl';\r\nimport InputLabel from '@material-ui/core/InputLabel';\r\nimport TextField from '@material-ui/core/TextField';\r\nimport Select from '@material-ui/core/Select';\r\nimport constants from \"../../constants/constants\";\r\nimport CreateProjectValidator from \"../../helpers/validators/CreateProjectValidator\";\r\nimport { useFormik } from \"formik\";\r\nimport { FilePond } from \"react-filepond\";\r\nimport { getErrorField, convertJsonToFormData } from '../../helpers/helper';\r\nimport * as projectService from '../../services/service/projectService';\r\nimport * as projectTypeService from '../../services/service/projectTypeService';\r\nimport * as clientService from '../../services/management/clientService';\r\nimport * as alert from '../../redux/alertSnackBarRedux';\r\nimport * as confirmModal from \"../../redux/confirmModalRedux\";\r\nimport moment from 'moment';\r\n\r\nconst initialState = {\r\n id: 0,\r\n projectName: '',\r\n clientId: '',\r\n scanDate: '',\r\n modelLink: '',\r\n projectTypeId: '',\r\n notes: '',\r\n isDeleted: false,\r\n filesToSave: []\r\n}\r\nconst NewProjectModal = (props) => {\r\n const filePondRef = useRef(null); // Initialize as null\r\n const { show, hide, reloadTable, showAlert, showConfirmModal, projectToEditId, hideConfirmModal, setProcessing } = props;\r\n const [project, setProject] = useState(initialState);\r\n const [clientList, setClientList] = useState([]);\r\n const [clientId, setClientId] = useState(0);\r\n const [projectImages, setProjectImages] = useState([]);\r\n const [filePondFiles, setFilePondFiles] = useState([]);\r\n const [filePondInstance, setFilePondInstance] = useState(null);\r\n const [isProjectSubmitting, setIsProjectSubmitting] = useState(false);\r\n const [projectTypeList, setProjectTypeList] = useState([]);\r\n const [formFieldValues, setFormFieldValues] = useState({});\r\n const [nspectionTypeSelected, setNspectionTypeSelected] = useState(null);\r\n const [formJson, setFormJson] = useState(null);\r\n const [loading, setLoading] = useState(false);\r\n const handleValueChange = (val, key) => {\r\n setFormFieldValues((prevValues) => ({\r\n ...formFieldValues,\r\n [key]: val,\r\n }));\r\n };\r\n\r\n useEffect(() => {\r\n if (projectToEditId) {\r\n projectService.getProjectById(projectToEditId).then(res => {\r\n const model = { ...res, scanDate: moment(res.scanDate).format('yyyy-MM-DD') };\r\n setProject(model);\r\n\r\n if (model.projectType) {\r\n setNspectionTypeSelected(model.projectType.name);\r\n if (model.formJSON) {\r\n setFormJson(JSON.parse(model.formJSON));\r\n }\r\n }\r\n\r\n // Populate FilePond with existing images\r\n const existingFiles = model.projectModelImages.map(image => ({\r\n source: `${constants.API_URL}api/${image.imagePath}`, // Make sure to correct this URL if it is different\r\n options: {\r\n type: 'local',\r\n file: {\r\n name: image.imagePath.split('/').pop(), // Extract filename from path\r\n size: 0 // Size is unknown\r\n }\r\n }\r\n }));\r\n setFilePondFiles(existingFiles);\r\n }).catch(err => {\r\n showAlert({ message: err.message, variant: 'error' });\r\n });\r\n }\r\n clientService.getClients().then(res => {\r\n setClientList(res);\r\n });\r\n if (clientId) {\r\n projectTypeService.getProjectTypes(clientId).then(res => {\r\n setProjectTypeList(res);\r\n });\r\n } else {\r\n projectTypeService.getAllProjectTypes().then(res => {\r\n setProjectTypeList(res);\r\n })\r\n }\r\n\r\n }, [show, clientId, projectToEditId]);\r\n\r\n // Function to determine initial values based on operation\r\n const getInitialValues = () => {\r\n if (projectToEditId) {\r\n // Editing an existing project, return the project values\r\n return {\r\n id: project.id,\r\n projectName: project.projectName,\r\n clientId: project.clientId,\r\n scanDate: moment(project.scanDate).format('yyyy-MM-DD'),\r\n modelLink: project.modelLink,\r\n projectTypeId: project.projectTypeId,\r\n notes: project.notes,\r\n isDeleted: project.isDeleted,\r\n filesToSave: [],\r\n };\r\n } else {\r\n return initialState;\r\n }\r\n };\r\n\r\n\r\n const formik = useFormik({\r\n enableReinitialize: true,\r\n initialValues: getInitialValues(),\r\n validationSchema: CreateProjectValidator,\r\n onSubmit: (values, { setStatus, setSubmitting }) => {\r\n saveProject(values, setSubmitting)\r\n }\r\n });\r\n\r\n const handleFileUpload = (fileItems) => {\r\n setProjectImages(fileItems.map((fileItem) => (fileItem.file)));\r\n };\r\n\r\n const saveProject = (values, setSubmitting) => {\r\n setProcessing(true);\r\n setLoading(true);\r\n setIsProjectSubmitting(true);\r\n if (!values.modelLink && !projectImages.length > 0) {\r\n window.alert('Please upload images for the project or enter your model link to proceed.')\r\n }\r\n else {\r\n var valueToPost = values;\r\n\r\n if (nspectionTypeSelected && constants[nspectionTypeSelected]) {\r\n valueToPost = { ...valueToPost, formJson: JSON.stringify(fillJsonFormValue()) }\r\n }\r\n\r\n var model = convertJsonToFormData(valueToPost);\r\n projectImages.forEach(file => {\r\n model.append(\"filesToSave\", file);\r\n });\r\n projectService.saveProject(model).then(res => {\r\n showAlert({ message: res.message, variant: 'success' });\r\n reloadTable();\r\n hideModal();\r\n }).catch(ex => {\r\n showAlert({ message: ex.message, variant: 'error' });\r\n }).finally(() => {\r\n setSubmitting(false);\r\n setProcessing(false);\r\n hideConfirmModal();\r\n setLoading(false);\r\n })\r\n }\r\n }\r\n\r\n const fillJsonFormValue = () => {\r\n const tempFormJson = formJson;\r\n const objectKeys = Object.keys(formFieldValues);\r\n\r\n for (let i = 0; i < objectKeys.length; i += 1) {\r\n for (let j = 0; j < tempFormJson.length; j += 1) {\r\n const currentKey = objectKeys[i];\r\n\r\n if (tempFormJson[j].key === currentKey) {\r\n tempFormJson[j].value = formFieldValues[currentKey];\r\n break;\r\n }\r\n }\r\n }\r\n\r\n return tempFormJson;\r\n }\r\n\r\n const hideModal = () => {\r\n // Clear Formik form\r\n formik.resetForm();\r\n setProject(initialState);\r\n\r\n // Clear FilePond files\r\n setProjectImages([]);\r\n setFilePondFiles([]);\r\n\r\n hide();\r\n\r\n // Debug logging\r\n console.log(\"FilePond files cleared\");\r\n\r\n // Create a new instance of FilePond and replace the current instance\r\n if (filePondInstance) {\r\n const newFilePondInstance = FilePond.create(); // Create a new FilePond instance\r\n setFilePondInstance(newFilePondInstance);\r\n }\r\n\r\n setFormJson(null);\r\n setNspectionTypeSelected(null);\r\n setFormFieldValues({});\r\n };\r\n\r\n const renderFormField = (field) => {\r\n let {\r\n type,\r\n key,\r\n label,\r\n value,\r\n } = field;\r\n switch (type) {\r\n case 'text':\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n \r\n Clients\r\n \r\n \r\n View and Manage Clients\r\n \r\n
\r\n\r\n {\r\n auth.role === 'SuperAdmin' ?\r\n <>\r\n {\r\n setClientToEditId(null);\r\n setClientModalVisible(true);\r\n }}\r\n className=\"btn btn-success font-weight-bolder font-size-sm mr-3\"\r\n >\r\n Add Client\r\n \r\n \r\n :\r\n <>\r\n }\r\n\r\n
\r\n \r\n loadClientTable()}\r\n resetClientToEdit={() => setClientToEditId(null)}\r\n show={clientModalVisible}\r\n hide={() => setClientModalVisible(false)}\r\n />\r\n
\r\n \r\n {\r\n handleValueChange(target.value, key);\r\n }}\r\n />\r\n
\r\n );\r\n case 'date':\r\n return (\r\n \r\n handleValueChange(target.value, key)}\r\n InputLabelProps={{\r\n shrink: true,\r\n }}\r\n />\r\n
\r\n );\r\n default:\r\n return Loading...
;\r\n }\r\n };\r\n\r\n\r\n return (\r\n{activeProjects[dataIndex].projectType}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"client\",\r\n label: \"Client\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n{activeProjects[dataIndex].client}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"scanDate\",\r\n label: \"Scan Date\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n{moment(activeProjects[dataIndex].scanDate).format('MM/DD/yyyy')}
\r\n )\r\n }\r\n },\r\n },\r\n\r\n {\r\n name: \"id\",\r\n label: \"Actions\",\r\n options: {\r\n filter: false,\r\n sort: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n\r\n \r\n View\r\n \r\n {\r\n (auth.role === 'SuperAdmin' || auth.role === 'Admin' || auth.role === 'Manager' || auth.role === 'User') &&\r\n (\r\n <>\r\n {\r\n setProjectToEditId(activeProjects[dataIndex].id);\r\n setAddProjectModalVisible(true);\r\n }}\r\n >\r\n Edit\r\n \r\n \r\n )\r\n }\r\n {\r\n (auth.role === 'SuperAdmin' || auth.role === 'Admin' || auth.role === 'Manager') &&\r\n showConfirmModal({\r\n title: \"Delete Nspection\",\r\n text: \"Are you sure you want to delete this project?\",\r\n rightBtnText: \"Confirm\",\r\n btnAction: () => deleteProject(activeProjects[dataIndex].id, activeProjects[dataIndex].clientId, activeProjects[dataIndex].projectTypeId, activeProjects[dataIndex].scanDate, false, true)\r\n })\r\n }\r\n >\r\n Delete\r\n \r\n }\r\n\r\n
\r\n );\r\n }\r\n }\r\n }\r\n ];\r\n\r\n const completed_columns = [\r\n {\r\n name: \"projectName\",\r\n label: \"Nspection Name\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n },\r\n },\r\n {\r\n name: \"projectType\",\r\n label: \"Nspection Type\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n {completedProjects[dataIndex].projectType}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"client\",\r\n label: \"Client\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n{completedProjects[dataIndex].client}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"scanDate\",\r\n label: \"Scan Date\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n{moment(completedProjects[dataIndex].scanDate).format('MM/DD/yyyy')}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"completedDateTime\",\r\n label: \"Completed Date\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n{moment(completedProjects[dataIndex].completedDateTime).format('MM/DD/yyyy')}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"id\",\r\n label: \"Actions\",\r\n options: {\r\n filter: false,\r\n sort: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n <>\r\n{archivedProjects[dataIndex].projectType}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"client\",\r\n label: \"Client\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n{archivedProjects[dataIndex].client}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"scanDate\",\r\n label: \"Scan Date\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n{moment(archivedProjects[dataIndex].scanDate).format('MM/DD/yyyy')}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"id\",\r\n label: \"Actions\",\r\n options: {\r\n filter: false,\r\n sort: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n <>\r\n {\r\n (auth.role === \"SuperAdmin\" || auth.role === \"Admin\" || auth.role === 'Manager') ?\r\n showConfirmModal({\r\n title: \"Retrieve\",\r\n text: \"Are you sure you want to retrieve this project?\",\r\n rightBtnText: \"Confirm\",\r\n btnAction: () => deleteProject(archivedProjects[dataIndex].id, archivedProjects[dataIndex].clientId, archivedProjects[dataIndex].projectTypeId, archivedProjects[dataIndex].scanDate, false, false)\r\n })\r\n }\r\n >\r\n Retrieve Nspection\r\n \r\n : <>\r\n }\r\n \r\n );\r\n }\r\n }\r\n }\r\n ];\r\n\r\n const deleteProject = (projectId, clientId, projectTypeId, scanDate, isCompleted, isDeleted) => {\r\n setProcessing(true);\r\n let newModel = { ...deleteProjectModel, isDeleted: isDeleted, id: projectId, clientId: clientId, projectTypeId: projectTypeId, scanDate: scanDate };\r\n projectService.deleteProjectByIsDeleteFlag(newModel).then(res => {\r\n showAlert({ message: res.message, variant: 'success' })\r\n loadCompletedProjectTable();\r\n loadActiveProjectTable();\r\n loadArchivedProjectTable();\r\n }).catch(ex => {\r\n showAlert({ message: ex.message, variant: 'error' });\r\n }).finally(() => {\r\n setProcessing(false);\r\n hideConfirmModal();\r\n })\r\n }\r\n\r\n return (\r\n <>\r\n\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Active Nspections\r\n \r\n \r\n View and Manage Active Nspections\r\n \r\n
\r\n\r\n {\r\n (auth.role === \"SuperAdmin\" || auth.role === \"Admin\" || auth.role === 'Manager' || auth.role === 'User') ?\r\n {\r\n setProjectToEditId(null);\r\n setAddProjectModalVisible(true);\r\n }}\r\n className=\"btn btn-success font-weight-bolder font-size-sm mr-3\"\r\n >\r\n Add Nspection\r\n \r\n : <>\r\n }\r\n
\r\n \r\n {\r\n setAddProjectModalVisible(false);\r\n setProjectToEditId(null);\r\n }}\r\n resetProjectToEdit={() => setProjectToEditId(null)}\r\n reloadTable={() => loadActiveProjectTable()}\r\n /> : <>\r\n }\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Completed Nspections\r\n \r\n \r\n View and Manage Completed Nspections\r\n \r\n
\r\n\r\n
\r\n \r\n {(auth.role === \"SuperAdmin\" || auth.role === \"Admin\" || auth.role === 'Manager') &&\r\n
\r\n
\r\n }\r\n\r\n\r\n \r\n )\r\n}\r\n\r\nconst mapStateToProps = (state) => ({\r\n auth: state.auth\r\n})\r\n\r\nexport default connect(mapStateToProps, { ...alert.actions, ...confirmModal.actions })(ProjectListingPage);","import React, { useState } from \"react\";\r\n// import MatterportModelWindow from '../../../app/components/MatterportModelWindow';\r\n// import MatterportPointWindow from '../../../app/components/MatterportPointWindow';\r\n// import AddPointModal from '../../../app/components/AddPointModal';\r\n// import FullWidthTable from '../../../app/components/FullWidthTable';\r\n// import TableFullWidth from '../../../app/components/TableFullWidth';\r\nimport UserListingPage from '../../../app/pages/management/user/UserListingPage';\r\nimport ClientListingPage from '../../../app/pages/management/client/ClientListingPage';\r\nimport ProjectListingPage from '../../../app/pages/services/project/ProjectListingPage';\r\n\r\nimport { connect } from \"react-redux\";\r\n\r\nconst Demo3Dashboard = (props) => {\r\n const { auth } = props;\r\n return (\r\n <>\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Archived Nspections\r\n \r\n \r\n View and Manage Archived Nspections\r\n \r\n
\r\n\r\n
\r\n \r\n {\r\n auth.role === \"SuperAdmin\" ?\r\n <>\r\n
\r\n
\r\n
*/}\r\n {/* end::Row */}\r\n\r\n {/* begin::Row */}\r\n {/* \r\n
\r\n \r\n
\r\n \r\n
*/}\r\n {/* end::Row */}\r\n\r\n\r\n {/* begin::Row */}\r\n {/* \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
*/}\r\n {/* end::Row */}\r\n\r\n {/* \r\n
\r\n \r\n
*/}\r\n\r\n {/* begin::Row */}\r\n {/* \r\n
\r\n \r\n
*/}\r\n {/* end::Row */}\r\n\r\n {/* begin::Row */}\r\n {/* \r\n
\r\n \r\n
\r\n \r\n
*/}\r\n {/* end::Row */}\r\n\r\n {/* end::Dashboard */}\r\n \r\n );\r\n}\r\n\r\nconst mapStateToProps = (state) => ({\r\n auth: state.auth\r\n})\r\n\r\nexport default connect(mapStateToProps, null)(Demo3Dashboard);","import React from \"react\";\r\n\r\nexport function Demo4Dashboard() {\r\n return <>;\r\n}\r\n","import React from \"react\";\r\n\r\nexport function Demo5Dashboard() {\r\n return <>;\r\n}\r\n","import React from \"react\";\r\n\r\nexport function Demo6Dashboard() {\r\n return <>;\r\n}\r\n","import React from \"react\";\r\n\r\nexport function Demo7Dashboard() {\r\n return <>;\r\n}\r\n","import React, {useMemo} from \"react\";\r\nimport objectPath from \"object-path\";\r\nimport {useHtmlClassService} from \"../../layout\";\r\nimport {Demo1Dashboard} from \"./Demo1Dashboard\";\r\nimport {Demo2Dashboard} from \"./Demo2Dashboard\";\r\nimport Demo3Dashboard from \"./Demo3Dashboard\";\r\nimport {Demo4Dashboard} from \"./Demo4Dashboard\";\r\nimport {Demo5Dashboard} from \"./Demo5Dashboard\";\r\nimport {Demo6Dashboard} from \"./Demo6Dashboard\";\r\nimport {Demo7Dashboard} from \"./Demo7Dashboard\";\r\n\r\nexport function Dashboard() {\r\n const uiService = useHtmlClassService();\r\n const layoutProps = useMemo(() => {\r\n return {\r\n demo: objectPath.get(\r\n uiService.config,\r\n \"demo\"\r\n )};\r\n }, [uiService]);\r\n return <>\r\n {layoutProps.demo === 'demo1' && \r\n
\r\n \r\n
\r\n \r\n The layout builder is to assist your set and configure your preferred\r\n project layout specifications and preview it in real time. The\r\n configured layout options will be saved until you change or reset\r\n them. To use the layout builder, choose the layout options and click\r\n the Preview button to preview the changes.\r\n
\r\n {/*Header*/}\r\n
\r\n\r\n {/*Config*/}\r\n \r\n \r\n \r\n {\r\n setKey(0);\r\n saveCurrentTab(0);\r\n }}\r\n >\r\n Mobile Header\r\n \r\n \r\n \r\n {\r\n setKey(1);\r\n saveCurrentTab(1);\r\n }}\r\n >\r\n Subheader\r\n \r\n \r\n \r\n {\r\n setKey(2);\r\n saveCurrentTab(2);\r\n }}\r\n >\r\n Content\r\n \r\n \r\n \r\n {\r\n setKey(3);\r\n saveCurrentTab(3);\r\n }}\r\n >\r\n Aside\r\n \r\n \r\n \r\n {\r\n setKey(4);\r\n saveCurrentTab(4);\r\n }}\r\n >\r\n Footer\r\n \r\n \r\n \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n Enable fixed header for mobile mode\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n\r\n \r\n Display subheader \r\n
\r\n \r\n \r\n
\r\n\r\n \r\n \r\n Enable fixed(sticky) subheader. Requires{\" \"}\r\n \r\n
\r\n Solid subheader style.\r\n \r\n \r\n
\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n Select layout width type\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n Select subheader style\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n Select layout width type\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n\r\n \r\n \r\n Display aside secondary panel\r\n \r\n
\r\n \r\n \r\n
\r\n\r\n \r\n \r\n Allow aside minimizing\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n Set aside minimized by default\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n\r\n \r\n \r\n Set fixed footer for desktop mode only\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n Select layout width type\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n Preview\r\n {\" \"}\r\n \r\n Reset\r\n {\" \"}\r\n
\r\n /src/_metronic/layout/LayoutConfig.js\r\n \r\n \r\n }\r\n />\r\n\r\n \r\n
\r\n
\r\n\r\n
{projectTypes[dataIndex].client}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"id\",\r\n label: \"Actions\",\r\n options: {\r\n filter: false,\r\n sort: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n <>\r\n\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Nspection Type\r\n \r\n \r\n View and Manage Active Nspection Types\r\n \r\n
\r\n\r\n {\r\n (auth.role === \"SuperAdmin\" || auth.role === \"Admin\" || auth.role === 'Manager') ?\r\n setAddProjectTypeModalVisible(true)}\r\n className=\"btn btn-success font-weight-bolder font-size-sm mr-3\"\r\n >\r\n Add Nspection Type\r\n \r\n : <>\r\n }\r\n
\r\n \r\n setManageProjectTypeModalVisible(false)}\r\n reloadTable={() => loadProjectTypes()}\r\n />\r\n setUpdateProjectTypeModalVisible(false)}\r\n reloadTable={() => loadProjectTypes()}\r\n />\r\n setAddProjectTypeModalVisible(false)}\r\n reloadTable={() => loadProjectTypes()}\r\n />\r\n \r\n }\r\n\r\n
\r\n \r\n \r\n )\r\n}\r\n\r\nconst mapStateToProps = (state) => ({\r\n auth: state.auth\r\n})\r\n\r\nexport default connect(mapStateToProps, { ...alert.actions, ...confirmModal.actions })(ProjectTypeListingPage);","import axiosInstance from '../apiService';\r\nimport constants from '../../constants/constants';\r\n\r\nconst ENDPOINTORIGIN = \"ProjectPin/\";\r\n\r\nconst getProjectPinById = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectPinById?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getProjectPinsByProjectId = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectPinsByProjectId?projectId=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getProjectPinsByProjectIdForReport = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectPinsByProjectIdForReport?projectId=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getProjectPinsByProjectIdAndImageId = async (id, imageId) => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectPinsByProjectIdAndImageId?projectId=' + id + '&imageId=' + imageId, constants.REQUIRE_INTERCEPTORS);\r\nconst getProjectPinsByProjectIdAndImageIdForShareable = async (token) => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectPinsByProjectIdAndImageIdForShareable?token=' + token, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getProjectPinsByProjectIdForSharable = async (token) => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectPinsByProjectIdForSharable?token=' + token, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getProjectPinsByProjectIdForReportSharable = async (token) => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectPinsByProjectIdForReportSharable?token=' + token, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getProjectPins = async () => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectPins', constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst saveProjectPin = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'SaveProjectPin', model, { ...constants.REQUIRE_INTERCEPTORS });\r\n\r\nconst saveProjectPinAnonymous = async (formData, data) => {\r\n try {\r\n formData.append('projectPinCheckBoxes', JSON.stringify(data.projectPinCheckBoxes));\r\n formData.append('projectPinCustomFields', JSON.stringify(data.projectPinCustomFields));\r\n\r\n const response = await axiosInstance.post(ENDPOINTORIGIN + 'SaveProjectPinAnonymous', formData, {\r\n ...constants.REQUIRE_INTERCEPTORS,\r\n fileHandler: true,\r\n });\r\n console.log('RESPONSE', response)\r\n if (response) {\r\n return response;\r\n }\r\n } catch (error) {\r\n console.log('Error when posting anonymous Project Pin:', error);\r\n }\r\n};\r\n\r\nconst updateProjectPin = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'UpdateProjectPin', model, { ...constants.REQUIRE_INTERCEPTORS, fileHandler: true });\r\n\r\nconst deleteProjectPin = async (id, isDeleted) => await axiosInstance.get(ENDPOINTORIGIN + 'DeleteProjectPin?id=' + id + '&isDeleted=' + isDeleted, constants.REQUIRE_INTERCEPTORS);\r\n\r\nexport {\r\n getProjectPinById,\r\n getProjectPinsByProjectIdForSharable,\r\n getProjectPinsByProjectIdForReportSharable,\r\n getProjectPins,\r\n saveProjectPin,\r\n deleteProjectPin,\r\n updateProjectPin,\r\n getProjectPinsByProjectIdForReport,\r\n getProjectPinsByProjectIdAndImageId,\r\n saveProjectPinAnonymous,\r\n getProjectPinsByProjectIdAndImageIdForShareable,\r\n getProjectPinsByProjectId\r\n}","import axiosInstance from '../apiService';\r\nimport constants from '../../constants/constants';\r\n\r\nconst ENDPOINTORIGIN = \"ProjectPinComment/\";\r\n\r\nconst getProjectPinCommentById = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectPinCommentById?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getProjectPinCommentByProjectPinId = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectPinCommentByProjectPinId?projPinId=' + id , constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getProjectPinComments = async () => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectPinComments', constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst saveProjectPinComment = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'SaveProjectPinComment', model, {...constants.REQUIRE_INTERCEPTORS, fileHandler:true});\r\nconst addAnonymousComments = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'AddAnonymousComments', model, constants.REQUIRE_INTERCEPTORS);\r\nconst deleteProjectPinComment = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'DeleteProjectPinComment?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nexport {\r\n getProjectPinCommentById,\r\n getProjectPinCommentByProjectPinId,\r\n getProjectPinComments,\r\n saveProjectPinComment,\r\n addAnonymousComments,\r\n deleteProjectPinComment\r\n}","import * as Yup from \"yup\";\r\n\r\nconst ProjectPinCommentValidator = Yup.object().shape({\r\n id: Yup.number(),\r\n comment: Yup.string(),\r\n anonymousName: Yup.string(),\r\n});\r\n\r\nexport default ProjectPinCommentValidator;","/* eslint-disable no-restricted-imports */\r\nimport React, { useState, useEffect } from 'react';\r\nimport { Modal, Button, Col, Row } from 'react-bootstrap';\r\nimport { connect } from 'react-redux';\r\nimport constants from \"../../constants/constants\";\r\nimport { convertJsonToFormData } from '../../helpers/helper';\r\nimport { useFormik } from \"formik\";\r\nimport * as alert from '../../redux/alertSnackBarRedux';\r\nimport ProjectPinCommentValidator from '../../helpers/validators/ProjectPinCommentValidator';\r\n\r\nimport { FilePond, registerPlugin } from \"react-filepond\";\r\nimport TextField from '@material-ui/core/TextField';\r\nimport FormControl from '@material-ui/core/FormControl';\r\n\r\nimport \"filepond/dist/filepond.min.css\";\r\nimport FilePondPluginImageExifOrientation from \"filepond-plugin-image-exif-orientation\";\r\nimport FilePondPluginImagePreview from \"filepond-plugin-image-preview\";\r\nimport \"filepond-plugin-image-preview/dist/filepond-plugin-image-preview.css\";\r\n\r\nimport * as projectPinService from '../../services/service/projectPinService';\r\nimport * as projectPinCommentService from '../../services/settings/projectPinCommentService';\r\n\r\nregisterPlugin(FilePondPluginImageExifOrientation, FilePondPluginImagePreview);\r\nconst moment = require('moment');\r\n\r\nconst initialModel = {\r\n id: 0,\r\n comment: '',\r\n projectPinId: 0,\r\n projectTypePOIStatusId: 0,\r\n userId: null,\r\n poiResolutionImagePath: '',\r\n matterportResolutionLink: '',\r\n isDeleted: false,\r\n commentedOn: moment().format('MM/DD/yyyy hh:mm a'),\r\n user: null,\r\n projectPin: {},\r\n projectTypePOIStatus: null\r\n};\r\n\r\nconst ResolvePOIStatusModal = (props) => {\r\n\r\n const { show, hide, projectPin, onModalClose, showAlert, auth } = props;\r\n const poiResolutionImagePathCondition = (projectPin && projectPin.projectPinComments && projectPin.projectPinComments.length) ? projectPin.projectPinComments[0].poiResolutionImagePath\r\n : projectPin.poiResolutionImagePath;\r\n const matterportResolutionLinkCondition = (projectPin && projectPin.projectPinComments && projectPin.projectPinComments.length) ? projectPin.projectPinComments[0].matterportResolutionLink\r\n : projectPin.matterportResolutionLink;\r\n const projectPinComment = { ...initialModel, projectPin: projectPin, poiResolutionImagePath: poiResolutionImagePathCondition, matterportResolutionLink: matterportResolutionLinkCondition };\r\n const [poiImage, setPoiImage] = useState([]);\r\n const [poiResolutionImagePath, setPoiResolutionImagePath] = useState('');\r\n const [poiMatterPortResolutionLink, setPoiMatterPortResolutionLink] = useState('');\r\n const [manageOptionVisible, setManageOptionVisible] = useState(true);\r\n const [poiMatterPortResolutionLinkVisible, setPoiMatterPortResolutionLinkVisible] = useState(false);\r\n const [poiImageUploaderVisible, setPoiImageUploaderVisible] = useState(false);\r\n\r\n useEffect(() => {\r\n if (projectPin && show) {\r\n\r\n setPoiResolutionImagePath(poiResolutionImagePathCondition);\r\n setPoiMatterPortResolutionLink(matterportResolutionLinkCondition);\r\n formik.setFieldValue(\"matterportResolutionLink\", matterportResolutionLinkCondition);\r\n\r\n\r\n if (poiResolutionImagePathCondition && !matterportResolutionLinkCondition) {\r\n setPoiImageUploaderVisible(true);\r\n setPoiMatterPortResolutionLinkVisible(false);\r\n setManageOptionVisible(false);\r\n }\r\n if (!poiResolutionImagePathCondition && matterportResolutionLinkCondition) {\r\n\r\n setPoiMatterPortResolutionLinkVisible(true);\r\n setPoiImageUploaderVisible(false);\r\n setManageOptionVisible(false);\r\n }\r\n if (!poiResolutionImagePathCondition && !matterportResolutionLinkCondition) {\r\n setPoiMatterPortResolutionLinkVisible(false);\r\n setPoiImageUploaderVisible(false);\r\n setManageOptionVisible(true);\r\n }\r\n }\r\n }, [projectPin, show]);\r\n\r\n const handleUploadImage = (e) => {\r\n setPoiImageUploaderVisible(true);\r\n setPoiMatterPortResolutionLinkVisible(false);\r\n formik.setFieldValue(\"matterportResolutionLink\", '');\r\n setPoiMatterPortResolutionLink('')\r\n setManageOptionVisible(false);\r\n }\r\n\r\n const handleMatterPortResolutionLink = (e) => {\r\n setPoiMatterPortResolutionLinkVisible(true);\r\n setPoiImageUploaderVisible(false);\r\n setPoiResolutionImagePath('');\r\n setPoiImage([]);\r\n setManageOptionVisible(false);\r\n }\r\n\r\n const handleAcceptPoiStatus = () => {\r\n projectPinService.saveProjectPin({ ...projectPin, isApproved: true, isResolved: true })\r\n .then(async res => {\r\n onModalClose();\r\n hideModal();\r\n showAlert({ message: res.message, variant: 'success' });\r\n }).catch(ex => {\r\n showAlert({ message: ex.message, variant: 'error' });\r\n });\r\n }\r\n\r\n const handleRejectPoiStatus = () => {\r\n projectPinService.saveProjectPin({ ...projectPin, isApproved: false, isResolved: false })\r\n .then(async res => {\r\n onModalClose();\r\n hideModal();\r\n showAlert({ message: res.message, variant: 'success' });\r\n }).catch(ex => {\r\n showAlert({ message: ex.message, variant: 'error' });\r\n });\r\n }\r\n\r\n const formik = useFormik({\r\n enableReinitialize: true,\r\n initialValues: projectPinComment,\r\n validationSchema: ProjectPinCommentValidator,\r\n onSubmit: async (values, { setStatus, setSubmitting }) => {\r\n addProjectPinComment(values, setSubmitting);\r\n }\r\n });\r\n\r\n const addProjectPinComment = (values, setSubmitting) => {\r\n let finalModel = {\r\n ...values,\r\n poiResolutionImageFile: poiImage.length > 0 ? poiImage[0].file : null,\r\n poiResolutionImagePath: poiResolutionImagePath,\r\n comment: '',\r\n projectPinId: projectPin.id,\r\n projectTypePOIStatusId: projectPin.projectTypePOIStatusId,\r\n projectPin: projectPin\r\n };\r\n\r\n projectPinCommentService.saveProjectPinComment(convertJsonToFormData(finalModel))\r\n .then(async res => {\r\n onModalClose();\r\n hideModal();\r\n showAlert({ message: res.message, variant: 'success' });\r\n }).catch(ex => {\r\n showAlert({ message: ex.message, variant: 'error' });\r\n }).finally(() => {\r\n setSubmitting(false);\r\n })\r\n }\r\n\r\n const hideModal = () => {\r\n hide();\r\n }\r\n\r\n\r\n const handleOnPressUploadImage = () => {\r\n handleUploadImage();\r\n }\r\n const handleOnPressAddMatterPortResolutionLink = () => {\r\n handleMatterPortResolutionLink();\r\n }\r\n\r\n return (\r\n
\r\n setResolvePOIStatusModalVisible(false)}\r\n refreshStates={resolveStatusModalRefreshStates}\r\n onModalClose={() => {\r\n reloadTable();\r\n hideModal();\r\n }}\r\n />\r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Custom Field \r\n \r\n {projectTypeCustomFieldList\r\n .filter(field => !selectedProjectTypeCustomFields.includes(field.name))\r\n .map(field => (\r\n \r\n ))}\r\n \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 linkUploader = () => {\r\n setHideButtons(true);\r\n setIsProject3dUploader(true);\r\n const newModelLink = project.modelLink;\r\n formik.setFieldValue(\"modelLink\", newModelLink);\r\n // setProject3DLinkOutput(\r\n // \r\n \r\n 2D Nspection \r\n \r\n
\r\n\r\n \r\n //
\r\n // )\r\n }\r\n\r\n const updateProjectImages = (values, setSubmitting) => {\r\n var model = convertJsonToFormData({ ...project, ...values });\r\n projectImages.forEach(file => {\r\n model.append(\"filesToSave\", file);\r\n });\r\n projectService.updateImages(model).then(res => {\r\n showAlert({ message: res.message, variant: 'success' });\r\n hideModal();\r\n }).catch(ex => {\r\n showAlert({ message: ex.message, variant: 'error' });\r\n }).finally(() => {\r\n setSubmitting(false);\r\n hideConfirmModal();\r\n })\r\n }\r\n\r\n const updateProject3dModel = (values, setSubmitting) => {\r\n projectService.udpate3dLink({ ...project, ...values }).then(res => {\r\n showAlert({ message: res.message, variant: 'success' });\r\n hideModal();\r\n }).catch(ex => {\r\n showAlert({ message: ex.message, variant: 'error' });\r\n }).finally(() => {\r\n setSubmitting(false);\r\n hideConfirmModal();\r\n })\r\n }\r\n\r\n const hideModal = () => {\r\n setProjectImages([]);\r\n formik.resetForm();\r\n setHideButtons(false);\r\n setIsProject3dUploader(false);\r\n setImageUploaderOutput(null);\r\n setProject3DLinkOutput(null);\r\n hide();\r\n refresh();\r\n }\r\n\r\n return (\r\n \r\n // {formik.errors.modelLink}\r\n //
\r\n // ) : null}\r\n // \r\n {\r\n if (highlightedAnnotationIndex) {\r\n removeSelectedMatterTag()\r\n }\r\n }}\r\n >\r\n Hover for details\r\n
\r\n {savedProjectPins[dataIndex].pointCategory}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"projectTypePOIStatus\",\r\n label: \"N-Point Status\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n{savedProjectPins[dataIndex].projectTypePOIStatus ? savedProjectPins[dataIndex].projectTypePOIStatus : '-'}
\r\n )\r\n }\r\n },\r\n },\r\n ...(isBusinessTier ?\r\n [{\r\n name: \"isResolved\",\r\n label: \"Resolved\",\r\n options: {\r\n filter: true,\r\n sort: false,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n\r\n
\r\n \r\n );\r\n}\r\n\r\nconst mapStateToProps = (state) => ({\r\n auth: state.auth\r\n})\r\n\r\nexport default connect(mapStateToProps, { ...alert.actions, ...confirmModal.actions })(ProjectEditPage);","import React, { useEffect, useState, createRef, useRef } from 'react';\r\nimport { connect } from \"react-redux\";\r\nimport { Modal, Button } from 'react-bootstrap';\r\nimport { useParams, useHistory } from 'react-router-dom';\r\nimport '../../_metronic/_assets/css/Chargify.css';\r\nimport * as alert from \"../../redux/alertSnackBarRedux\";\r\nimport * as confirmModal from \"../../redux/confirmModalRedux\";\r\nimport * as authRedux from \"../../app/modules/Auth/_redux/authRedux\";\r\nimport * as settingService from '../../services/settings/settingService';\r\nimport * as clientServices from '../../services/management/clientService';\r\nimport * as clientTierServices from '../../services/management/clientTierService';\r\n\r\nconst AddPaymentModal = (props) => {\r\n const { open, handleClose, clientId, showAlert } = props;\r\n const form = createRef();\r\n var chargify = useRef(new window.Chargify());\r\n const [securityToken, setSecurityToken] = useState(null);\r\n const [clientInfo, setClientInfo] = useState({});\r\n const [publicKey, setPublicKey] = useState('');\r\n const [serverHost, setServerHost] = useState('');\r\n const [loading, setLoading] = useState(false);\r\n\r\n useEffect(() => {\r\n fetchServerHost();\r\n fetchChargifyPublicKey();\r\n if (clientId) {\r\n fetchClientInfoById(clientId);\r\n }\r\n generateSecurityToken();\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (open && securityToken) {\r\n chargify.current.load({\r\n publicKey: publicKey,\r\n securityToken: securityToken,\r\n type: 'card',\r\n serverHost: serverHost,\r\n hideCardImage: false,\r\n optionalLabel: '(optional field)',\r\n requiredLabel: '*',\r\n addressDropdowns: true,\r\n fields: {\r\n firstName: {\r\n selector: '#chargify1',\r\n label: 'First Name on Account',\r\n required: false,\r\n value: clientInfo.contactName.split(' ')[0] ? clientInfo.contactName.split(' ')[0] : '',\r\n message: 'First name is not valid. Please update it.',\r\n maxlength: '30',\r\n },\r\n lastName: {\r\n selector: '#chargify2',\r\n label: 'Last Name on Account',\r\n required: false,\r\n value: clientInfo.contactName.split(' ')[1] ? clientInfo.contactName.split(' ')[1] : '',\r\n message: 'This field is not valid. Please update it.',\r\n maxlength: '30',\r\n },\r\n number: {\r\n selector: '#chargify3',\r\n label: 'Number',\r\n placeholder: 'xxxx xxxx xxxx xxxx',\r\n message: 'This field is not valid. Please update it.',\r\n },\r\n month: {\r\n selector: '#chargify4',\r\n label: 'Mon',\r\n placeholder: 'mm',\r\n message: 'This field is not valid. Please update it.',\r\n },\r\n year: {\r\n selector: '#chargify5',\r\n label: 'Year',\r\n placeholder: 'yyyy',\r\n message: 'This field is not valid. Please update it.',\r\n },\r\n cvv: {\r\n selector: '#chargify6',\r\n label: 'CVV code',\r\n placeholder: '123',\r\n required: false,\r\n message: 'This field is not valid. Please update it.',\r\n },\r\n address: {\r\n selector: '#chargify7',\r\n label: 'Address',\r\n placeholder: '1234 Hill St',\r\n required: false,\r\n message: 'This field is not valid. Please update it.',\r\n maxlength: '70',\r\n },\r\n address2: {\r\n selector: '#chargify8',\r\n label: 'Address 2',\r\n placeholder: '1234 Hill St',\r\n required: false,\r\n message: 'This field is not valid. Please update it.',\r\n maxlength: '70',\r\n },\r\n city: {\r\n selector: '#chargify9',\r\n label: 'City',\r\n placeholder: 'Austin',\r\n required: false,\r\n message: 'This field is not valid. Please update it.',\r\n maxlength: '30',\r\n },\r\n country: {\r\n selector: '#chargify10',\r\n label: 'Country',\r\n placeholder: 'Select...',\r\n required: false,\r\n message: 'This field is not valid. Please update it.',\r\n maxlength: '2',\r\n },\r\n state: {\r\n selector: '#chargify11',\r\n label: 'State',\r\n placeholder: 'Select...',\r\n required: false,\r\n message: 'This field is not valid. Please update it.',\r\n maxlength: '2',\r\n },\r\n zip: {\r\n selector: '#chargify12',\r\n label: 'Zip Code',\r\n placeholder: '10001',\r\n required: false,\r\n message: 'This field is not valid. Please update it.',\r\n maxlength: '5',\r\n },\r\n },\r\n });\r\n }\r\n\r\n }, [open, securityToken]);\r\n\r\n const fetchChargifyPublicKey = () => {\r\n settingService.getSettingByKey(\"ChargifyPublicKey\").then(res => {\r\n setPublicKey(res);\r\n }).catch(err => {\r\n console.log(\"unable to fetch public key for chargify\", err);\r\n })\r\n }\r\n\r\n const fetchServerHost = () => {\r\n settingService.getSettingByKey(\"ChargifyURL\").then(res => {\r\n setServerHost(res);\r\n }).catch(err => {\r\n console.log(\"unable to fetch server host for chargify\", err);\r\n })\r\n }\r\n\r\n const fetchClientInfoById = (id) => {\r\n clientServices.getClientById(id).then(res => {\r\n setClientInfo(res);\r\n }).catch(err => {\r\n console.log(err);\r\n })\r\n }\r\n\r\n const generateSecurityToken = () => {\r\n clientServices.generateSecurityToken().then(res => {\r\n setSecurityToken(res);\r\n }).catch(err => {\r\n console.log(err);\r\n })\r\n }\r\n\r\n const handleFormSubmit = (e) => {\r\n e.preventDefault();\r\n chargify.current.token(\r\n form.current,\r\n function success(token) {\r\n setLoading(true);\r\n savePaymentProfileToken(token);\r\n form.submit();\r\n },\r\n function error(err) {\r\n showAlert({ message: err.message, variant: 'error' });\r\n console.log('token ERROR - err: ', err);\r\n }\r\n );\r\n }\r\n\r\n const savePaymentProfileToken = (token) => {\r\n if (token) {\r\n clientServices.savePaymentProfile({ paymentToken: token }).then(res => {\r\n handleClose();\r\n showAlert({ message: res.message, variant: 'success' });\r\n }).catch(err => {\r\n showAlert({ message: err, variant: 'error' });\r\n }).finally(() => {\r\n setLoading(false);\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 project3d && (auth.role !== 'Viewer') &&\r\n \r\n \r\n \r\n {projectType.name}\r\n
\r\n {\r\n isTableLoading &&\r\n
\r\n\r\n \r\n \r\n {projectType.name}\r\n
\r\n {project.projectName}\r\n
\r\n \r\n \r\n \r\n Scan Date: {moment(project.scanDate).format('MMMM Do, YYYY')}\r\n \r\n {\r\n project.completedDateTime ?\r\n \r\n Completed On: {moment(project.completedDateTime).format('MMMM Do, YYYY')}\r\n : <>\r\n }\r\n \r\n
\r\n {\r\n isTableLoading &&\r\n \r\n
\r\n }\r\n \r\n Loading Table...\r\n
\r\n- \r\n {\r\n !(project.modelLink && project.projectModelImages && project.projectModelImages.length > 0) ?\r\n <>\r\n
- \r\n 2D Model\r\n \r\n
- \r\n 3D Model\r\n \r\n \r\n :\r\n <>\r\n
- \r\n {\r\n setProject3d(false);\r\n setCarouselIndex(0);\r\n removeSelectedMatterTag()\r\n setCurrentImageIndex('')\r\n setShowAllChecked(false);\r\n setProjectTypeChangeDetector(!projectTypeChangeDetector);\r\n }}>2D Model\r\n \r\n
- \r\n {\r\n if ((!project.modelLink || project.modelLink.length === 0)) {\r\n e.preventDefault();\r\n return;\r\n }\r\n setProject3d(true);\r\n setCarouselIndex(0);\r\n setCurrentImageIndex('')\r\n removeSelectedMatterTag()\r\n setShowAllChecked(false);\r\n setProjectTypeChangeDetector(!projectTypeChangeDetector);\r\n }}>3D Model\r\n \r\n \r\n }\r\n
\r\n {\r\n (project && !project.completedDateTime && (auth.role === \"SuperAdmin\" || auth.role === \"Admin\" || auth.role === 'Manager' || auth.role === 'User')) ?\r\n setUpdateImagesModalVisible(true)}\r\n className=\"btn btn-success font-weight-bolder font-size-sm mr-3\"\r\n >\r\n Update Model\r\n \r\n : <>\r\n }\r\n \r\n \r\n \r\n Total Issues: {savedProjectPins.length}\r\n {\r\n project.completedDateTime ?\r\n \r\n \r\n \r\n Generate Report\r\n : <>\r\n }\r\n\r\n\r\n
\r\n \r\n {\r\n\r\n project3d && project.modelLink &&\r\n
\r\n \r\n\r\n <>\r\n \r\n \r\n \r\n \r\n \r\n
\r\n }\r\n {\r\n !project3d && project.projectModelImages && project.projectModelImages.length > 0 &&\r\n \r\n
\r\n }\r\n \r\n {\r\n const currentImageId = project.projectModelImages[newActiveIndex].id;\r\n setCurrentImageIndex(currentImageId);\r\n setCarouselIndex(newActiveIndex)\r\n setFetchNewAnnotation(!fetchNewAnnotation)\r\n }}\r\n >\r\n {project.projectModelImages.map((image, index) => (\r\n
\r\n \r\n {renderAnnotations(\r\n constants.API_URL + 'api/' + image.imagePath,\r\n project.projectModelImages[index].id\r\n )}\r\n
\r\n ))}\r\n \r\n \r\n
\r\n }\r\n \r\n handleToggleInspectionModel()}\r\n className=\"btn btn-success btn-fixed-height font-weight-bold px-2 px-lg-5 d-flex justify-content-lg-start\"\r\n >Toggle Inspection Mode\r\n\r\n handleInspectorConditions(false)}\r\n className=\"btn btn-success btn-fixed-height font-weight-bold px-2 px-lg-5 d-flex justify-content-lg-start\"\r\n >Add pointer\r\n
\r\n \r\n
\r\n {\r\n isTableLoading &&\r\n \r\n
\r\n {\r\n !isTableLoading &&\r\n (auth.role === \"SuperAdmin\" || auth.role === \"Admin\" || auth.role === 'Manager') &&\r\n \r\n
\r\n\r\n \r\n \r\n Add N-Point {' '}\r\n \r\n {(selectedPoint || (Object.keys(annotation).length !== 0 && !highlightedAnnotationIndex)) ? 'Active' : '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 showConfirmModal({\r\n title: \"Complete Nspection\",\r\n text: \"Are you sure you want to complete this project?\",\r\n rightBtnText: \"Confirm\",\r\n btnAction: () => markProjectAsComplete()\r\n })}\r\n className=\"btn btn-block btn-white btn-hover-success text-center py-10 px-5 mt-0 mr-3 pin-action-btn\"\r\n >\r\n \r\n \r\n \r\n
New Report\r\n \r\n
\r\n }\r\n New Report\r\n \r\n
\r\n
\r\n }\r\n\r\n\r\n \r\n {\r\n !project3d && project && project.projectModelImages && project.projectModelImages.length > 0 &&\r\n {\r\n if (val) {\r\n fetchProjectPinsForAProjectAndImageId(project, '');\r\n }\r\n else {\r\n setFetchNewAnnotation(!fetchNewAnnotation);\r\n }\r\n setShowAllChecked(val);\r\n }}\r\n />\r\n }\r\n label={`Show All Points`}\r\n labelPlacement=\"end\"\r\n />\r\n\r\n }\r\n setUpdateImagesModalVisible(false)}\r\n refresh={() => { setProjectTypeChangeDetector(!projectTypeChangeDetector) }}\r\n project={project}\r\n /> : <>\r\n }\r\n setUpdateProjectPinModalVisible(false)}\r\n reloadTable={() => {\r\n setIsTableLoading(true);\r\n if (project3d) {\r\n fetchProjectPinsForAProject(project);\r\n }\r\n else {\r\n setFetchNewAnnotation(!fetchNewAnnotation);\r\n }\r\n }}\r\n />\r\n {/* {\r\n setEditedCustomField(null);\r\n setIsModalOpen(false);\r\n }}>\r\n \r\n {editedCustomField ? 'Edit Custom Field' : 'Add Custom Field'} \r\n \r\n \r\n \r\n \r\n {editedCustomField && (\r\n \r\n )}\r\n {!editedCustomField && (\r\n \r\n )}\r\n \r\n \r\n */}\r\n\r\n\r\n\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Custom Field \r\n \r\n {projectTypeCustomFieldList\r\n .filter(field => !selectedProjectTypeCustomFields.includes(field.id))\r\n .map(field => (\r\n \r\n ))}\r\n \r\n\r\n\r\n \r\n \r\n \r\n
\r\n Loading...
\r\n ) : (\r\n \r\n
\r\n )\r\n );\r\n};\r\n\r\nconst mapStateToProps = (state) => ({\r\n auth: state.auth\r\n})\r\n\r\nexport default connect(mapStateToProps, { ...alert.actions, ...confirmModal.actions, ...authRedux.actions })(ChargifyForm);","import React, { useEffect, useState, useRef } from \"react\";\r\nimport { connect } from \"react-redux\";\r\nimport MUIDataTable from \"mui-datatables\";\r\nimport NewProjectModal from \"../../../components/NewProjectModal\";\r\nimport * as alert from \"../../../../redux/alertSnackBarRedux\";\r\nimport * as confirmModal from \"../../../../redux/confirmModalRedux\";\r\nimport * as projectService from '../../../../services/service/projectService';\r\nimport * as projectTypeService from '../../../../services/service/projectTypeService';\r\nimport { Link } from 'react-router-dom';\r\n\r\nconst moment = require('moment');\r\n\r\nconst ProjectTypeEditPage = (props) => {\r\n const { showAlert, showConfirmModal, hideConfirmModal, auth, history } = props;\r\n const [addProjectModalVisible, setAddProjectModalVisible] = useState(false);\r\n const [activeProjects, setActiveProjects] = useState([]);\r\n const [completedProjects, setCompletedProjects] = useState([]);\r\n const [projectTypes, setProjectTypes] = useState([]);\r\n\r\n useEffect(() => {\r\n loadActiveProjectTypesTable();\r\n loadActiveProjectTable();\r\n loadCompletedProjectTable();\r\n }, [history]);\r\n\r\n const loadActiveProjectTable = () => {\r\n projectService.getProjects(false).then(res => {\r\n setActiveProjects(res);\r\n })\r\n }\r\n\r\n const loadCompletedProjectTable = () => {\r\n projectService.getProjects(true).then(res => {\r\n setCompletedProjects(res);\r\n })\r\n }\r\n\r\n const loadActiveProjectTypesTable = () => {\r\n projectTypeService.getAllProjectTypes().then(res=> {\r\n setProjectTypes(res);\r\n })\r\n }\r\n\r\n const columns = [\r\n {\r\n name: \"projectName\",\r\n label: \"Nspection Name\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n },\r\n },\r\n {\r\n name: \"projectTypes\",\r\n label: \"Nspection Type\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n \r\n
\r\n \r\n
\r\n\r\n Update Subscription
\r\n \r\nTo vist our page for detailed information. Click here.
\r\n\r\n \r\n
\r\n\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Choose the tier plan\r\n \r\n
\r\n\r\n setIsIframeVisible(!isIframeVisible)}>\r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n Compare Tier plans
\r\n\r\n \r\n Tier Plan \r\n \r\n \r\n {products\r\n .map(field => (\r\n \r\n ))}\r\n \r\n {isSubmitted && !selectedProductName && You must select an option. }\r\n {(selectedProductName === 'Enterprise') && Please schedule a call with us to buy this payment plan. Click here to continue. }\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Choose the payment method\r\n \r\n
\r\n\r\n \r\n Payment Profile \r\n \r\n\r\n \r\n {paymentProfiles.length > 0 ?\r\n paymentProfiles.map((profile, index) => (\r\n \r\n ))\r\n : \r\n }\r\n \r\n {isSubmitted && !selectedPaymentProfile && You must select a payment profile. }\r\n \r\n {!paymentProfiles.length && Please add a payment profile to proceed. }\r\n
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n\r\n {projectTypes[dataIndex].name}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"clientId\",\r\n label: \"Client\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n{activeProjects[dataIndex].client.businessName}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"scanDate\",\r\n label: \"Scan Date\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n{moment(activeProjects[dataIndex].scanDate).format('MM/DD/yyyy')}
\r\n )\r\n }\r\n },\r\n },\r\n \r\n {\r\n name: \"id\",\r\n label: \"Actions\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n <>\r\n{projectTypes[dataIndex].name}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"clientId\",\r\n label: \"Client\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n{completedProjects[dataIndex].client.businessName}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"scanDate\",\r\n label: \"Scan Date\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n{moment(completedProjects[dataIndex].scanDate).format('MM/DD/yyyy')}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"completedDateTime\",\r\n label: \"Completed Date\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n width: 1,\r\n download: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n{moment(completedProjects[dataIndex].completedDateTime).format('MM/DD/yyyy')}
\r\n )\r\n }\r\n },\r\n },\r\n {\r\n name: \"id\",\r\n label: \"Actions\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n <>\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Active Nspections \r\n \r\n \r\n View and Manage Active Nspections\r\n \r\n
\r\n\r\n {\r\n (auth.role === \"SuperAdmin\" || auth.role === \"Admin\" || auth.role === 'Manager') ?\r\n setAddProjectModalVisible(true)}\r\n className=\"btn btn-success font-weight-bolder font-size-sm mr-3\"\r\n >\r\n Add Nspection\r\n \r\n : <>\r\n }\r\n
\r\n \r\n setAddProjectModalVisible(false)}\r\n reloadTable={() => loadActiveProjectTable()}\r\n /> : <>\r\n }\r\n
\r\n \r\n
\r\n
\r\n \r\n )\r\n}\r\n\r\nconst mapStateToProps = (state) => ({\r\n auth: state.auth\r\n})\r\n\r\nexport default connect(mapStateToProps, { ...alert.actions, ...confirmModal.actions })(ProjectTypeEditPage);","import axiosInstance from '../apiService';\r\nimport constants from '../../constants/constants';\r\n\r\nconst ENDPOINTORIGIN = \"PointCategory/\";\r\n\r\nconst getPointCategoryById = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetPointCategoryById?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getPointCategoryByProjectTypeId = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetPointCategoryByProjectTypeId?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getPointCategories = async () => await axiosInstance.get(ENDPOINTORIGIN + 'GetPointCategories', constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst savePointCategory = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'SavePointCategory', model, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst deletePointCategory = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'DeletePointCategory?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst deletePointCategoryIsDeletedFlag = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'DeletePointCategoryIsDeletedFlag', model, constants.REQUIRE_INTERCEPTORS);\r\n\r\nexport {\r\n getPointCategoryById,\r\n getPointCategoryByProjectTypeId,\r\n getPointCategories,\r\n savePointCategory,\r\n deletePointCategory,\r\n deletePointCategoryIsDeletedFlag\r\n}","import axiosInstance from '../apiService';\r\nimport constants from '../../constants/constants';\r\n\r\nconst ENDPOINTORIGIN = \"ProjectTypeCustomField/\";\r\n\r\nconst getProjectTypeCustomFieldById = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectTypeCustomFieldById?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getProjectTypeCustomFieldByProjectTypeId = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectTypeCustomFieldByProjectTypeId?projTypeId=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getProjectTypeCustomFields = async () => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectTypeCustomFields', constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst saveProjectTypeCustomField = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'SaveProjectTypeCustomField', model, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst deleteProjectTypeCustomField = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'DeleteProjectTypeCustomField?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst deleteProjectTypeCustomFieldIsDeletedFlag = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'DeleteProjectTypeCustomFieldIsDeletedFlag', model, constants.REQUIRE_INTERCEPTORS);\r\n\r\nexport {\r\n getProjectTypeCustomFieldById,\r\n getProjectTypeCustomFieldByProjectTypeId,\r\n getProjectTypeCustomFields,\r\n saveProjectTypeCustomField,\r\n deleteProjectTypeCustomField,\r\n deleteProjectTypeCustomFieldIsDeletedFlag\r\n}","import * as Yup from \"yup\";\r\n\r\nexport default Yup.object().shape({\r\n id: Yup.number(),\r\n name: Yup.string().required(\"Name is required\"),\r\n description: Yup.string(),\r\n poiColorCode: Yup.string().nullable(),\r\n isResolved: Yup.boolean()\r\n});","/* eslint-disable no-restricted-imports */\r\nimport React, { useState, useEffect } from 'react';\r\nimport MUIDataTable from \"mui-datatables\";\r\nimport { connect } from \"react-redux\";\r\nimport * as pointCategoryService from \"../../../services/settings/pointCategoryService\";\r\nimport * as projectTypeCustomFieldService from \"../../../services/settings/projectTypeCustomFieldService\";\r\nimport { Button, Modal } from \"react-bootstrap\";\r\nimport { blue } from '@material-ui/core/colors';\r\nimport { useFormik } from \"formik\";\r\nimport { makeStyles, withStyles } from '@material-ui/core';\r\nimport Checkbox from '@material-ui/core/Checkbox';\r\nimport PointCategoryValidator from \"../../../helpers/validators/PointCategoryValidator\";\r\nimport { getErrorField } from \"../../../helpers/helper\";\r\nimport * as alert from \"../../../redux/alertSnackBarRedux\";\r\nimport * as confirmModal from \"../../../redux/confirmModalRedux\";\r\nimport TextField from '@material-ui/core/TextField';\r\nimport Select from '@material-ui/core/Select';\r\nimport MenuItem from '@material-ui/core/MenuItem';\r\nimport InputLabel from '@material-ui/core/InputLabel';\r\nimport FormControl from '@material-ui/core/FormControl';\r\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\r\n\r\nconst BlueCheckbox = withStyles({\r\n root: {\r\n color: blue[400],\r\n '&$checked': {\r\n color: blue[600],\r\n },\r\n },\r\n checked: {},\r\n})((props) => \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Completed Nspections\r\n \r\n \r\n View and Manage Completed Nspections\r\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 connect(null, { ...alert.actions, ...confirmModal.actions })(PointCategorysListingPage);","import * as Yup from \"yup\";\r\n\r\nexport default Yup.object().shape({\r\n id: Yup.number(),\r\n key: Yup.string().required(),\r\n value: Yup.string().required()\r\n});","/* eslint-disable no-restricted-imports */\r\nimport React, { useState, useEffect } from 'react';\r\nimport MUIDataTable from \"mui-datatables\";\r\nimport { connect } from \"react-redux\";\r\nimport * as settingService from \"../../../services/settings/settingService\";\r\nimport { Button, Modal } from \"react-bootstrap\";\r\nimport { useFormik } from \"formik\";\r\nimport SettingValidator from \"../../../helpers/validators/SettingValidator\";\r\nimport { getErrorField } from \"../../../helpers/helper\";\r\nimport * as alert from \"../../../redux/alertSnackBarRedux\";\r\nimport * as confirmModal from \"../../../redux/confirmModalRedux\";\r\nimport TextField from '@material-ui/core/TextField';\r\n\r\nvar initialSetting = {\r\n id: 0,\r\n key: '',\r\n value: '',\r\n}\r\n\r\nconst SettingListingPage = (props) => {\r\n const { showAlert, showConfirmModal, hideConfirmModal, history } = props;\r\n const [data, setData] = useState([]);\r\n const [isModalOpen, setIsModalOpen] = useState(false);\r\n const [selectedSetting, setSelectedSetting] = useState(initialSetting);\r\n\r\n useEffect(() => {\r\n loadTableData();\r\n }, [])\r\n\r\n const loadTableData = () => {\r\n settingService.getSettings().then(res => {\r\n setData(res);\r\n }).catch((ex) => {\r\n showAlert({ message: ex.message, variant: \"error\" });\r\n });\r\n }\r\n\r\n const editSetting = (id) => {\r\n settingService.getSettingById(id).then(res => {\r\n setSelectedSetting(res);\r\n setIsModalOpen(true);\r\n })\r\n }\r\n\r\n const deleteSetting = (id) => {\r\n settingService.deleteSetting(id).then(res => {\r\n showAlert({ message: res.message, variant: \"success\" });\r\n loadTableData();\r\n hideConfirmModal();\r\n })\r\n }\r\n\r\n const columns = [\r\n {\r\n name: \"key\",\r\n label: \"Key\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n }\r\n },\r\n {\r\n name: \"value\",\r\n label: \"Value\",\r\n options: {\r\n filter: true,\r\n sort: true,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n <>\r\n {data[dataIndex].value ? data[dataIndex].value : \"-\"}\r\n \r\n );\r\n }\r\n }\r\n },\r\n {\r\n name: \"id\",\r\n label: \"Actions\",\r\n options: {\r\n filter: false,\r\n sort: false,\r\n width: 1,\r\n download: false,\r\n customBodyRenderLite: (dataIndex) => {\r\n return (\r\n <>\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n N-Point Category\r\n \r\n \r\n View and Manage N-Point Categories\r\n \r\n
\r\n\r\n setIsModalOpen(true)}\r\n className=\"btn btn-success font-weight-bolder font-size-sm mr-3\"\r\n >\r\n Add N-Point Category\r\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 connect(null, { ...alert.actions, ...confirmModal.actions })(SettingListingPage);","import axiosInstance from '../apiService';\r\nimport constants from '../../constants/constants';\r\n\r\nconst ENDPOINTORIGIN = \"Report/\";\r\n\r\nconst getHashLinkForReport = async (projectId, userId) => await axiosInstance.get(ENDPOINTORIGIN + 'GetHashLinkForReport?projectId=' + projectId + '&userId=' + userId, constants.REQUIRE_INTERCEPTORS);\r\n\r\nexport {\r\n getHashLinkForReport,\r\n}","import axiosInstance from '../apiService';\r\nimport constants from '../../constants/constants';\r\n\r\nconst ENDPOINTORIGIN = \"ProjectPinCustomField/\";\r\n\r\nconst getProjectPinCustomFieldById = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectPinCustomFieldById?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getProjectPinCustomFieldByProjectPinId = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectPinCustomFieldByProjectPinId?projPinId=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getProjectPinCustomFields = async () => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectPinCustomFields', constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst saveProjectPinCustomField = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'SaveProjectPinCustomField', model, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getProjectPinCustomFieldByProjectPinIdShareableReport = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'GetProjectPinCustomFieldByProjectPinIdShareableReport', model, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst saveProjectPinCustomFieldShareableReport = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'SaveProjectPinCustomFieldShareableReport', model, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst deleteProjectPinCustomField = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'DeleteProjectPinCustomField?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nexport {\r\n getProjectPinCustomFieldById,\r\n getProjectPinCustomFieldByProjectPinId,\r\n getProjectPinCustomFields,\r\n saveProjectPinCustomField,\r\n saveProjectPinCustomFieldShareableReport,\r\n getProjectPinCustomFieldByProjectPinIdShareableReport,\r\n deleteProjectPinCustomField\r\n}","/* eslint-disable no-restricted-imports */\r\nimport React, { useEffect, useState } from 'react';\r\nimport { Modal, Button } from 'react-bootstrap';\r\nimport { connect } from 'react-redux';\r\nimport { validateDescription } from '../../helpers/helper';\r\nimport TextField from '@material-ui/core/TextField';\r\nimport Checkbox from '@material-ui/core/Checkbox';\r\nimport MenuItem from '@material-ui/core/MenuItem';\r\nimport * as Yup from \"yup\";\r\nimport { getErrorField } from '../../helpers/helper';\r\nimport ExpansionPanel from '@material-ui/core/ExpansionPanel';\r\nimport ExpansionPanelDetails from '@material-ui/core/ExpansionPanelDetails';\r\nimport ExpansionPanelSummary from '@material-ui/core/ExpansionPanelSummary';\r\nimport Typography from '@material-ui/core/Typography';\r\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\r\nimport Select from '@material-ui/core/Select';\r\nimport FormControl from '@material-ui/core/FormControl';\r\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\r\nimport { makeStyles } from '@material-ui/core/styles';\r\n\r\nimport * as projectPinCustomFieldService from '../../services/settings/projectPinCustomFieldService';\r\nimport * as alert from '../../redux/alertSnackBarRedux';\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n formControl: {\r\n minWidth: 120,\r\n },\r\n selectEmpty: {\r\n marginTop: theme.spacing(2),\r\n },\r\n}));\r\n\r\n\r\nconst UpdateCustomFieldModal = (props) => {\r\n const classes = useStyles();\r\n const { show, hide, showAlert, token, pin } = props;\r\n const [projectPinCustomField, setProjectPinCustomField] = useState(null);\r\n const [customFields, setCustomFields] = useState([]);\r\n\r\n\r\n useEffect(() => {\r\n if (pin && pin.id) {\r\n if (token) {\r\n fetchProjectPinCustomFieldShareable({ token, id: pin.id });\r\n }\r\n else {\r\n fetchProjectPinCustomField(pin.id);\r\n }\r\n }\r\n }, [pin.id]);\r\n\r\n const fetchProjectPinCustomField = (customFieldId) => {\r\n projectPinCustomFieldService.getProjectPinCustomFieldByProjectPinId(customFieldId).then(res => {\r\n setCustomFields(res);\r\n }).catch(err => {\r\n console.log(err);\r\n })\r\n }\r\n const handleCheckboxChange = (e, index, option) => {\r\n const updatedFields = [...customFields];\r\n let selectedOptions = updatedFields[index].description ? updatedFields[index].description.split(', ') : [];\r\n\r\n if (e.target.checked) {\r\n selectedOptions = [...selectedOptions, option];\r\n } else {\r\n selectedOptions = selectedOptions.filter(item => item !== option);\r\n }\r\n\r\n updatedFields[index].description = selectedOptions.join(', ');\r\n setCustomFields(updatedFields);\r\n };\r\n\r\n\r\n const handleDescriptionChange = (e, index) => {\r\n const updatedFields = [...customFields];\r\n const field = updatedFields[index];\r\n\r\n if (field.customFieldType.toLowerCase() === 'dropdown') {\r\n field.description = e.target.value;\r\n } else if (field.customFieldType.toLowerCase() === 'multiselect') {\r\n field.description = e.target.value.join(', ');\r\n } else {\r\n field.description = e.target.value;\r\n }\r\n\r\n setCustomFields(updatedFields);\r\n };\r\n\r\n const fetchProjectPinCustomFieldShareable = (model) => {\r\n projectPinCustomFieldService.getProjectPinCustomFieldByProjectPinIdShareableReport(model).then(res => {\r\n setCustomFields(res);\r\n }).catch(err => {\r\n console.log(err);\r\n })\r\n }\r\n\r\n const hasValidationError = () => {\r\n for (let index = 0; index < customFields.length; index++) {\r\n const field = customFields[index];\r\n if (validateDescription(field.description, field.customFieldType)) {\r\n return true;\r\n }\r\n }\r\n return false;\r\n };\r\n\r\n const saveCustomFieldName = (event) => {\r\n event.preventDefault(); // Prevent the default form submission behavior\r\n\r\n // if (hasValidationError) {\r\n // showAlert({ message: \"Please correct the errors before submitting.\", variant: 'error' });\r\n // return;\r\n // }\r\n if (token) {\r\n const savePromises = customFields.map(field =>\r\n projectPinCustomFieldService.saveProjectPinCustomFieldShareableReport({ ...field, token })\r\n );\r\n\r\n Promise.all(savePromises)\r\n .then(responses => {\r\n responses.forEach(res => {\r\n showAlert({ message: res.message, variant: 'success' });\r\n });\r\n hideModal();\r\n })\r\n .catch(ex => {\r\n showAlert({ message: ex.message, variant: 'error' });\r\n });\r\n } else {\r\n const savePromises = customFields.map(field =>\r\n projectPinCustomFieldService.saveProjectPinCustomField({ ...field })\r\n );\r\n\r\n Promise.all(savePromises)\r\n .then(responses => {\r\n responses.forEach(res => {\r\n showAlert({ message: res.message, variant: 'success' });\r\n });\r\n hideModal();\r\n })\r\n .catch(ex => {\r\n showAlert({ message: ex.message, variant: 'error' });\r\n });\r\n }\r\n };\r\n\r\n\r\n const hideModal = () => {\r\n hide();\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 Setting\r\n \r\n \r\n View and Manage Settings\r\n \r\n
\r\n\r\n setIsModalOpen(true)}\r\n className=\"btn btn-success font-weight-bolder font-size-sm mr-3\"\r\n >\r\n Add Setting\r\n \r\n
\r\n \r\n
\r\n \r\n {\r\n if (highlightedAnnotationIndex) {\r\n removeSelectedMatterTag()\r\n }\r\n }}\r\n >\r\n Hover for details\r\n
\r\n \r\n
)\r\n :\r\n (project && project.formJSON ?\r\n <>\r\n \r\n {\r\n !keyFromURL ?\r\n (\r\n Back to Nspection\r\n )\r\n :\r\n (\r\n ![]({`${toAbsoluteUrl(\"/media/logos/logo.png\")}`})
\r\n )\r\n }\r\n
\r\n \r\n )\r\n }\r\n \r\n
\r\n \r\n {`${projectType.name} Report`}\r\n
\r\n{project.projectName}
\r\n\r\n
\r\n\r\n {\r\n keyFromURL ?\r\n (\r\n \r\n
\r\n\r\n \r\n Scanned on:{moment(project.scanDate).format('MMMM Do, YYYY')}\r\n
\r\n {\r\n project.completedDateTime ?\r\n\r\n Completed on:{moment(project.completedDateTime).format('MMMM Do, YYYY')}\r\n
: <>\r\n }\r\n\r\n\r\n
\r\n \r\n Nspection Description: {project.notes ? project.notes : \"No project notes available.\"}\r\n
\r\n\r\n
\r\n \r\n
\r\n \r\n Inspection Status:\r\n
\r\n \r\n {project.completedDateTime ? 'Completed' : 'Active'}\r\n \r\n\r\n
\r\n\r\n )\r\n :\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n {pinFromKey.title}\r\n
\r\n\r\n\r\n \r\n {\r\n pinFromKey.projectPinCustomFields?.length > 0 && !pinFromKey.projectPinCustomFields.every(x => !x.isViewable) &&\r\n <>\r\n Custom Fields:\r\n
\r\n
\r\n \r\n Reported By: {pinFromKey.addedBy ?? pinFromKey.anonymousUser ?? 'N/A'}\r\n
\r\n\r\n Reported On: {moment(pinFromKey.updatedOn).format(\"Do, MMMM, YYYY\")}\r\n
\r\n\r\n Category: {pinFromKey.pointCategory ?? 'N/A'}\r\n
\r\n\r\n\r\n Resolved: {pinFromKey.isResolved ? `Resolved` : `Not Resolved`}\r\n
\r\n\r\n Approved: {pinFromKey.isApproved ? `Approved` : `Not Approved`}\r\n
\r\n\r\n Status: {pinFromKey.projectTypePOIStatus ?? 'N/A'}\r\n
\r\n {\r\n pinFromKey.matterportResolutionLink &&\r\n\r\n Resolution Link: {pinFromKey.matterportResolutionLink}\r\n
\r\n }\r\n\r\n {\r\n pinFromKey.projectPinCustomFields?.length > 0 && !pinFromKey.projectPinCustomFields.every(x => !x.isViewable) &&\r\n <>\r\n Custom Fields:\r\n
\r\n \r\n }\r\n {pinFromKey.projectPinCustomFields?.length > 0 ? pinFromKey.projectPinCustomFields?.map((x, i) =>\r\n <>\r\n {\r\n x.isViewable &&\r\n <>\r\n \r\n {x.name} : {x.description ? x.description : '-'}\r\n \r\n
\r\n \r\n }\r\n \r\n ) : \"-\"}\r\n
\r\n \r\n {\r\n project.modelLink &&\r\n
\r\n \r\n <>\r\n \r\n \r\n \r\n \r\n \r\n
\r\n }\r\n \r\n \r\n Back to Nspection\r\n \r\n\r\n \r\n {\r\n window.open(constants.API_URL + `api/Report/GetInspectionPrintOut?projectId=${projectId}&token=${auth.authToken}`, '_blank')\r\n }}>Print Report\r\n
\r\n :\r\n \r\n \r\n Back to Nspection\r\n \r\n
\r\n : <>\r\n }\r\n \r\n\r\n {\r\n token &&\r\n <>\r\n\r\n \r\n {\r\n setAddCommentModalVisible(false);\r\n setCurrentPin({});\r\n setRefreshList(!refreshList);\r\n }}\r\n token={token}\r\n pin={currentPin}\r\n /> : <>\r\n {\r\n setShowCustomFieldModalVisible(false);\r\n setCurrentPin({});\r\n setRefreshList(!refreshList);\r\n }}\r\n token={token}\r\n pin={currentPin}\r\n /> : <>\r\n {\r\n setAddImageModalVisible(false);\r\n setRefreshList(!refreshList);\r\n }}\r\n token={token}\r\n />\r\n\r\n
\r\n \r\n )\r\n )\r\n}\r\n\r\nconst mapStateToProps = (state) => ({\r\n auth: state.auth\r\n})\r\n\r\nexport default connect(mapStateToProps, { ...alert.actions })(GenerateNewReportPage);","import axiosInstance from '../apiService';\r\nimport constants from '../../constants/constants';\r\n\r\nconst ENDPOINTORIGIN = \"ProjectTypeCheckBox/\";\r\n\r\nconst getProjectTypeCheckBoxById = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectTypeCheckBoxById?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getProjectTypeCheckBoxByProjectTypeId = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectTypeCheckBoxByProjectTypeId?projTypeId=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getProjectTypeCheckBoxes = async () => await axiosInstance.get(ENDPOINTORIGIN + 'GetProjectTypeCheckBoxes', constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst saveProjectTypeCheckBox = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'SaveProjectTypeCheckBox', model, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst deleteProjectTypeCheckBox = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'DeleteProjectTypeCheckBox?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst deleteProjectTypeCheckBoxIsDeletedFlag = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'DeleteProjectTypeCheckBoxIsDeletedFlag', model, constants.REQUIRE_INTERCEPTORS);\r\n\r\nexport {\r\n getProjectTypeCheckBoxById,\r\n getProjectTypeCheckBoxByProjectTypeId,\r\n getProjectTypeCheckBoxes,\r\n saveProjectTypeCheckBox,\r\n deleteProjectTypeCheckBox,\r\n deleteProjectTypeCheckBoxIsDeletedFlag\r\n}","import * as Yup from \"yup\";\r\n\r\nexport default Yup.object().shape({\r\n id: Yup.number(),\r\n name: Yup.string().required(\"CheckBox Name is required\"),\r\n});","/* eslint-disable no-restricted-imports */\r\nimport React, { useState, useEffect } from 'react';\r\nimport MUIDataTable from \"mui-datatables\";\r\nimport { connect } from \"react-redux\";\r\nimport * as projectTypeCheckBoxService from \"../../../services/settings/projectTypeCheckBoxService\";\r\nimport { Button, Modal } from \"react-bootstrap\";\r\nimport { useFormik } from \"formik\";\r\nimport ProjectTypeCheckBoxValidator from \"../../../helpers/validators/ProjectTypeCheckBoxValidator\";\r\nimport { getErrorField } from \"../../../helpers/helper\";\r\nimport * as alert from \"../../../redux/alertSnackBarRedux\";\r\nimport * as confirmModal from \"../../../redux/confirmModalRedux\";\r\nimport TextField from '@material-ui/core/TextField';\r\nimport { blue } from '@material-ui/core/colors';\r\nimport { makeStyles, withStyles } from '@material-ui/core';\r\nimport Checkbox from '@material-ui/core/Checkbox';\r\nimport FormControl from '@material-ui/core/FormControl';\r\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\r\n\r\nconst BlueCheckbox = withStyles({\r\n root: {\r\n color: blue[400],\r\n '&$checked': {\r\n color: blue[600],\r\n },\r\n },\r\n checked: {},\r\n})((props) => \r\n \r\n {\r\n\r\n project.modelLink &&\r\n
\r\n \r\n <>\r\n \r\n \r\n \r\n \r\n \r\n
\r\n }\r\n {\r\n token && project.projectModelImages && project.projectModelImages.length > 0 &&\r\n \r\n
\r\n }\r\n\r\n \r\n {\r\n const currentImageId = project.projectModelImages[newActiveIndex].id;\r\n setCurrentImageIndex(currentImageId);\r\n setCarouselIndex(newActiveIndex)\r\n setFetchNewAnnotation(!fetchNewAnnotation)\r\n }}\r\n >\r\n {project.projectModelImages.map((image, index) => (\r\n
\r\n \r\n {renderAnnotations(\r\n constants.API_URL + 'api/' + image.imagePath,\r\n project.projectModelImages[index].id\r\n )}\r\n
\r\n ))}\r\n \r\n \r\n
\r\n\r\n\r\n\r\n \r\n\r\n }\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n\r\n\r\n \r\n {`${projectType.name} Report`}\r\n
\r\n{project.projectName}
\r\n\r\n
\r\n {\r\n projectPins && projectPins.projectPinListingDtos && projectPins.projectPinListingDtos.map((pin, index) =>\r\n \r\n
\r\n\r\n \r\n Scanned on:{moment(project.scanDate).format('MMMM Do, YYYY')}\r\n
\r\n {\r\n project.completedDateTime ?\r\n\r\n Completed on:{moment(project.completedDateTime).format('MMMM Do, YYYY')}\r\n
: <>\r\n }\r\n\r\n\r\n
\r\n \r\n Nspection Description: {project.notes ? project.notes : \"No project notes available.\"}\r\n
\r\n\r\n
\r\n \r\n
\r\n \r\n Inspection Status:\r\n
\r\n \r\n {project.completedDateTime ? 'Completed' : 'Active'}\r\n \r\n\r\n
\r\n\r\n )\r\n }\r\n \r\n
\r\n {/* \r\n
\r\n \r\n {pin.title}\r\n
\r\n {\r\n pin.projectPinCheckBoxes.map(x =>\r\n \r\n {x}\r\n \r\n )\r\n }\r\n\r\n\r\n \r\n {\r\n pin.projectPinCustomFields?.length > 0 && !pin.projectPinCustomFields.every(x => !x.isViewable) &&\r\n <>\r\n Custom Fields:\r\n
\r\n
\r\n\r\n \r\n Reported By: {pin.addedBy ?? pin.anonymousUser ?? 'N/A'}\r\n
\r\n\r\n Reported On: {moment(pin.updatedOn).format(\"Do, MMMM, YYYY\")}\r\n
\r\n\r\n Category: {pin.pointCategory ?? 'N/A'}\r\n
\r\n\r\n\r\n Resolved: {pin.isResolved ? `Resolved` : `Not Resolved`}\r\n
\r\n\r\n Approved: {pin.isApproved ? `Approved` : `Not Approved`}\r\n
\r\n\r\n Status: {pin.projectTypePOIStatus ?? 'N/A'}\r\n
\r\n {\r\n pin.matterportResolutionLink &&\r\n\r\n Resolution Link: {pin.matterportResolutionLink}\r\n
\r\n }\r\n\r\n {\r\n pin.projectPinCustomFields?.length > 0 && !pin.projectPinCustomFields.every(x => !x.isViewable) &&\r\n <>\r\n Custom Fields:\r\n
\r\n \r\n }\r\n {pin.projectPinCustomFields?.length > 0 ? pin.projectPinCustomFields?.map((x, i) =>\r\n <>\r\n {\r\n x.isViewable &&\r\n <>\r\n \r\n {x.name} : {x.description ? x.description : '-'}\r\n \r\n
\r\n \r\n }\r\n \r\n ) : \"-\"}\r\n
\r\n \r\n Comment: {pin.comment ?? 'N/A'}\r\n
\r\n\r\n Commented By: {pin.commentedBy ? pin.commentedBy : pin.anonymousName}\r\n
\r\n\r\n Notes: {pin.description ?? 'N/A'}\r\n
\r\n\r\n {\r\n token && projectPins.allowCollaboration &&\r\n \r\n Resolution Image:
\r\n }\r\n {\r\n token &&\r\n
\r\n \r\n \r\n
\r\n }\r\n {\r\n !token && (project && project.client && project.client.allowAnonymousCollaboration &&\r\n \r\n \r\n
\r\n )\r\n }\r\n {\r\n token && pin && pin.projectPinCustomFields.length > 0 &&\r\n \r\n \r\n
\r\n }\r\n {\r\n pin.poiResolutionImagePath &&\r\n \r\n Resolution Image: \r\n 
\r\n \r\n
\r\n }\r\n {\r\n token &&\r\n \r\n \r\n
\r\n }\r\n \r\n
*/}\r\n \r\n \r\n
\r\n\r\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 connect(null, { ...alert.actions, ...confirmModal.actions })(ProjectTypeCheckBoxListingPage);","import * as Yup from \"yup\";\r\n\r\nexport default Yup.object().shape({\r\n name: Yup.string().required(\"Name is required\"),\r\n});","/* eslint-disable no-restricted-imports */\r\nimport React, { useState, useEffect } from 'react';\r\nimport MUIDataTable from \"mui-datatables\";\r\nimport { makeStyles, withStyles } from '@material-ui/core';\r\nimport FormControl from '@material-ui/core/FormControl';\r\nimport InputLabel from '@material-ui/core/InputLabel';\r\nimport { connect } from \"react-redux\";\r\nimport { useParams } from 'react-router-dom';\r\nimport Select from '@material-ui/core/Select';\r\nimport * as projectTypeCustomFieldService from \"../../../services/settings/projectTypeCustomFieldService\";\r\nimport { Button, Modal } from \"react-bootstrap\";\r\nimport * as Yup from \"yup\";\r\nimport { red, blue } from '@material-ui/core/colors';\r\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\r\nimport { useFormik } from \"formik\";\r\nimport ProjectTypeCustomFieldValidator from \"../../../helpers/validators/ProjectTypeCustomFieldValidator\";\r\nimport { getErrorField } from \"../../../helpers/helper\";\r\nimport * as alert from \"../../../redux/alertSnackBarRedux\";\r\nimport * as confirmModal from \"../../../redux/confirmModalRedux\";\r\nimport TextField from '@material-ui/core/TextField';\r\nimport Checkbox from '@material-ui/core/Checkbox';\r\n\r\nvar initialProjectTypeCustomField = {\r\n id: 0,\r\n name: '',\r\n isEditable: false,\r\n isViewable: false,\r\n projectTypeId: '',\r\n customFieldType: '',\r\n isDeleted: false\r\n}\r\n\r\nconst useStyles = makeStyles((theme) => ({\r\n formControl: {\r\n // margin: theme.spacing(1),\r\n minWidth: 120,\r\n },\r\n selectEmpty: {\r\n marginTop: theme.spacing(2),\r\n },\r\n}));\r\n\r\nconst BlueCheckBox = withStyles({\r\n root: {\r\n color: blue[400],\r\n '&$checked': {\r\n color: blue[600],\r\n },\r\n },\r\n checked: {},\r\n})((props) => \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n CheckBox\r\n \r\n \r\n View and Manage CheckBoxListingPage\r\n \r\n
\r\n\r\n setIsModalOpen(true)}\r\n className=\"btn btn-success font-weight-bolder font-size-sm mr-3\"\r\n >\r\n Add CheckBox\r\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 connect(null, { ...alert.actions, ...confirmModal.actions })(ProjectTypeCustomFieldListingPage);","import axiosInstance from '../apiService';\r\nimport constants from '../../constants/constants';\r\n\r\nconst ENDPOINTORIGIN = \"ProjectTypePOIStatus/\";\r\n\r\nconst getPOIStatusById = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetPOIStatusById?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getPOIStatusByProjectTypeId = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetPOIStatusByProjectTypeId?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getPOIStatuses = async () => await axiosInstance.get(ENDPOINTORIGIN + 'GetPOIStatuses', constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst savePOIStatus = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'SavePOIStatus', model, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst deletePOIStatus = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'DeletePOIStatus?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst deletePOIStatusIsDeletedFlag = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'DeletePOIStatusByIsDeletedFlag', model, constants.REQUIRE_INTERCEPTORS);\r\n\r\nexport {\r\n getPOIStatusById,\r\n getPOIStatusByProjectTypeId,\r\n getPOIStatuses,\r\n savePOIStatus,\r\n deletePOIStatus,\r\n deletePOIStatusIsDeletedFlag\r\n}","/* eslint-disable no-restricted-imports */\r\nimport React, { useState, useEffect } from 'react';\r\nimport MUIDataTable from \"mui-datatables\";\r\nimport { connect } from \"react-redux\";\r\nimport * as poiStatusService from \"../../../services/settings/POIStatusService\";\r\nimport * as clientTierService from '../../../services/management/clientTierService';\r\nimport { Button, Modal } from \"react-bootstrap\";\r\nimport { useFormik } from \"formik\";\r\nimport POIStatusValidator from \"../../../helpers/validators/PointCategoryValidator\";\r\nimport { getErrorField, checkTierPlanAndRoleTier3 } from '../../../helpers/helper';\r\nimport * as alert from \"../../../redux/alertSnackBarRedux\";\r\nimport * as confirmModal from \"../../../redux/confirmModalRedux\";\r\nimport TextField from '@material-ui/core/TextField';\r\nimport { withStyles } from '@material-ui/core/styles';\r\nimport { blue } from '@material-ui/core/colors';\r\nimport Checkbox from '@material-ui/core/Checkbox';\r\nimport { SketchPicker } from 'react-color';\r\nimport FormControl from '@material-ui/core/FormControl';\r\nimport FormControlLabel from '@material-ui/core/FormControlLabel';\r\n\r\n\r\nconst BlueCheckBox = withStyles({\r\n root: {\r\n color: blue[400],\r\n '&$checked': {\r\n color: blue[600],\r\n },\r\n },\r\n checked: {},\r\n})((props) => \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n Custom Fields\r\n \r\n \r\n View and Manage Custom Fields\r\n \r\n
\r\n\r\n setIsModalOpen(true)}\r\n className=\"btn btn-success font-weight-bolder font-size-sm mr-3\"\r\n >\r\n Add Custom Field\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n )\r\n}\r\n\r\nconst mapStateToProps = (state) => ({\r\n auth: state.auth\r\n})\r\n\r\nexport default connect(mapStateToProps, { ...alert.actions, ...confirmModal.actions })(ProjectTypePOIStatusListingPage);","import React, { Suspense, lazy } from \"react\";\r\nimport { Redirect, Switch, Route } from \"react-router-dom\";\r\nimport { LayoutSplashScreen, ContentRoute } from \"../_metronic/layout\";\r\nimport { BuilderPage } from \"./pages/BuilderPage\";\r\nimport { MyPage } from \"./pages/MyPage\";\r\nimport { DashboardPage } from \"./pages/DashboardPage\";\r\nimport UserListingPage from \"./pages/management/user/UserListingPage\";\r\nimport ClientListingPage from './pages/management/client/ClientListingPage';\r\nimport ProjectListingPage from './pages/services/project/ProjectListingPage';\r\nimport ProjectTypeListingPage from './pages/services/project/ProjectTypeListingPage';\r\nimport ProjectEditPage from './pages/services/project/ProjectEditPage';\r\nimport ChargifyForm from \"./pages/chargifyForm/ChargifyForm\";\r\nimport ProjectTypeEditPage from './pages/services/project/ProjectTypeEditPage';\r\nimport PointCategoryListingPage from './pages/settings/pointCategoryListingPage';\r\nimport SettingListingPage from './pages/settings/SettingListingPage';\r\nimport GenerateNewReportPage from './pages/services/project/GenerateNewReportPage';\r\nimport ProjectTypeCheckBoxListingPage from \"./pages/settings/ProjectTypeCheckBoxListingPage\";\r\nimport ProjectTypeCustomFieldListingPage from \"./pages/settings/ProjectTypeCustomFieldListingPage\";\r\nimport ProjectTypePOIStatusListingPage from \"./pages/settings/ProjectTypePOIStatusListingPage\";\r\nimport PropertyImprovementPlanReport from \"./components/PropertyImprovementPlanReport\";\r\n\r\nconst GoogleMaterialPage = lazy(() =>\r\n import(\"./modules/GoogleMaterialExamples/GoogleMaterialPage\")\r\n);\r\nconst ReactBootstrapPage = lazy(() =>\r\n import(\"./modules/ReactBootstrapExamples/ReactBootstrapPage\")\r\n);\r\nconst ECommercePage = lazy(() =>\r\n import(\"./modules/ECommerce/pages/eCommercePage\")\r\n);\r\nconst UserProfilepage = lazy(() =>\r\n import(\"./modules/UserProfile/UserProfilePage\")\r\n);\r\n\r\nexport default function BasePage() {\r\n // useEffect(() => {\r\n // console.log('Base page');\r\n // }, []) // [] - is required if you need only one call\r\n // https://reactjs.org/docs/hooks-reference.html#useeffect\r\n\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n N-Point Status\r\n \r\n \r\n View and Manage N-Point Status\r\n \r\n
\r\n\r\n setIsModalOpen(true)}\r\n className=\"btn btn-success font-weight-bolder font-size-sm mr-3\"\r\n >\r\n Add POI Status\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n 404\r\n \r\n
\r\n \r\n );\r\n}\r\n","import React from \"react\";\r\nimport {toAbsoluteUrl} from \"../../../_metronic/_helpers\";\r\n\r\nexport function ErrorPage2() {\r\n return (\r\n \r\n OOPS! Something went wrong here\r\n
\r\n\r\n \r\n
\r\n \r\n );\r\n}\r\n","import React from \"react\";\r\nimport {toAbsoluteUrl} from \"../../../_metronic/_helpers\";\r\nimport \"../../../_metronic/_assets/sass/pages/error/error-3.scss\";\r\n\r\nexport function ErrorPage3() {\r\n return (\r\n \r\n
\r\n OOPS!
\r\n \r\n Something went wrong here\r\n \r\n\r\n \r\n
\r\n \r\n );\r\n}\r\n","import React from \"react\";\r\nimport { toAbsoluteUrl } from \"../../../_metronic/_helpers\";\r\nimport \"../../../_metronic/_assets/sass/pages/error/error-4.scss\";\r\n\r\nexport function ErrorPage4() {\r\n return (\r\n \r\n
\r\n 404
\r\n\r\n How did you get here\r\n
\r\n\r\n Sorry we can't seem to find the page you're looking for.\r\n
\r\n\r\n There may be a misspelling in the URL entered,\r\n
\r\n or the page you are looking for may no longer exist.\r\n
\r\n \r\n
\r\n \r\n );\r\n}\r\n","import React from \"react\";\r\nimport { toAbsoluteUrl } from \"../../../_metronic/_helpers\";\r\nimport \"../../../_metronic/_assets/sass/pages/error/error-5.scss\";\r\n\r\nexport function ErrorPage5() {\r\n return (\r\n \r\n
\r\n \r\n 404\r\n
\r\n\r\n ERROR\r\n
\r\n\r\n Nothing left to do here.\r\n
\r\n\r\n \r\n
\r\n \r\n );\r\n}\r\n","import React from \"react\";\r\nimport { toAbsoluteUrl } from \"../../../_metronic/_helpers\";\r\nimport \"../../../_metronic/_assets/sass/pages/error/error-6.scss\";\r\n\r\nexport function ErrorPage6() {\r\n return (\r\n \r\n
\r\n \r\n Oops!\r\n
\r\n\r\n Something went wrong here.\r\n
\r\n\r\n We're working on it and we'll get it fixed\r\n
\r\n as soon possible.\r\n
\r\n You can back or use our Help Center.\r\n
\r\n \r\n
\r\n \r\n );\r\n}\r\n","import React from \"react\";\r\nimport { Redirect, Route, Switch } from \"react-router-dom\";\r\nimport { ErrorPage1 } from \"./ErrorPage1\";\r\nimport { ErrorPage2 } from \"./ErrorPage2\";\r\nimport { ErrorPage3 } from \"./ErrorPage3\";\r\nimport { ErrorPage4 } from \"./ErrorPage4\";\r\nimport { ErrorPage5 } from \"./ErrorPage5\";\r\nimport { ErrorPage6 } from \"./ErrorPage6\";\r\n\r\nexport default function ErrorsPage() {\r\n return (\r\n \r\n \r\n Oops...\r\n \r\n
\r\n \r\n Looks like something went wrong.\r\n
\r\n We're working on it\r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nconst mapStateToProps = (state) => ({\r\n alertState: state.alert\r\n});\r\n\r\n\r\nexport default connect(mapStateToProps, alert.actions)(AlertSnackBar);","import React from 'react';\r\nimport { connect } from \"react-redux\";\r\nimport { Button, Modal } from \"react-bootstrap\";\r\nimport * as confirmModal from \"../../redux/confirmModalRedux\";\r\n\r\nconst ConfirmModal = (props) => {\r\n const { showConfirmModal, hideConfirmModal, confirmModal, setProcessing } = props;\r\n return (\r\n \r\n \r\n
\r\n )\r\n}\r\n\r\nexport default ProjectReportPage;","/**\r\n * High level router.\r\n *\r\n * Note: It's recommended to compose related routes in internal router\r\n * components (e.g: `src/app/modules/Auth/pages/AuthPage`, `src/app/BasePage`).\r\n */\r\nimport React from \"react\";\r\nimport WithAppcuesIdentification from \"./appcuesHOC/WithAppcuesIdentification\";\r\nimport { Redirect, Switch, Route, useLocation } from \"react-router-dom\";\r\nimport { shallowEqual, useSelector } from \"react-redux\";\r\nimport { Layout } from \"../_metronic/layout\";\r\nimport BasePage from \"./BasePage\";\r\nimport { Logout, AuthPage } from \"./modules/Auth\";\r\nimport ErrorsPage from \"./modules/ErrorsExamples/ErrorsPage\";\r\nimport AlertSnackBar from \"./components/AlertSnackBar\";\r\nimport ConfirmModal from \"./components/ConfirmModal\";\r\nimport ProjectReportPage from \"./pages/public/ProjectReportPage\";\r\n\r\nconst AuthPageWithAppcuesIdentification = WithAppcuesIdentification(AuthPage);\r\nconst BasePageWithAppcuesIdentification = WithAppcuesIdentification(BasePage);\r\n\r\nfunction Routes() {\r\n const { isAuthorized, user } = useSelector(\r\n ({ auth }) => ({\r\n isAuthorized: auth.user != null,\r\n user: auth.user,\r\n }),\r\n shallowEqual\r\n );\r\n\r\n const { role } = useSelector(\r\n ({ auth }) => ({\r\n role: auth.role ?? null,\r\n }),\r\n shallowEqual\r\n );\r\n\r\n const { clientRefId } = useSelector(\r\n ({ auth }) => ({\r\n clientRefId: auth.clientRefId ?? null,\r\n }),\r\n shallowEqual\r\n );\r\n\r\n return (\r\n <>\r\n \r\n {children}\r\n
\r\n )\r\n);\r\n\r\nexport const CardHeader = forwardRef(\r\n (\r\n {\r\n children,\r\n icon,\r\n title,\r\n toolbar,\r\n className,\r\n sticky = false,\r\n labelRef,\r\n ...props\r\n },\r\n ref\r\n ) => {\r\n const [top, setTop] = useState(0);\r\n const [windowHeight, setWindowHeight] = useState(0);\r\n\r\n useEffect(() => {\r\n handleResize();\r\n\r\n function handleResize() {\r\n setWindowHeight(window.innerWidth);\r\n }\r\n\r\n window.addEventListener(\"resize\", handleResize);\r\n\r\n return () => {\r\n window.removeEventListener(\"resize\", handleResize);\r\n };\r\n });\r\n\r\n useEffect(() => {\r\n // Skip if sticky is disabled or on initial render when we don't know about window height.\r\n if (!sticky || windowHeight === 0) {\r\n return;\r\n }\r\n\r\n const headerElement = document.querySelector(\".header\");\r\n const subheaderElement = document.querySelector(\".subheader\");\r\n const headerMobileElement = document.querySelector(\".header-mobile\");\r\n\r\n let nextMarginTop = 0;\r\n\r\n // mobile header\r\n if (window.getComputedStyle(headerElement).height === \"0px\") {\r\n nextMarginTop = headerMobileElement.offsetHeight;\r\n } else {\r\n // desktop header\r\n if (document.body.classList.contains(\"header-minimize-topbar\")) {\r\n // hardcoded minimized header height\r\n nextMarginTop = 60;\r\n } else {\r\n // normal fixed header\r\n if (document.body.classList.contains(\"header-fixed\")) {\r\n nextMarginTop += headerElement.offsetHeight;\r\n }\r\n\r\n if (document.body.classList.contains(\"subheader-fixed\")) {\r\n nextMarginTop += subheaderElement.offsetHeight;\r\n }\r\n }\r\n }\r\n\r\n setTop(nextMarginTop);\r\n }, [sticky, windowHeight]);\r\n\r\n return (\r\n \r\n {icon}\r\n\r\n {/* Wrap string and fragments in CardHeaderTitle */\r\n typeof title === \"string\" || isFragment(title) ? (\r\n {title} \r\n ) : (\r\n title\r\n )}\r\n
\r\n )}\r\n\r\n {toolbar}\r\n {children}\r\n \r\n );\r\n }\r\n);\r\n\r\nexport const CardBody = forwardRef(\r\n ({ fit, fluid, className, ...props }, ref) => (\r\n \r\n \r\n {languages[0].code}\r\n \r\n
\r\n \r\n )}\r\n {languages.length > 1 && (\r\n <>\r\n \r\n {languages.map((lang, index) => (\r\n \r\n \r\n \r\n {lang.code}\r\n \r\n
\r\n \r\n ))}\r\n \r\n \r\n \r\n )}\r\n \r\n \r\n );\r\n};\r\n","/* eslint-disable no-script-url,jsx-a11y/anchor-is-valid */\r\nimport React, {useState, useEffect} from \"react\";\r\nimport {KTCodeBlock} from \"./KTCodeBlock\";\r\nimport {Card, CardBody, CardHeader} from \"../Card\";\r\nimport {CodeBlockToolbar} from \"../code-examples/CodeBlockToolbar\";\r\n\r\nexport function KTCodeExample({\r\n jsCode,\r\n children,\r\n beforeCodeTitle,\r\n languages,\r\n codeBlockHeight\r\n}) {\r\n const defaultLanguages = !languages\r\n ? [\r\n {\r\n code: jsCode,\r\n language: \"javascript\",\r\n shortCode: \"JS\"\r\n }\r\n ]\r\n : languages;\r\n const [isCodeBlockShown, setIsCodeBlockShown] = useState(false);\r\n const [tabId, setTabId] = useState(0);\r\n const [customStyle, setCustomStyle] = useState({});\r\n useEffect(() => {\r\n const styles = {};\r\n\r\n if (codeBlockHeight) {\r\n styles.height = codeBlockHeight;\r\n styles.overflowX = \"auto\";\r\n }\r\n\r\n if (defaultLanguages.length > 1) {\r\n styles.background = `none transparent !important`;\r\n }\r\n\r\n setCustomStyle(styles);\r\n }, [codeBlockHeight, defaultLanguages.length]);\r\n\r\n const toolbar = (\r\n \r\n
\r\n );\r\n\r\n return (\r\n \r\n
\r\n \r\n {errors[field.name].toString()}\r\n
\r\n ) : (\r\n \r\n Please enter {props.label} in 'mm/dd/yyyy' format\r\n
\r\n )}\r\n \r\n );\r\n}\r\n","import React from \"react\";\r\n\r\nconst inputLabel = ({ label, touched, error, customFeedbackLabel }) => {\r\n if (touched && error) {\r\n return {error}
;\r\n }\r\n\r\n if (touched && !error && label) {\r\n return {label} was entered correct
;\r\n }\r\n\r\n return (\r\n \r\n {customFeedbackLabel && <>{customFeedbackLabel}}\r\n {!customFeedbackLabel && (\r\n <>\r\n Please enter {label}\r\n \r\n )}\r\n
\r\n );\r\n};\r\n\r\nconst selectLabel = ({ label, touched, error, customFeedbackLabel }) => {\r\n if (touched && error) {\r\n return {error}
;\r\n }\r\n\r\n return (\r\n \r\n {customFeedbackLabel && <>{customFeedbackLabel}}\r\n {!customFeedbackLabel && label && (\r\n <>\r\n Please select {label}\r\n \r\n )}\r\n
\r\n );\r\n};\r\n\r\nexport function FieldFeedbackLabel({\r\n label,\r\n touched,\r\n error,\r\n type,\r\n customFeedbackLabel\r\n}) {\r\n switch (type) {\r\n case \"text\":\r\n return inputLabel({ label, touched, error, customFeedbackLabel });\r\n case \"email\":\r\n return inputLabel({ label, touched, error, customFeedbackLabel });\r\n case \"password\":\r\n return inputLabel({ label, touched, error, customFeedbackLabel });\r\n default:\r\n return selectLabel({ label, touched, error, customFeedbackLabel });\r\n }\r\n}\r\n","import React from \"react\";\r\nimport {FieldFeedbackLabel} from \"./FieldFeedbackLabel\";\r\n\r\nconst getFieldCSSClasses = (touched, errors) => {\r\n const classes = [\"form-control\"];\r\n if (touched && errors) {\r\n classes.push(\"is-invalid\");\r\n }\r\n\r\n if (touched && !errors) {\r\n classes.push(\"is-valid\");\r\n }\r\n\r\n return classes.join(\" \");\r\n};\r\n\r\nexport function Input({\r\n field, // { name, value, onChange, onBlur }\r\n form: { touched, errors }, // also values, setXXXX, handleXXXX, dirty, isValid, status, etc.\r\n label,\r\n withFeedbackLabel = true,\r\n customFeedbackLabel,\r\n type = \"text\",\r\n ...props\r\n}) {\r\n return (\r\n <>\r\n {label && }\r\n \r\n handleFirstPage(paginationProps)}\r\n className=\"btn btn-icon btn-sm btn-light btn-hover-primary mr-2 my-1\"\r\n >\r\n \r\n \r\n handlePrevPage(paginationProps)}\r\n className=\"btn btn-icon btn-sm btn-light btn-hover-primary mr-2 my-1\"\r\n >\r\n \r\n \r\n\r\n {page > 1 && (\r\n \r\n ...\r\n \r\n )}\r\n {pages.map((p) => (\r\n handleSelectedPage(paginationProps, p)}\r\n className={`btn btn-icon btn-sm border-0 btn-light ${\r\n page === p ? \" btn-hover-primary active\" : \"\"\r\n } mr-2 my-1`}\r\n >\r\n {p}\r\n \r\n ))}\r\n {page < pagesCount && (\r\n \r\n ...\r\n \r\n )}\r\n handleNextPage(paginationProps)}\r\n className=\"btn btn-icon btn-sm btn-light btn-hover-primary mr-2 my-1\"\r\n >\r\n \r\n \r\n handleLastPage(paginationProps)}\r\n className=\"btn btn-icon btn-sm btn-light btn-hover-primary mr-2 my-1\"\r\n >\r\n \r\n \r\n
\r\n \r\n )}\r\n \r\n );\r\n}\r\n","/* eslint-disable no-unused-vars */\r\nimport React from \"react\";\r\nimport {PaginationTotalStandalone} from \"react-bootstrap-table2-paginator\";\r\n\r\nexport function PaginationToolbar(props) {\r\n const { isLoading, paginationProps } = props;\r\n const {\r\n sizePerPageList,\r\n sizePerPage,\r\n totalSize,\r\n onSizePerPageChange = [\r\n { text: \"3\", value: 3 },\r\n { text: \"5\", value: 5 },\r\n { text: \"10\", value: 10 }\r\n ]\r\n } = paginationProps;\r\n const style = {\r\n width: \"75px\"\r\n };\r\n\r\n const onSizeChange = event => {\r\n const newSize = +event.target.value;\r\n onSizePerPageChange(newSize);\r\n };\r\n\r\n return (\r\n \r\n {isLoading && (\r\n \r\n {sizePerPageList.map(option => {\r\n const isSelect = sizePerPage === `${option.page}`;\r\n return (\r\n \r\n {option.text}\r\n \r\n );\r\n })}\r\n \r\n
\r\n );\r\n}\r\n","import React from \"react\";\r\nimport {PaginationLinks} from \"./PaginationLinks\";\r\nimport {PaginationToolbar} from \"./PaginationToolbar\";\r\n\r\nexport function Pagination(props) {\r\n const { children, isLoading, paginationProps } = props;\r\n return (\r\n <>\r\n {children}\r\n \r\n
\r\n )}\r\n Loading...
\r\n \r\n \r\n
\r\n \r\n );\r\n}\r\n","import React from \"react\";\r\nimport {withRouter} from \"react-router-dom\";\r\nimport {ProgressBar} from \"react-bootstrap\";\r\n\r\n// TODO: Should be rewrited to pure function\r\nclass AnimateLoading extends React.Component {\r\n animateTimeout;\r\n stopAnimateTimeout;\r\n state = {\r\n width: 0,\r\n routeChanged: false\r\n };\r\n\r\n componentDidUpdate(nextProps) {\r\n if (this.props.location.pathname !== nextProps.location.pathname) {\r\n this.animate();\r\n this.scrollToTop();\r\n }\r\n }\r\n\r\n scrollToTop() {\r\n const scrollToTopBtn = document.getElementById(\"kt_scrolltop\");\r\n if (scrollToTopBtn) {\r\n scrollToTopBtn.click();\r\n }\r\n }\r\n\r\n animate() {\r\n this.animateTimeout = setTimeout(() => {\r\n if (this.state.width <= 100) {\r\n this.setState({ width: this.state.width + 10 });\r\n this.animate();\r\n } else {\r\n this.stopAnimate();\r\n }\r\n }, 30);\r\n }\r\n stopAnimate() {\r\n clearTimeout(this.animateInterval);\r\n this.stopAnimateTimeout = setTimeout(() => {\r\n this.setState({ width: 0 });\r\n }, 300);\r\n }\r\n componentWillUnmount() {\r\n if (this.stopAnimateTimeout) {\r\n clearTimeout(this.stopAnimateTimeout);\r\n }\r\n if (this.animateTimeout) {\r\n clearTimeout(this.animateTimeout);\r\n }\r\n }\r\n render() {\r\n return (\r\n {text}
\r\n \r\n \r\n \r\n \r\n
\r\n\r\n \r\n {children}\r\n
\r\n \r\n );\r\n }\r\n);\r\n\r\n// Set display name for debugging.\r\nif (process.env.NODE_ENV !== \"production\") {\r\n Notice.displayName = \"Notice\";\r\n}\r\n","import React from \"react\";\r\nimport { ProgressBar } from \"react-bootstrap\";\r\n\r\nexport function ModalProgressBar({variant = \"success\"}) {\r\n return (\r\n \r\n value = parseInt(KTUtil.css(el, 'z-index'));\r\n\r\n if (!isNaN(value) && value !== 0) {\r\n return value;\r\n }\r\n }\r\n\r\n el = el.parentNode;\r\n }\r\n\r\n return null;\r\n },\r\n\r\n /**\r\n * Checks whether the element has any parent with fixed positionfreg\r\n * @param {object} el jQuery element object\r\n * @returns {boolean}\r\n */\r\n hasFixedPositionedParent: function(el) {\r\n var position;\r\n\r\n while (el && el !== document) {\r\n position = KTUtil.css(el, 'position');\r\n\r\n if (position === \"fixed\") {\r\n return true;\r\n }\r\n\r\n el = el.parentNode;\r\n }\r\n\r\n return false;\r\n },\r\n\r\n /**\r\n * Simulates delay\r\n */\r\n sleep: function(milliseconds) {\r\n var start = new Date().getTime();\r\n for (var i = 0; i < 1e7; i++) {\r\n if ((new Date().getTime() - start) > milliseconds) {\r\n break;\r\n }\r\n }\r\n },\r\n\r\n /**\r\n * Gets randomly generated integer value within given min and max range\r\n * @param {number} min Range start value\r\n * @param {number} max Range end value\r\n * @returns {number}\r\n */\r\n getRandomInt: function(min, max) {\r\n return Math.floor(Math.random() * (max - min + 1)) + min;\r\n },\r\n\r\n /**\r\n * Checks whether Angular library is included\r\n * @returns {boolean}\r\n */\r\n isAngularVersion: function() {\r\n return window.Zone !== undefined ? true : false;\r\n },\r\n\r\n // Deep extend: $.extend(true, {}, objA, objB);\r\n deepExtend: function(out) {\r\n out = out || {};\r\n\r\n for (var i = 1; i < arguments.length; i++) {\r\n var obj = arguments[i];\r\n if (!obj) continue;\r\n\r\n for (var key in obj) {\r\n if (!obj.hasOwnProperty(key)) {\r\n continue;\r\n }\r\n\r\n // based on https://javascriptweblog.wordpress.com/2011/08/08/fixing-the-javascript-typeof-operator/\r\n if ( Object.prototype.toString.call(obj[key]) === '[object Object]' ) {\r\n out[key] = KTUtil.deepExtend(out[key], obj[key]);\r\n continue;\r\n }\r\n\r\n out[key] = obj[key];\r\n }\r\n }\r\n\r\n return out;\r\n },\r\n\r\n // extend: $.extend({}, objA, objB);\r\n extend: function(out) {\r\n out = out || {};\r\n\r\n for (var i = 1; i < arguments.length; i++) {\r\n if (!arguments[i])\r\n continue;\r\n\r\n for (var key in arguments[i]) {\r\n if (arguments[i].hasOwnProperty(key))\r\n out[key] = arguments[i][key];\r\n }\r\n }\r\n\r\n return out;\r\n },\r\n\r\n getById: function(el) {\r\n if (typeof el === 'string') {\r\n return document.getElementById(el);\r\n } else {\r\n return el;\r\n }\r\n },\r\n\r\n getByTag: function(query) {\r\n return document.getElementsByTagName(query);\r\n },\r\n\r\n getByTagName: function(query) {\r\n return document.getElementsByTagName(query);\r\n },\r\n\r\n getByClass: function(query) {\r\n return document.getElementsByClassName(query);\r\n },\r\n\r\n getBody: function() {\r\n return document.getElementsByTagName('body')[0];\r\n },\r\n\r\n /**\r\n * Checks whether the element has given classes\r\n * @param {object} el jQuery element object\r\n * @param {string} Classes string\r\n * @returns {boolean}\r\n */\r\n hasClasses: function(el, classes) {\r\n if (!el) {\r\n return;\r\n }\r\n\r\n var classesArr = classes.split(\" \");\r\n\r\n for (var i = 0; i < classesArr.length; i++) {\r\n if (KTUtil.hasClass(el, KTUtil.trim(classesArr[i])) == false) {\r\n return false;\r\n }\r\n }\r\n\r\n return true;\r\n },\r\n\r\n hasClass: function(el, className) {\r\n if (!el) {\r\n return;\r\n }\r\n\r\n return el.classList ? el.classList.contains(className) : new RegExp('\\\\b' + className + '\\\\b').test(el.className);\r\n },\r\n\r\n addClass: function(el, className) {\r\n if (!el || typeof className === 'undefined') {\r\n return;\r\n }\r\n\r\n var classNames = className.split(' ');\r\n\r\n if (el.classList) {\r\n for (var i = 0; i < classNames.length; i++) {\r\n if (classNames[i] && classNames[i].length > 0) {\r\n el.classList.add(KTUtil.trim(classNames[i]));\r\n }\r\n }\r\n } else if (!KTUtil.hasClass(el, className)) {\r\n for (var x = 0; x < classNames.length; x++) {\r\n el.className += ' ' + KTUtil.trim(classNames[x]);\r\n }\r\n }\r\n },\r\n\r\n removeClass: function(el, className) {\r\n if (!el || typeof className === 'undefined') {\r\n return;\r\n }\r\n\r\n var classNames = className.split(' ');\r\n\r\n if (el.classList) {\r\n for (var i = 0; i < classNames.length; i++) {\r\n el.classList.remove(KTUtil.trim(classNames[i]));\r\n }\r\n } else if (KTUtil.hasClass(el, className)) {\r\n for (var x = 0; x < classNames.length; x++) {\r\n el.className = el.className.replace(new RegExp('\\\\b' + KTUtil.trim(classNames[x]) + '\\\\b', 'g'), '');\r\n }\r\n }\r\n },\r\n\r\n triggerCustomEvent: function(el, eventName, data) {\r\n var event;\r\n if (window.CustomEvent) {\r\n event = new CustomEvent(eventName, {\r\n detail: data\r\n });\r\n } else {\r\n event = document.createEvent('CustomEvent');\r\n event.initCustomEvent(eventName, true, true, data);\r\n }\r\n\r\n el.dispatchEvent(event);\r\n },\r\n\r\n triggerEvent: function(node, eventName) {\r\n // Make sure we use the ownerDocument from the provided node to avoid cross-window problems\r\n var doc;\r\n if (node.ownerDocument) {\r\n doc = node.ownerDocument;\r\n } else if (node.nodeType == 9) {\r\n // the node may be the document itself, nodeType 9 = DOCUMENT_NODE\r\n doc = node;\r\n } else {\r\n throw new Error(\"Invalid node passed to fireEvent: \" + node.id);\r\n }\r\n\r\n if (node.dispatchEvent) {\r\n // Gecko-style approach (now the standard) takes more work\r\n var eventClass = \"\";\r\n\r\n // Different events have different event classes.\r\n // If this switch statement can't map an eventName to an eventClass,\r\n // the event firing is going to fail.\r\n switch (eventName) {\r\n case \"click\": // Dispatching of 'click' appears to not work correctly in Safari. Use 'mousedown' or 'mouseup' instead.\r\n case \"mouseenter\":\r\n case \"mouseleave\":\r\n case \"mousedown\":\r\n case \"mouseup\":\r\n eventClass = \"MouseEvents\";\r\n break;\r\n\r\n case \"focus\":\r\n case \"change\":\r\n case \"blur\":\r\n case \"select\":\r\n eventClass = \"HTMLEvents\";\r\n break;\r\n\r\n default:\r\n throw \"fireEvent: Couldn't find an event class for event '\" + eventName + \"'.\";\r\n break;\r\n }\r\n var event = doc.createEvent(eventClass);\r\n\r\n var bubbles = eventName == \"change\" ? false : true;\r\n event.initEvent(eventName, bubbles, true); // All events created as bubbling and cancelable.\r\n\r\n event.synthetic = true; // allow detection of synthetic events\r\n // The second parameter says go ahead with the default action\r\n node.dispatchEvent(event, true);\r\n } else if (node.fireEvent) {\r\n // IE-old school style\r\n var event = doc.createEventObject();\r\n event.synthetic = true; // allow detection of synthetic events\r\n node.fireEvent(\"on\" + eventName, event);\r\n }\r\n },\r\n\r\n index: function( el ){\r\n var c = el.parentNode.children, i = 0;\r\n for(; i < c.length; i++ )\r\n if( c[i] == el ) return i;\r\n },\r\n\r\n trim: function(string) {\r\n return string.trim();\r\n },\r\n\r\n eventTriggered: function(e) {\r\n if (e.currentTarget.dataset.triggered) {\r\n return true;\r\n } else {\r\n e.currentTarget.dataset.triggered = true;\r\n\r\n return false;\r\n }\r\n },\r\n\r\n remove: function(el) {\r\n if (el && el.parentNode) {\r\n el.parentNode.removeChild(el);\r\n }\r\n },\r\n\r\n find: function(parent, query) {\r\n parent = KTUtil.getById(parent);\r\n if (parent) {\r\n return parent.querySelector(query);\r\n }\r\n },\r\n\r\n findAll: function(parent, query) {\r\n parent = KTUtil.getById(parent);\r\n if (parent) {\r\n return parent.querySelectorAll(query);\r\n }\r\n },\r\n\r\n insertAfter: function(el, referenceNode) {\r\n return referenceNode.parentNode.insertBefore(el, referenceNode.nextSibling);\r\n },\r\n\r\n parents: function(elem, selector) {\r\n // Element.matches() polyfill\r\n if (!Element.prototype.matches) {\r\n Element.prototype.matches =\r\n Element.prototype.matchesSelector ||\r\n Element.prototype.mozMatchesSelector ||\r\n Element.prototype.msMatchesSelector ||\r\n Element.prototype.oMatchesSelector ||\r\n Element.prototype.webkitMatchesSelector ||\r\n function(s) {\r\n var matches = (this.document || this.ownerDocument).querySelectorAll(s),\r\n i = matches.length;\r\n while (--i >= 0 && matches.item(i) !== this) {}\r\n return i > -1;\r\n };\r\n }\r\n\r\n // Set up a parent array\r\n var parents = [];\r\n\r\n // Push each parent element to the array\r\n for ( ; elem && elem !== document; elem = elem.parentNode ) {\r\n if (selector) {\r\n if (elem.matches(selector)) {\r\n parents.push(elem);\r\n }\r\n continue;\r\n }\r\n parents.push(elem);\r\n }\r\n\r\n // Return our parent array\r\n return parents;\r\n },\r\n\r\n children: function(el, selector, log) {\r\n if (!el || !el.childNodes) {\r\n return;\r\n }\r\n\r\n var result = [],\r\n i = 0,\r\n l = el.childNodes.length;\r\n\r\n for (var i; i < l; ++i) {\r\n if (el.childNodes[i].nodeType == 1 && KTUtil.matches(el.childNodes[i], selector, log)) {\r\n result.push(el.childNodes[i]);\r\n }\r\n }\r\n\r\n return result;\r\n },\r\n\r\n child: function(el, selector, log) {\r\n var children = KTUtil.children(el, selector, log);\r\n\r\n return children ? children[0] : null;\r\n },\r\n\r\n matches: function(el, selector, log) {\r\n var p = Element.prototype;\r\n var f = p.matches || p.webkitMatchesSelector || p.mozMatchesSelector || p.msMatchesSelector || function(s) {\r\n return [].indexOf.call(document.querySelectorAll(s), this) !== -1;\r\n };\r\n\r\n if (el && el.tagName) {\r\n return f.call(el, selector);\r\n } else {\r\n return false;\r\n }\r\n },\r\n\r\n data: function(el) {\r\n return {\r\n set: function(name, data) {\r\n if (!el) {\r\n return;\r\n }\r\n\r\n if (el.customDataTag === undefined) {\r\n window.KTUtilElementDataStoreID++;\r\n el.customDataTag = window.KTUtilElementDataStoreID;\r\n }\r\n\r\n if (window.KTUtilElementDataStore[el.customDataTag] === undefined) {\r\n window.KTUtilElementDataStore[el.customDataTag] = {};\r\n }\r\n\r\n window.KTUtilElementDataStore[el.customDataTag][name] = data;\r\n },\r\n\r\n get: function(name) {\r\n if (!el) {\r\n return;\r\n }\r\n\r\n if (el.customDataTag === undefined) {\r\n return null;\r\n }\r\n\r\n return this.has(name) ? window.KTUtilElementDataStore[el.customDataTag][name] : null;\r\n },\r\n\r\n has: function(name) {\r\n if (!el) {\r\n return false;\r\n }\r\n\r\n if (el.customDataTag === undefined) {\r\n return false;\r\n }\r\n\r\n return (window.KTUtilElementDataStore[el.customDataTag] && window.KTUtilElementDataStore[el.customDataTag][name]) ? true : false;\r\n },\r\n\r\n remove: function(name) {\r\n if (el && this.has(name)) {\r\n delete window.KTUtilElementDataStore[el.customDataTag][name];\r\n }\r\n }\r\n };\r\n },\r\n\r\n outerWidth: function(el, margin) {\r\n var width;\r\n\r\n if (margin === true) {\r\n width = parseFloat(el.offsetWidth);\r\n width += parseFloat(KTUtil.css(el, 'margin-left')) + parseFloat(KTUtil.css(el, 'margin-right'));\r\n\r\n return parseFloat(width);\r\n } else {\r\n width = parseFloat(el.offsetWidth);\r\n\r\n return width;\r\n }\r\n },\r\n\r\n offset: function(el) {\r\n var rect, win;\r\n\r\n if ( !el ) {\r\n return;\r\n }\r\n\r\n // Return zeros for disconnected and hidden (display: none) elements (gh-2310)\r\n // Support: IE <=11 only\r\n // Running getBoundingClientRect on a\r\n // disconnected node in IE throws an error\r\n\r\n if ( !el.getClientRects().length ) {\r\n return { top: 0, left: 0 };\r\n }\r\n\r\n // Get document-relative position by adding viewport scroll to viewport-relative gBCR\r\n rect = el.getBoundingClientRect();\r\n win = el.ownerDocument.defaultView;\r\n\r\n return {\r\n top: rect.top + win.pageYOffset,\r\n left: rect.left + win.pageXOffset\r\n };\r\n },\r\n\r\n height: function(el) {\r\n return KTUtil.css(el, 'height');\r\n },\r\n\r\n outerHeight: function(el, withMargin) {\r\n var height = el.offsetHeight;\r\n var style;\r\n\r\n if (typeof withMargin !== 'undefined' && withMargin === true) {\r\n style = getComputedStyle(el);\r\n height += parseInt(style.marginTop) + parseInt(style.marginBottom);\r\n\r\n return height;\r\n } else {\r\n return height;\r\n }\r\n },\r\n\r\n visible: function(el) {\r\n return !(el.offsetWidth === 0 && el.offsetHeight === 0);\r\n },\r\n\r\n attr: function(el, name, value) {\r\n if (el == undefined) {\r\n return;\r\n }\r\n\r\n if (value !== undefined) {\r\n el.setAttribute(name, value);\r\n } else {\r\n return el.getAttribute(name);\r\n }\r\n },\r\n\r\n hasAttr: function(el, name) {\r\n if (el == undefined) {\r\n return;\r\n }\r\n\r\n return el.getAttribute(name) ? true : false;\r\n },\r\n\r\n removeAttr: function(el, name) {\r\n if (el == undefined) {\r\n return;\r\n }\r\n\r\n el.removeAttribute(name);\r\n },\r\n\r\n animate: function(from, to, duration, update, easing, done) {\r\n /**\r\n * TinyAnimate.easings\r\n * Adapted from jQuery Easing\r\n */\r\n var easings = {};\r\n var easing;\r\n\r\n easings.linear = function(t, b, c, d) {\r\n return c * t / d + b;\r\n };\r\n\r\n easing = easings.linear;\r\n\r\n // Early bail out if called incorrectly\r\n if (typeof from !== 'number' ||\r\n typeof to !== 'number' ||\r\n typeof duration !== 'number' ||\r\n typeof update !== 'function') {\r\n return;\r\n }\r\n\r\n // Create mock done() function if necessary\r\n if (typeof done !== 'function') {\r\n done = function() {};\r\n }\r\n\r\n // Pick implementation (requestAnimationFrame | setTimeout)\r\n var rAF = window.requestAnimationFrame || function(callback) {\r\n window.setTimeout(callback, 1000 / 50);\r\n };\r\n\r\n // Animation loop\r\n var canceled = false;\r\n var change = to - from;\r\n\r\n function loop(timestamp) {\r\n var time = (timestamp || +new Date()) - start;\r\n\r\n if (time >= 0) {\r\n update(easing(time, from, change, duration));\r\n }\r\n if (time >= 0 && time >= duration) {\r\n update(to);\r\n done();\r\n } else {\r\n rAF(loop);\r\n }\r\n }\r\n\r\n update(from);\r\n\r\n // Start animation loop\r\n var start = window.performance && window.performance.now ? window.performance.now() : +new Date();\r\n\r\n rAF(loop);\r\n },\r\n\r\n actualCss: function(el, prop, cache) {\r\n var css = '';\r\n\r\n if (el instanceof HTMLElement === false) {\r\n return;\r\n }\r\n\r\n if (!el.getAttribute('kt-hidden-' + prop) || cache === false) {\r\n var value;\r\n\r\n // the element is hidden so:\r\n // making the el block so we can meassure its height but still be hidden\r\n css = el.style.cssText;\r\n el.style.cssText = 'position: absolute; visibility: hidden; display: block;';\r\n\r\n if (prop == 'width') {\r\n value = el.offsetWidth;\r\n } else if (prop == 'height') {\r\n value = el.offsetHeight;\r\n }\r\n\r\n el.style.cssText = css;\r\n\r\n // store it in cache\r\n el.setAttribute('kt-hidden-' + prop, value);\r\n\r\n return parseFloat(value);\r\n } else {\r\n // store it in cache\r\n return parseFloat(el.getAttribute('kt-hidden-' + prop));\r\n }\r\n },\r\n\r\n actualHeight: function(el, cache) {\r\n return KTUtil.actualCss(el, 'height', cache);\r\n },\r\n\r\n actualWidth: function(el, cache) {\r\n return KTUtil.actualCss(el, 'width', cache);\r\n },\r\n\r\n getScroll: function(element, method) {\r\n // The passed in `method` value should be 'Top' or 'Left'\r\n method = 'scroll' + method;\r\n return (element == window || element == document) ? (\r\n self[(method == 'scrollTop') ? 'pageYOffset' : 'pageXOffset'] ||\r\n (browserSupportsBoxModel && document.documentElement[method]) ||\r\n document.body[method]\r\n ) : element[method];\r\n },\r\n\r\n css: function(el, styleProp, value) {\r\n if (!el) {\r\n return;\r\n }\r\n\r\n if (value !== undefined) {\r\n el.style[styleProp] = value;\r\n } else {\r\n var defaultView = (el.ownerDocument || document).defaultView;\r\n // W3C standard way:\r\n if (defaultView && defaultView.getComputedStyle) {\r\n // sanitize property name to css notation\r\n // (hyphen separated words eg. font-Size)\r\n styleProp = styleProp.replace(/([A-Z])/g, \"-$1\").toLowerCase();\r\n return defaultView.getComputedStyle(el, null).getPropertyValue(styleProp);\r\n } else if (el.currentStyle) { // IE\r\n // sanitize property name to camelCase\r\n styleProp = styleProp.replace(/\\-(\\w)/g, function(str, letter) {\r\n return letter.toUpperCase();\r\n });\r\n value = el.currentStyle[styleProp];\r\n // convert other units to pixels on IE\r\n if (/^\\d+(em|pt|%|ex)?$/i.test(value)) {\r\n return (function(value) {\r\n var oldLeft = el.style.left,\r\n oldRsLeft = el.runtimeStyle.left;\r\n el.runtimeStyle.left = el.currentStyle.left;\r\n el.style.left = value || 0;\r\n value = el.style.pixelLeft + \"px\";\r\n el.style.left = oldLeft;\r\n el.runtimeStyle.left = oldRsLeft;\r\n return value;\r\n })(value);\r\n }\r\n return value;\r\n }\r\n }\r\n },\r\n\r\n slide: function(el, dir, speed, callback, recalcMaxHeight) {\r\n if (!el || (dir == 'up' && KTUtil.visible(el) === false) || (dir == 'down' && KTUtil.visible(el) === true)) {\r\n return;\r\n }\r\n\r\n speed = (speed ? speed : 600);\r\n var calcHeight = KTUtil.actualHeight(el);\r\n var calcPaddingTop = false;\r\n var calcPaddingBottom = false;\r\n\r\n if (KTUtil.css(el, 'padding-top') && KTUtil.data(el).has('slide-padding-top') !== true) {\r\n KTUtil.data(el).set('slide-padding-top', KTUtil.css(el, 'padding-top'));\r\n }\r\n\r\n if (KTUtil.css(el, 'padding-bottom') && KTUtil.data(el).has('slide-padding-bottom') !== true) {\r\n KTUtil.data(el).set('slide-padding-bottom', KTUtil.css(el, 'padding-bottom'));\r\n }\r\n\r\n if (KTUtil.data(el).has('slide-padding-top')) {\r\n calcPaddingTop = parseInt(KTUtil.data(el).get('slide-padding-top'));\r\n }\r\n\r\n if (KTUtil.data(el).has('slide-padding-bottom')) {\r\n calcPaddingBottom = parseInt(KTUtil.data(el).get('slide-padding-bottom'));\r\n }\r\n\r\n if (dir == 'up') { // up\r\n el.style.cssText = 'display: block; overflow: hidden;';\r\n\r\n if (calcPaddingTop) {\r\n KTUtil.animate(0, calcPaddingTop, speed, function(value) {\r\n el.style.paddingTop = (calcPaddingTop - value) + 'px';\r\n }, 'linear');\r\n }\r\n\r\n if (calcPaddingBottom) {\r\n KTUtil.animate(0, calcPaddingBottom, speed, function(value) {\r\n el.style.paddingBottom = (calcPaddingBottom - value) + 'px';\r\n }, 'linear');\r\n }\r\n\r\n KTUtil.animate(0, calcHeight, speed, function(value) {\r\n el.style.height = (calcHeight - value) + 'px';\r\n }, 'linear', function() {\r\n el.style.height = '';\r\n el.style.display = 'none';\r\n\r\n if (typeof callback === 'function') {\r\n callback();\r\n }\r\n });\r\n\r\n\r\n } else if (dir == 'down') { // down\r\n el.style.cssText = 'display: block; overflow: hidden;';\r\n\r\n if (calcPaddingTop) {\r\n KTUtil.animate(0, calcPaddingTop, speed, function(value) {//\r\n el.style.paddingTop = value + 'px';\r\n }, 'linear', function() {\r\n el.style.paddingTop = '';\r\n });\r\n }\r\n\r\n if (calcPaddingBottom) {\r\n KTUtil.animate(0, calcPaddingBottom, speed, function(value) {\r\n el.style.paddingBottom = value + 'px';\r\n }, 'linear', function() {\r\n el.style.paddingBottom = '';\r\n });\r\n }\r\n\r\n KTUtil.animate(0, calcHeight, speed, function(value) {\r\n el.style.height = value + 'px';\r\n }, 'linear', function() {\r\n el.style.height = '';\r\n el.style.display = '';\r\n el.style.overflow = '';\r\n\r\n if (typeof callback === 'function') {\r\n callback();\r\n }\r\n });\r\n }\r\n },\r\n\r\n slideUp: function(el, speed, callback) {\r\n KTUtil.slide(el, 'up', speed, callback);\r\n },\r\n\r\n slideDown: function(el, speed, callback) {\r\n KTUtil.slide(el, 'down', speed, callback);\r\n },\r\n\r\n show: function(el, display) {\r\n if (typeof el !== 'undefined') {\r\n el.style.display = (display ? display : 'block');\r\n }\r\n },\r\n\r\n hide: function(el) {\r\n if (typeof el !== 'undefined') {\r\n el.style.display = 'none';\r\n }\r\n },\r\n\r\n addEvent: function(el, type, handler, one) {\r\n if (typeof el !== 'undefined' && el !== null) {\r\n el.addEventListener(type, handler);\r\n }\r\n },\r\n\r\n removeEvent: function(el, type, handler) {\r\n if (el !== null) {\r\n el.removeEventListener(type, handler);\r\n }\r\n },\r\n\r\n on: function(element, selector, event, handler) {\r\n if (!selector) {\r\n return;\r\n }\r\n\r\n var eventId = KTUtil.getUniqueID('event');\r\n\r\n window.KTUtilDelegatedEventHandlers[eventId] = function(e) {\r\n var targets = element.querySelectorAll(selector);\r\n var target = e.target;\r\n\r\n while (target && target !== element) {\r\n for (var i = 0, j = targets.length; i < j; i++) {\r\n if (target === targets[i]) {\r\n handler.call(target, e);\r\n }\r\n }\r\n\r\n target = target.parentNode;\r\n }\r\n }\r\n\r\n KTUtil.addEvent(element, event, window.KTUtilDelegatedEventHandlers[eventId]);\r\n\r\n return eventId;\r\n },\r\n\r\n off: function(element, event, eventId) {\r\n if (!element || !window.KTUtilDelegatedEventHandlers[eventId]) {\r\n return;\r\n }\r\n\r\n KTUtil.removeEvent(element, event, window.KTUtilDelegatedEventHandlers[eventId]);\r\n\r\n delete window.KTUtilDelegatedEventHandlers[eventId];\r\n },\r\n\r\n one: function onetime(el, type, callback) {\r\n el.addEventListener(type, function callee(e) {\r\n // remove event\r\n if (e.target && e.target.removeEventListener) {\r\n e.target.removeEventListener(e.type, callee);\r\n }\r\n\r\n // need to verify from https://themeforest.net/author_dashboard#comment_23615588\r\n if (el && el.removeEventListener) {\r\n\t\t\t\t e.currentTarget.removeEventListener(e.type, callee);\r\n\t\t\t }\r\n\r\n // call handler\r\n return callback(e);\r\n });\r\n },\r\n\r\n hash: function(str) {\r\n var hash = 0,\r\n i, chr;\r\n\r\n if (str.length === 0) return hash;\r\n for (i = 0; i < str.length; i++) {\r\n chr = str.charCodeAt(i);\r\n hash = ((hash << 5) - hash) + chr;\r\n hash |= 0; // Convert to 32bit integer\r\n }\r\n\r\n return hash;\r\n },\r\n\r\n animateClass: function(el, animationName, callback) {\r\n var animation;\r\n var animations = {\r\n animation: 'animationend',\r\n OAnimation: 'oAnimationEnd',\r\n MozAnimation: 'mozAnimationEnd',\r\n WebkitAnimation: 'webkitAnimationEnd',\r\n msAnimation: 'msAnimationEnd',\r\n };\r\n\r\n for (var t in animations) {\r\n if (el.style[t] !== undefined) {\r\n animation = animations[t];\r\n }\r\n }\r\n\r\n KTUtil.addClass(el, 'animated ' + animationName);\r\n\r\n KTUtil.one(el, animation, function() {\r\n KTUtil.removeClass(el, 'animated ' + animationName);\r\n });\r\n\r\n if (callback) {\r\n KTUtil.one(el, animation, callback);\r\n }\r\n },\r\n\r\n transitionEnd: function(el, callback) {\r\n var transition;\r\n var transitions = {\r\n transition: 'transitionend',\r\n OTransition: 'oTransitionEnd',\r\n MozTransition: 'mozTransitionEnd',\r\n WebkitTransition: 'webkitTransitionEnd',\r\n msTransition: 'msTransitionEnd'\r\n };\r\n\r\n for (var t in transitions) {\r\n if (el.style[t] !== undefined) {\r\n transition = transitions[t];\r\n }\r\n }\r\n\r\n KTUtil.one(el, transition, callback);\r\n },\r\n\r\n animationEnd: function(el, callback) {\r\n var animation;\r\n var animations = {\r\n animation: 'animationend',\r\n OAnimation: 'oAnimationEnd',\r\n MozAnimation: 'mozAnimationEnd',\r\n WebkitAnimation: 'webkitAnimationEnd',\r\n msAnimation: 'msAnimationEnd'\r\n };\r\n\r\n for (var t in animations) {\r\n if (el.style[t] !== undefined) {\r\n animation = animations[t];\r\n }\r\n }\r\n\r\n KTUtil.one(el, animation, callback);\r\n },\r\n\r\n animateDelay: function(el, value) {\r\n var vendors = ['webkit-', 'moz-', 'ms-', 'o-', ''];\r\n for (var i = 0; i < vendors.length; i++) {\r\n KTUtil.css(el, vendors[i] + 'animation-delay', value);\r\n }\r\n },\r\n\r\n animateDuration: function(el, value) {\r\n var vendors = ['webkit-', 'moz-', 'ms-', 'o-', ''];\r\n for (var i = 0; i < vendors.length; i++) {\r\n KTUtil.css(el, vendors[i] + 'animation-duration', value);\r\n }\r\n },\r\n\r\n scrollTo: function(target, offset, duration) {\r\n var duration = duration ? duration : 500;\r\n var targetPos = target ? KTUtil.offset(target).top : 0;\r\n var scrollPos = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;\r\n var from, to;\r\n\r\n if (offset) {\r\n scrollPos += offset;\r\n }\r\n\r\n from = scrollPos;\r\n to = targetPos;\r\n\r\n KTUtil.animate(from, to, duration, function(value) {\r\n document.documentElement.scrollTop = value;\r\n document.body.parentNode.scrollTop = value;\r\n document.body.scrollTop = value;\r\n }); //, easing, done\r\n },\r\n\r\n scrollTop: function(offset, duration) {\r\n KTUtil.scrollTo(null, offset, duration);\r\n },\r\n\r\n isArray: function(obj) {\r\n return obj && Array.isArray(obj);\r\n },\r\n\r\n ready: function(callback) {\r\n if (document.attachEvent ? document.readyState === \"complete\" : document.readyState !== \"loading\") {\r\n callback();\r\n } else {\r\n document.addEventListener('DOMContentLoaded', callback);\r\n }\r\n },\r\n\r\n isEmpty: function(obj) {\r\n for (var prop in obj) {\r\n if (obj.hasOwnProperty(prop)) {\r\n return false;\r\n }\r\n }\r\n\r\n return true;\r\n },\r\n\r\n numberString: function(nStr) {\r\n nStr += '';\r\n var x = nStr.split('.');\r\n var x1 = x[0];\r\n var x2 = x.length > 1 ? '.' + x[1] : '';\r\n var rgx = /(\\d+)(\\d{3})/;\r\n while (rgx.test(x1)) {\r\n x1 = x1.replace(rgx, '$1' + ',' + '$2');\r\n }\r\n return x1 + x2;\r\n },\r\n\r\n detectIE: function() {\r\n var ua = window.navigator.userAgent;\r\n\r\n // Test values; Uncomment to check result …\r\n\r\n // IE 10\r\n // ua = 'Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)';\r\n\r\n // IE 11\r\n // ua = 'Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko';\r\n\r\n // Edge 12 (Spartan)\r\n // ua = 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.71 Safari/537.36 Edge/12.0';\r\n\r\n // Edge 13\r\n // ua = 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Safari/537.36 Edge/13.10586';\r\n\r\n var msie = ua.indexOf('MSIE ');\r\n if (msie > 0) {\r\n // IE 10 or older => return version number\r\n return parseInt(ua.substring(msie + 5, ua.indexOf('.', msie)), 10);\r\n }\r\n\r\n var trident = ua.indexOf('Trident/');\r\n if (trident > 0) {\r\n // IE 11 => return version number\r\n var rv = ua.indexOf('rv:');\r\n return parseInt(ua.substring(rv + 3, ua.indexOf('.', rv)), 10);\r\n }\r\n\r\n var edge = ua.indexOf('Edge/');\r\n if (edge > 0) {\r\n // Edge (IE 12+) => return version number\r\n return parseInt(ua.substring(edge + 5, ua.indexOf('.', edge)), 10);\r\n }\r\n\r\n // other browser\r\n return false;\r\n },\r\n\r\n isRTL: function() {\r\n var html = KTUtil.getByTagName('html')[0];\r\n\r\n if (html) {\r\n return (KTUtil.attr(html, 'direction') == 'rtl');\r\n }\r\n },\r\n\r\n // Scroller\r\n scrollInit: function(element, options) {\r\n if (!element) {\r\n return;\r\n }\r\n\r\n // Learn more: https://github.com/mdbootstrap/perfect-scrollbar#options\r\n var pluginDefOptions = {\r\n wheelSpeed: 0.5,\r\n swipeEasing: true,\r\n wheelPropagation: false,\r\n minScrollbarLength: 40,\r\n maxScrollbarLength: 300,\r\n suppressScrollX: true\r\n };\r\n\r\n options = KTUtil.deepExtend({}, pluginDefOptions, options);\r\n\r\n // Define init function\r\n function init() {\r\n var ps;\r\n var height;\r\n\r\n // Get extra options via data attributes\r\n var attrs = element.getAttributeNames();\r\n if (attrs.length > 0) {\r\n attrs.forEach(function(attrName) {\r\n \t\t\t// more options; https://github.com/ganlanyuan/tiny-slider#options\r\n \t\t\tif ((/^data-.*/g).test(attrName)) {\r\n if (['scroll', 'height', 'mobile-height'].includes(optionName) == false) {\r\n var optionName = attrName.replace('data-', '').toLowerCase().replace(/(?:[\\s-])\\w/g, function(match) {\r\n \t\t\t\t\treturn match.replace('-', '').toUpperCase();\r\n \t\t\t\t});\r\n\r\n options[optionName] = KTUtil.filterBoolean(element.getAttribute(attrName));\r\n }\r\n \t\t\t}\r\n \t\t});\r\n }\r\n\r\n if (options.height instanceof Function) {\r\n height = options.height.call();\r\n } else {\r\n if (KTUtil.isMobileDevice() === true && options.mobileHeight) {\r\n height = parseInt(options.mobileHeight);\r\n } else if (options.height) {\r\n height = parseInt(options.height);\r\n } else {\r\n height = parseInt(KTUtil.css(element, 'height'));\r\n }\r\n }\r\n\r\n if (height === false) {\r\n KTUtil.scrollDestroy(element, true);\r\n\r\n return;\r\n }\r\n\r\n height = parseInt(height);\r\n\r\n // Destroy scroll on table and mobile modes\r\n if ((options.mobileNativeScroll || options.disableForMobile) && KTUtil.isMobileDevice() === true) {\r\n ps = KTUtil.data(element).get('ps');\r\n if (ps) {\r\n if (options.resetHeightOnDestroy) {\r\n KTUtil.css(element, 'height', 'auto');\r\n } else {\r\n KTUtil.css(element, 'overflow', 'auto');\r\n if (height > 0) {\r\n KTUtil.css(element, 'height', height + 'px');\r\n }\r\n }\r\n\r\n ps.destroy();\r\n ps = KTUtil.data(element).remove('ps');\r\n } else if (height > 0){\r\n KTUtil.css(element, 'overflow', 'auto');\r\n KTUtil.css(element, 'height', height + 'px');\r\n }\r\n\r\n return;\r\n }\r\n\r\n if (height > 0) {\r\n KTUtil.css(element, 'height', height + 'px');\r\n }\r\n\r\n if (options.desktopNativeScroll) {\r\n KTUtil.css(element, 'overflow', 'auto');\r\n return;\r\n }\r\n\r\n // Pass options via HTML Attributes\r\n if (KTUtil.attr(element, 'data-window-scroll') == 'true') {\r\n options.windowScroll = true;\r\n }\r\n\r\n // Init scroll\r\n ps = KTUtil.data(element).get('ps');\r\n\r\n if (ps) {\r\n ps.update();\r\n } else {\r\n KTUtil.css(element, 'overflow', 'hidden');\r\n KTUtil.addClass(element, 'scroll');\r\n\r\n ps = new PerfectScrollbar(element, options);\r\n\r\n KTUtil.data(element).set('ps', ps);\r\n }\r\n\r\n // Remember scroll position in cookie\r\n var uid = KTUtil.attr(element, 'id');\r\n try {\r\n if (uid) {\r\n var cookie = KTCookie.getCookie(uid);\r\n if (options.rememberPosition === true && cookie) {\r\n var pos = parseInt(cookie);\r\n if (pos > 0) {\r\n element.scrollTop = pos;\r\n }\r\n element.addEventListener('ps-scroll-y', function() {\r\n KTCookie.setCookie(uid, element.scrollTop, {});\r\n });\r\n }\r\n }\r\n }\r\n catch (e) {\r\n console.error(e);\r\n }\r\n\r\n // Todo:Consider using Localstorage\r\n if (options.rememberPosition === true && KTCookie && uid) {\r\n if (KTCookie.getCookie(uid)) {\r\n var pos = parseInt(KTCookie.getCookie(uid));\r\n\r\n if (pos > 0) {\r\n element.scrollTop = pos;\r\n }\r\n }\r\n\r\n element.addEventListener('ps-scroll-y', function() {\r\n KTCookie.setCookie(uid, element.scrollTop);\r\n });\r\n }\r\n }\r\n\r\n // Init\r\n init();\r\n\r\n // Handle window resize\r\n if (options.handleWindowResize) {\r\n KTUtil.addResizeHandler(function() {\r\n init();\r\n });\r\n }\r\n },\r\n\r\n scrollUpdate: function(element) {\r\n var ps = KTUtil.data(element).get('ps');\r\n if (ps) {\r\n ps.update();\r\n }\r\n },\r\n\r\n scrollUpdateAll: function(parent) {\r\n var scrollers = KTUtil.findAll(parent, '.ps');\r\n for (var i = 0, len = scrollers.length; i < len; i++) {\r\n KTUtil.scrollUpdate(scrollers[i]);\r\n }\r\n },\r\n\r\n scrollDestroy: function(element, resetAll) {\r\n var ps = KTUtil.data(element).get('ps');\r\n\r\n if (ps) {\r\n ps.destroy();\r\n ps = KTUtil.data(element).remove('ps');\r\n }\r\n\r\n if (element && resetAll) {\r\n element.style.setProperty('overflow', '');\r\n element.style.setProperty('height', '');\r\n }\r\n },\r\n\r\n filterBoolean: function(val) {\r\n // Convert string boolean\r\n\t\t\tif (val === true || val === 'true') {\r\n\t\t\t\treturn true;\r\n\t\t\t}\r\n\r\n\t\t\tif (val === false || val === 'false') {\r\n\t\t\t\treturn false;\r\n\t\t\t}\r\n\r\n return val;\r\n },\r\n\r\n setHTML: function(el, html) {\r\n el.innerHTML = html;\r\n },\r\n\r\n getHTML: function(el) {\r\n if (el) {\r\n return el.innerHTML;\r\n }\r\n },\r\n\r\n getDocumentHeight: function() {\r\n var body = document.body;\r\n var html = document.documentElement;\r\n\r\n return Math.max( body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight );\r\n },\r\n\r\n getScrollTop: function() {\r\n return (document.scrollingElement || document.documentElement).scrollTop;\r\n },\r\n\r\n changeColor: function(col, amt) {\r\n\r\n var usePound = false;\r\n\r\n if (col[0] == \"#\") {\r\n col = col.slice(1);\r\n usePound = true;\r\n }\r\n\r\n var num = parseInt(col,16);\r\n\r\n var r = (num >> 16) + amt;\r\n\r\n if (r > 255) r = 255;\r\n else if (r < 0) r = 0;\r\n\r\n var b = ((num >> 8) & 0x00FF) + amt;\r\n\r\n if (b > 255) b = 255;\r\n else if (b < 0) b = 0;\r\n\r\n var g = (num & 0x0000FF) + amt;\r\n\r\n if (g > 255) g = 255;\r\n else if (g < 0) g = 0;\r\n\r\n return (usePound?\"#\":\"\") + (g | (b << 8) | (r << 16)).toString(16);\r\n\r\n },\r\n\r\n // Throttle function: Input as function which needs to be throttled and delay is the time interval in milliseconds\r\n throttle: function (timer, func, delay) {\r\n \t// If setTimeout is already scheduled, no need to do anything\r\n \tif (timer) {\r\n \t\treturn;\r\n \t}\r\n\r\n \t// Schedule a setTimeout after delay seconds\r\n \ttimer = setTimeout(function () {\r\n \t\tfunc();\r\n\r\n \t\t// Once setTimeout function execution is finished, timerId = undefined so that in
\r\n \t\t// the next scroll event function execution can be scheduled by the setTimeout\r\n \t\ttimer = undefined;\r\n \t}, delay);\r\n },\r\n\r\n // Debounce function: Input as function which needs to be debounced and delay is the debounced time in milliseconds\r\n debounce: function (timer, func, delay) {\r\n \t// Cancels the setTimeout method execution\r\n \tclearTimeout(timer)\r\n\r\n \t// Executes the func after delay time.\r\n \ttimer = setTimeout(func, delay);\r\n },\r\n\r\n btnWait: function(el, cls, message, disable) {\r\n if (!el) {\r\n return;\r\n }\r\n\r\n if (typeof disable !== 'undefined' && disable === true) {\r\n KTUtil.attr(el, \"disabled\", true);\r\n }\r\n\r\n if (cls) {\r\n KTUtil.addClass(el, cls);\r\n KTUtil.attr(el, \"wait-class\", cls);\r\n }\r\n\r\n if (message) {\r\n var caption = KTUtil.find(el, '.btn-caption');\r\n\r\n if (caption) {\r\n KTUtil.data(caption).set('caption', KTUtil.getHTML(caption));\r\n KTUtil.setHTML(caption, message);\r\n } else {\r\n KTUtil.data(el).set('caption', KTUtil.getHTML(el));\r\n KTUtil.setHTML(el, message);\r\n }\r\n }\r\n },\r\n\r\n btnRelease: function(el) {\r\n if (!el) {\r\n return;\r\n }\r\n\r\n /// Show loading state on button\r\n KTUtil.removeAttr(el, \"disabled\");\r\n\r\n if (KTUtil.hasAttr(el, \"wait-class\")) {\r\n KTUtil.removeClass(el, KTUtil.attr(el, \"wait-class\"));\r\n }\r\n\r\n var caption = KTUtil.find(el, '.btn-caption');\r\n\r\n if (caption && KTUtil.data(caption).has('caption')) {\r\n KTUtil.setHTML(caption, KTUtil.data(caption).get('caption'));\r\n } else if (KTUtil.data(el).has('caption')) {\r\n KTUtil.setHTML(el, KTUtil.data(el).get('caption'));\r\n }\r\n },\r\n\r\n isOffscreen: function(el, direction, offset) {\r\n offset = offset || 0;\r\n\r\n var windowWidth = KTUtil.getViewPort().width;\r\n var windowHeight = KTUtil.getViewPort().height;\r\n\r\n var top = KTUtil.offset(el).top;\r\n var height = KTUtil.outerHeight(el) + offset;\r\n var left = KTUtil.offset(el).left;\r\n var width = KTUtil.outerWidth(el) + offset;\r\n\r\n if (direction == 'bottom') {\r\n if (windowHeight < top + height) {\r\n return true;\r\n } else if (windowHeight > top + height * 1.5) {\r\n return true;\r\n }\r\n }\r\n\r\n if (direction == 'top') {\r\n if (top < 0) {\r\n return true;\r\n } else if (top > height) {\r\n return true;\r\n }\r\n }\r\n\r\n if (direction == 'left') {\r\n if (left < 0) {\r\n return true;\r\n } else if (left * 2 > width) {\r\n //console.log('left 2');\r\n //return true;\r\n }\r\n }\r\n\r\n if (direction == 'right') {\r\n if (windowWidth < left + width) {\r\n return true;\r\n } else {\r\n //console.log('right 2');\r\n //return true;\r\n }\r\n }\r\n\r\n return false;\r\n }\r\n }\r\n}();\r\n\r\n// webpack support\r\nif (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {\r\n // module.exports = KTUtil;\r\n}\r\n\r\n// Initialize KTUtil class on document ready\r\nKTUtil.ready(function() {\r\n\tif (typeof KTAppSettings !== 'undefined') {\r\n\t\tKTUtil.init(KTAppSettings);\r\n\t} else {\r\n\t\tKTUtil.init();\r\n\t}\r\n});\r\n\r\n// CSS3 Transitions only after page load(.page-loading class added to body tag and remove with JS on page load)\r\nwindow.onload = function() {\r\n var result = KTUtil.getByTagName('body');\r\n if (result && result[0]) {\r\n KTUtil.removeClass(result[0], 'page-loading');\r\n }\r\n}\r\n","export const actionTypes = {\r\n ShowAlert: \"SHOW_ALERT\",\r\n HideAlert: \"HIDE_ALERT\",\r\n};\r\n\r\nconst initialAlertState = {\r\n isVisible: false,\r\n message: \"\",\r\n variant: \"success\",\r\n};\r\n\r\nexport const reducer = (state = initialAlertState, action) => {\r\n\r\n switch (action.type) {\r\n case actionTypes.ShowAlert: {\r\n return {\r\n isVisible: true,\r\n message: action.payload.message,\r\n variant: action.payload.variant,\r\n top: action.payload.top\r\n };\r\n }\r\n\r\n case actionTypes.HideAlert: {\r\n return initialAlertState;\r\n }\r\n\r\n default:\r\n return state;\r\n }\r\n};\r\n\r\nexport const actions = {\r\n showAlert: (model) => ({ type: actionTypes.ShowAlert, payload: model }),\r\n hideAlert: () => ({ type: actionTypes.HideAlert }),\r\n};\r\n","import { toAbsoluteUrl } from \"../../_helpers\";\r\nexport function getInitLayoutConfig() {\r\n return {\r\n demo: \"demo3\",\r\n // Javascript Settings\r\n js: {\r\n breakpoints: {\r\n sm: 576,\r\n md: 768,\r\n lg: 992,\r\n xl: 1200,\r\n xxl: 1200,\r\n },\r\n colors: {\r\n theme: {\r\n base: {\r\n white: \"#ffffff\",\r\n primary: \"#1BC5BD\",\r\n secondary: \"#E5EAEE\",\r\n success: \"#1BC5BD\",\r\n // info: \"#6993FF\",\r\n info: \"#3699FF\",\r\n warning: \"#FFA800\",\r\n danger: \"#F64E60\",\r\n light: \"#F3F6F9\",\r\n dark: \"#212121\",\r\n },\r\n light: {\r\n white: \"#ffffff\",\r\n primary: \"#1BC5BD\",\r\n secondary: \"#ECF0F3\",\r\n success: \"#C9F7F5\",\r\n info: \"#E1E9FF\",\r\n warning: \"#FFF4DE\",\r\n danger: \"#FFE2E5\",\r\n light: \"#F3F6F9\",\r\n dark: \"#D6D6E0\",\r\n },\r\n inverse: {\r\n white: \"#ffffff\",\r\n primary: \"#ffffff\",\r\n secondary: \"#212121\",\r\n success: \"#ffffff\",\r\n info: \"#ffffff\",\r\n warning: \"#ffffff\",\r\n danger: \"#ffffff\",\r\n light: \"#464E5F\",\r\n dark: \"#ffffff\",\r\n },\r\n },\r\n gray: {\r\n gray100: \"#F3F6F9\",\r\n gray200: \"#ECF0F3\",\r\n gray300: \"#E5EAEE\",\r\n gray400: \"#D6D6E0\",\r\n gray500: \"#B5B5C3\",\r\n gray600: \"#80808F\",\r\n gray700: \"#464E5F\",\r\n gray800: \"#1B283F\",\r\n gray900: \"#212121\",\r\n },\r\n },\r\n // fontFamily: \"Poppins\",\r\n fontFamily: \"Open Sans\",\r\n },\r\n // Base Settins\r\n self: {\r\n layout: \"default\", // blank/default page mode\r\n body: {},\r\n },\r\n // == Page Splash Screen loading\r\n loader: {\r\n enabled: true,\r\n type: \"\", // default|spinner-message|spinner-logo\r\n logo: toAbsoluteUrl(\"/media/logos/logo-dark-sm.png\"),\r\n message: \"Please wait...\",\r\n },\r\n header: {\r\n self: {\r\n fixed: {\r\n mobile: true,\r\n },\r\n }\r\n },\r\n subheader: {\r\n display: true,\r\n displayDesc: false,\r\n displayDaterangepicker: true,\r\n breadcrumb: {\r\n display: true,\r\n },\r\n layout: \"subheader-v6\",\r\n fixed: false,\r\n width: \"fixed\", // fixed/fluid,\r\n clear: false,\r\n style: \"transparent\", // solid/transparent\r\n },\r\n content: {\r\n width: \"fixed\", // fluid|fixed\r\n },\r\n aside: {\r\n self: {\r\n display: true,\r\n fixed: true,\r\n minimize: {\r\n toggle: true,\r\n default: false\r\n }\r\n },\r\n secondary: {\r\n display: true\r\n },\r\n menu: {\r\n dropdown: false, // ok\r\n scroll: false, // ok\r\n \"icon-style\": \"duotone\", // duotone, line, bold, solid\r\n submenu: {\r\n accordion: true,\r\n },\r\n },\r\n },\r\n footer: {\r\n width: \"fixed\", // fixed|fluid\r\n fixed: false\r\n },\r\n extras: {\r\n search: {\r\n display: false,\r\n layout: \"offcanvas\", // offcanvas, dropdown\r\n offcanvas: {\r\n direction: \"right\",\r\n },\r\n },\r\n notifications: {\r\n display: false,\r\n layout: \"offcanvas\", // offcanvas, dropdown\r\n dropdown: {\r\n style: \"dark\", // light, dark\r\n },\r\n offcanvas: {\r\n direction: \"right\",\r\n },\r\n },\r\n \"quick-actions\": {\r\n display: true,\r\n layout: \"offcanvas\", // offcanvas, dropdown,\r\n dropdown: {\r\n style: \"dark\", // light, dark\r\n },\r\n offcanvas: {\r\n direction: \"left\",\r\n },\r\n },\r\n cart: {\r\n display: false,\r\n layout: \"dropdown\", // offcanvas, dropdown\r\n offcanvas: {\r\n direction: \"dark\", // ligth, dark\r\n },\r\n },\r\n chat: {\r\n display: true,\r\n },\r\n user: {\r\n display: true,\r\n layout: \"offcanvas\", // offcanvas, dropdown\r\n dropdown: {\r\n style: \"light\", // light|dark\r\n },\r\n offcanvas: {\r\n direction: \"left\",\r\n },\r\n },\r\n languages: {\r\n display: false,\r\n },\r\n \"quick-panel\": {\r\n display: true,\r\n offcanvas: {\r\n direction: \"left\",\r\n },\r\n },\r\n\r\n toolbar: {\r\n display: true,\r\n },\r\n scrolltop: {\r\n display: true,\r\n },\r\n },\r\n };\r\n}\r\n","import objectPath from \"object-path\";\r\nimport {toAbsoluteUrl} from \"../../_helpers\";\r\n\r\nexport class HtmlClassService {\r\n // Public properties\r\n config;\r\n classes;\r\n attributes;\r\n\r\n /**\r\n * Build html element classes from layout config\r\n * @param layoutConfig\r\n */\r\n setConfig(layoutConfig) {\r\n this.config = this.preInit(layoutConfig);\r\n\r\n // scope list of classes\r\n this.classes = {\r\n header: [],\r\n header_container: [],\r\n header_mobile: [],\r\n header_menu: [],\r\n aside: [],\r\n aside_menu: [],\r\n subheader: [],\r\n subheader_container: [],\r\n content: [],\r\n content_container: [],\r\n footer_container: []\r\n };\r\n\r\n this.attributes = {\r\n aside_menu: {},\r\n header_mobile: {},\r\n header_menu: {}\r\n };\r\n\r\n // init base layout\r\n this.initLoader();\r\n this.initLayout();\r\n\r\n // init header and subheader menu\r\n this.initHeader();\r\n this.initSubheader();\r\n\r\n this.initContent();\r\n // init aside and aside menu\r\n this.initAside();\r\n\r\n // init footer\r\n this.initFooter();\r\n }\r\n\r\n preInit(layoutConfig) {\r\n const updateLayoutConfig = Object.assign({}, layoutConfig);\r\n const subheaderFixed = objectPath.get(layoutConfig, \"subheader.fixed\");\r\n if (subheaderFixed) {\r\n updateLayoutConfig.subheader.style = \"solid\";\r\n } else {\r\n updateLayoutConfig.subheader.fixed = false;\r\n }\r\n return updateLayoutConfig;\r\n }\r\n\r\n /**\r\n * Returns Classes\r\n *\r\n * @param path: string\r\n * @param toString boolean\r\n */\r\n getClasses(path, toString) {\r\n if (path) {\r\n const classes = objectPath.get(this.classes, path) || \"\";\r\n if (toString && Array.isArray(classes)) {\r\n return classes.join(\" \");\r\n }\r\n return classes.toString();\r\n }\r\n return this.classes;\r\n }\r\n\r\n getAttributes(path) {\r\n if (path) {\r\n const attributes = objectPath.get(this.attributes, path) || [];\r\n return attributes;\r\n }\r\n return [];\r\n }\r\n\r\n getLogo() {\r\n const brandSkin = objectPath.get(this.config, \"brand.self.theme\");\r\n if (brandSkin === \"light\") {\r\n return toAbsoluteUrl(\"/media/logos/logo-dark.png\");\r\n } else {\r\n return toAbsoluteUrl(\"/media/logos/logo-light.png\");\r\n }\r\n }\r\n\r\n getStickyLogo() {\r\n let logo = objectPath.get(this.config, \"self.logo.sticky\");\r\n if (typeof logo === \"undefined\") {\r\n logo = this.getLogo();\r\n }\r\n return logo + \"\";\r\n }\r\n\r\n /**\r\n * Init Layout\r\n */\r\n initLayout() {\r\n const selfBodyBackgroundImage = objectPath.get(this.config, \"self.body.backgroundImage\");\r\n if (selfBodyBackgroundImage) {\r\n const backgroundImageUrl = `${toAbsoluteUrl(\"/media/\" + selfBodyBackgroundImage)}`;\r\n document.body.style.backgroundImage = `url(\"${backgroundImageUrl}\")`;\r\n }\r\n\r\n const _selfBodyClass = objectPath.get(this.config, \"self.body.class\");\r\n if (_selfBodyClass) {\r\n const bodyClasses = _selfBodyClass.toString().split(\" \");\r\n bodyClasses.forEach(cssClass => document.body.classList.add(cssClass));\r\n }\r\n }\r\n\r\n /**\r\n * Init Loader\r\n */\r\n initLoader() {}\r\n\r\n /**\r\n * Init Header\r\n */\r\n initHeader() {\r\n const headerSelfFixedMobile = objectPath.get(this.config, \"header.self.fixed.mobile\");\r\n if (headerSelfFixedMobile) {\r\n document.body.classList.add(\"header-mobile-fixed\");\r\n }\r\n }\r\n\r\n /**\r\n * Init Subheader\r\n */\r\n initSubheader() {\r\n const subheaderDisplay = objectPath.get(this.config, \"subheader.display\");\r\n if (subheaderDisplay) {\r\n document.body.classList.add(\"subheader-enabled\");\r\n } else {\r\n return;\r\n }\r\n\r\n // Fixed content head\r\n const subheaderFixed = objectPath.get(this.config, \"subheader.fixed\");\r\n if (subheaderFixed ) {\r\n document.body.classList.add(\"subheader-fixed\");\r\n }\r\n\r\n const subheaderStyle = objectPath.get(this.config, \"subheader.style\");\r\n if (subheaderStyle) {\r\n const subheaderClass = `subheader-${subheaderStyle}`;\r\n objectPath.push(this.classes, \"subheader\", subheaderClass);\r\n }\r\n\r\n const subheaderWidth = objectPath.get(this.config, \"subheader.width\");\r\n if (subheaderWidth === \"fluid\") {\r\n objectPath.push(this.classes, \"subheader_container\", \"container-fluid\");\r\n } else {\r\n objectPath.push(this.classes, \"subheader_container\", \"container\");\r\n }\r\n\r\n const subheaderClear = objectPath.get(this.config, \"subheader.clear\");\r\n if (subheaderClear) {\r\n objectPath.push(this.classes, \"subheader\", \"mb-0\");\r\n }\r\n }\r\n\r\n /**\r\n * Init Content\r\n */\r\n initContent() {\r\n if (objectPath.get(this.config, \"content.fit-top\")) {\r\n objectPath.push(this.classes, \"content\", \"pt-0\");\r\n }\r\n\r\n if (objectPath.get(this.config, \"content.fit-bottom\")) {\r\n objectPath.push(this.classes, \"content\", \"pb-0\");\r\n }\r\n\r\n if (objectPath.get(this.config, \"content.width\") === \"fluid\") {\r\n objectPath.push(this.classes, \"content_container\", \"container-fluid\");\r\n } else {\r\n objectPath.push(this.classes, \"content_container\", \"container\");\r\n }\r\n }\r\n\r\n /**\r\n * Init Aside\r\n */\r\n initAside() {\r\n // Check Aside\r\n const asideSelfDisplay = objectPath.get(this.config, \"aside.self.display\");\r\n if (!asideSelfDisplay) {\r\n return;\r\n }\r\n\r\n // Enable Aside\r\n document.body.classList.add(\"aside-enabled\");\r\n\r\n // Fixed Aside\r\n const asideSelfFixed = objectPath.get(this.config, \"aside.self.fixed\");\r\n if (asideSelfFixed) {\r\n document.body.classList.add(\"aside-fixed\");\r\n objectPath.push(this.classes, \"aside\", \"aside-fixed\");\r\n } else {\r\n document.body.classList.add(\"aside-static\");\r\n }\r\n\r\n\t\t// Aside Secondary\r\n const asideSecondaryDisplay = objectPath.get(this.config, \"aside.secondary.display\");\r\n if (asideSecondaryDisplay) {\r\n document.body.classList.add(\"aside-secondary-enabled\");\r\n } else {\r\n document.body.classList.add(\"aside-secondary-disabled\");\r\n }\r\n\r\n // Check Aside\r\n if (!asideSelfDisplay) {\r\n return;\r\n }\r\n\r\n // Default fixed\r\n const asideSelfMinimizeDefault = objectPath.get(this.config, \"aside.self.minimize.default\");\r\n if (asideSelfMinimizeDefault) {\r\n document.body.classList.add(\"aside-minimize\");\r\n }\r\n\r\n // Menu\r\n // Dropdown Submenu\r\n const asideMenuDropdown = objectPath.get(this.config, \"aside.menu.dropdown\");\r\n if (asideMenuDropdown) {\r\n objectPath.push(this.classes, \"aside_menu\", \"aside-menu-dropdown\");\r\n this.attributes.aside_menu[\"data-menu-dropdown\"] = \"1\";\r\n }\r\n\r\n // Scrollable Menu\r\n this.attributes.aside_menu[\"data-menu-scroll\"] = asideMenuDropdown ? \"0\" : \"1\";\r\n\r\n const asideSubmenuDHoverTimeout = objectPath.get(\r\n this.config,\r\n \"aside.menu.submenu.dropdown.hover-timeout\"\r\n );\r\n if (asideSubmenuDHoverTimeout) {\r\n this.attributes.aside_menu[\r\n \"data-menu-dropdown-timeout\"\r\n ] = asideSubmenuDHoverTimeout;\r\n }\r\n }\r\n\r\n /**\r\n * Init Footer\r\n */\r\n initFooter() {\r\n const footerFixed = objectPath.get(this.config, \"footer.fixed\");\r\n if (footerFixed) {\r\n document.body.classList.add(\"footer-fixed\");\r\n objectPath.push(this.classes, \"footer\", \"bg-white\");\r\n }\r\n\r\n if (objectPath.get(this.config, \"footer.width\") === \"fluid\") {\r\n objectPath.push(this.classes, \"footer_container\", \"container-fluid\");\r\n } else {\r\n objectPath.push(this.classes, \"footer_container\", \"container\");\r\n }\r\n }\r\n}\r\n","import React, { createContext, useContext, useMemo } from \"react\";\r\nimport { getInitLayoutConfig } from \"./LayoutConfig\";\r\nimport { HtmlClassService } from \"./HTMLClassService\";\r\n\r\nconst LAYOUT_CONFIG_KEY =\r\n process.env.REACT_APP_LAYOUT_CONFIG_KEY || \"LayoutConfig\";\r\n\r\nfunction getConfig() {\r\n const ls = localStorage.getItem(LAYOUT_CONFIG_KEY);\r\n if (ls) {\r\n try {\r\n return JSON.parse(ls);\r\n } catch (er) {\r\n console.error(er);\r\n }\r\n }\r\n return getInitLayoutConfig();\r\n}\r\n\r\n// Side effect\r\nexport function setLayoutConfig(config) {\r\n localStorage.setItem(LAYOUT_CONFIG_KEY, JSON.stringify(config));\r\n window.location.reload();\r\n}\r\n\r\nconst HtmlClassServiceContext = createContext();\r\n\r\n/**\r\n *\r\n *\r\n * @export\r\n * @returns Layout context from 'localStorage'\r\n */\r\nexport function useHtmlClassService() {\r\n return useContext(HtmlClassServiceContext);\r\n}\r\n\r\nexport function withHtmlClassService(Component) {\r\n class WithHtmlClassService extends React.Component {\r\n static displayName = `WithHtmlClassService(${Component.displayName ||\r\n Component.name})`;\r\n\r\n static contextType = HtmlClassServiceContext;\r\n\r\n render() {\r\n return
\r\n {layoutProps.asideDisplay && (\r\n \r\n \r\n \r\n )}\r\n
\r\n {/* end::Toolbar */}\r\n \r\n {/* end::Header Mobile */}\r\n \r\n );\r\n}\r\n","/* eslint-disable no-script-url,jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport clsx from \"clsx\";\r\nimport { Dropdown } from \"react-bootstrap\";\r\nimport { OverlayTrigger, Tooltip } from \"react-bootstrap\";\r\nimport { toAbsoluteUrl } from \"../../../../_helpers\";\r\nimport { useLang, setLanguage } from \"../../../../i18n\";\r\nimport { DropdownItemToggler } from \"../../../../_partials/dropdowns\";\r\n\r\nconst languages = [\r\n {\r\n lang: \"en\",\r\n name: \"English\",\r\n flag: toAbsoluteUrl(\"/media/svg/flags/226-united-states.svg\"),\r\n },\r\n {\r\n lang: \"zh\",\r\n name: \"Mandarin\",\r\n flag: toAbsoluteUrl(\"/media/svg/flags/015-china.svg\"),\r\n },\r\n {\r\n lang: \"es\",\r\n name: \"Spanish\",\r\n flag: toAbsoluteUrl(\"/media/svg/flags/128-spain.svg\"),\r\n },\r\n {\r\n lang: \"ja\",\r\n name: \"Japanese\",\r\n flag: toAbsoluteUrl(\"/media/svg/flags/063-japan.svg\"),\r\n },\r\n {\r\n lang: \"de\",\r\n name: \"German\",\r\n flag: toAbsoluteUrl(\"/media/svg/flags/162-germany.svg\"),\r\n },\r\n {\r\n lang: \"fr\",\r\n name: \"French\",\r\n flag: toAbsoluteUrl(\"/media/svg/flags/195-france.svg\"),\r\n },\r\n];\r\n\r\nexport function LanguageSelectorDropdown() {\r\n const lang = useLang();\r\n const currentLanguage = languages.find((x) => x.lang === lang);\r\n return (\r\n \r\n
\r\n \r\n \r\n - \r\n {languages.map((language) => (\r\n
\r\n
\r\n {/* end::Primary */}\r\n\r\n {layoutProps.asideSecondaryDisplay && (\r\n <>\r\n {/* begin::Secondary */}\r\n \r\n {/* begin::Nav */}\r\n
\r\n {/* end::Nav Wrapper */}\r\n\r\n {/* begin::Footer */}\r\n - \r\n {/* begin::Item */}\r\n {\r\n (auth.role === \"SuperAdmin\" || auth.role === \"Admin\" || auth.role === 'Manager')?\r\n
\r\n {/* begin::Aside Toggle */}\r\n {layoutProps.asideSecondaryDisplay &&\r\n layoutProps.asideSelfMinimizeToggle && (\r\n <>\r\n {/* Toggle Aside}\r\n >\r\n \r\n \r\n \r\n */}\r\n \r\n )}\r\n {/* end::Aside Toggle */}\r\n\r\n {/* begin::Search */}\r\n {/* {layoutProps.extrasSearchDisplay && (\r\n Quick Search}\r\n >\r\n \r\n \r\n Notifications\r\n }\r\n >\r\n \r\n \r\n Quick Actions\r\n }\r\n >\r\n \r\n \r\n Quick Panel}\r\n >\r\n \r\n \r\n
\r\n {/* end::Footer */}\r\n \r\n {/* begin::Workspace */}\r\n
\r\n {/* end::Secondary */}\r\n \r\n )}\r\n \r\n {/* end::Aside */}\r\n \r\n );\r\n}\r\n\r\nconst mapStateToProps = (state) => ({\r\n auth: state.auth\r\n})\r\n\r\nexport default connect(mapStateToProps, null)(Aside)","import React, { useMemo } from \"react\";\r\nimport objectPath from \"object-path\";\r\nimport { useHtmlClassService } from \"../../_core/MetronicLayout\";\r\n\r\nexport function Footer() {\r\n const today = new Date().getFullYear();\r\n const uiService = useHtmlClassService();\r\n\r\n const layoutProps = useMemo(() => {\r\n return {\r\n footerLayout: objectPath.get(uiService.config, \"footer.layout\"),\r\n footerClasses: uiService.getClasses(\"footer\", true),\r\n footerContainerClasses: uiService.getClasses(\"footer_container\", true),\r\n };\r\n }, [uiService]);\r\n\r\n return (\r\n <>\r\n {/* \r\n
\r\n {/* end::Workspace */}\r\n \r\n {/*
\r\n \r\n \r\n {today} ©\r\n \r\n {` `}\r\n \r\n Keenthemes\r\n \r\n
\r\n {` `}\r\n\r\n \r\n \r\n About\r\n \r\n \r\n Team\r\n \r\n \r\n Contact\r\n \r\n
\r\n \r\n */}\r\n \r\n );\r\n}\r\n","/* eslint-disable */\r\n\"use strict\";\r\n\r\nimport { KTUtil } from \"./../../components/util.js\";\r\nimport KTOffcanvas from \"./../../components/offcanvas.js\";\r\n\r\nvar KTLayoutAside = function() {\r\n // Private properties\r\n var _body;\r\n var _element;\r\n var _offcanvasObject;\r\n\r\n // Private functions\r\n\t// Initialize\r\n\tvar _init = function() {\r\n\t\tvar offcanvasClass = KTUtil.hasClass(_element, 'aside-offcanvas-default') ? 'aside-offcanvas-default' : 'aside';\r\n\r\n // Initialize mobile aside offcanvas\r\n\t\t_offcanvasObject = new KTOffcanvas(_element, {\r\n\t\t\tbaseClass: offcanvasClass,\r\n\t\t\toverlay: true,\r\n\t\t\tcloseBy: 'kt_aside_close_btn',\r\n\t\t\ttoggleBy: {\r\n\t\t\t\ttarget: 'kt_aside_mobile_toggle',\r\n\t\t\t\tstate: 'mobile-toggle-active'\r\n\t\t\t}\r\n\t\t});\r\n\t}\r\n\r\n var _initNav = function() {\r\n var asideNav = KTUtil.find(_element, '.aside-primary .aside-nav');\r\n\r\n if (!asideNav) {\r\n return;\r\n }\r\n\r\n KTUtil.scrollInit(asideNav, {\r\n disableForMobile: true,\r\n resetHeightOnDestroy: true,\r\n handleWindowResize: true,\r\n height: function() {\r\n var height = parseInt(KTUtil.getViewPort().height);\r\n var asideBrand = KTUtil.find(_element, '.aside-primary .aside-brand');\r\n var asideFooter = KTUtil.find(_element, '.aside-primary .aside-footer');\r\n\r\n height = height - (parseInt(KTUtil.css(asideBrand, 'height')));\r\n height = height - (parseInt(KTUtil.css(asideBrand, 'marginBottom')) + parseInt(KTUtil.css(asideBrand, 'marginTop')));\r\n\r\n height = height - (parseInt(KTUtil.css(asideFooter, 'height')));\r\n height = height - (parseInt(KTUtil.css(asideFooter, 'marginBottom')) + parseInt(KTUtil.css(asideFooter, 'marginTop')));\r\n\r\n return height;\r\n }\r\n });\r\n }\r\n\r\n var _initWorkspace = function() {\r\n var asideTabs = KTUtil.find(_element, '.aside-primary .aside-nav .nav');\r\n var asideWorkspace = KTUtil.find(_element, '.aside-secondary .aside-workspace');\r\n\r\n if (!asideWorkspace) {\r\n return;\r\n }\r\n\r\n KTUtil.scrollInit(asideWorkspace, {\r\n disableForMobile: true,\r\n resetHeightOnDestroy: true,\r\n handleWindowResize: true,\r\n height: function() {\r\n var height = parseInt(KTUtil.getViewPort().height);\r\n var asideSecondary = KTUtil.find(_element, '.aside-secondary');\r\n\r\n height = height - (parseInt(KTUtil.css(asideWorkspace, 'marginBottom')) + parseInt(KTUtil.css(asideWorkspace, 'marginTop')));\r\n height = height - (parseInt(KTUtil.css(asideSecondary, 'paddingBottom')) + parseInt(KTUtil.css(asideSecondary, 'paddingTop')));\r\n\r\n return height;\r\n }\r\n });\r\n\r\n if (asideTabs) {\r\n $(asideTabs).find('a[data-toggle=\"tab\"]').on('shown.bs.tab', function (e) {\r\n KTUtil.scrollUpdate(asideWorkspace);\r\n });\r\n }\r\n }\r\n\r\n // Public methods\r\n\treturn {\r\n\t\tinit: function(id) {\r\n _element = KTUtil.getById(id);\r\n _body = KTUtil.getBody();\r\n\r\n if (!_element) {\r\n return;\r\n }\r\n\r\n // Initialize\r\n _init();\r\n _initNav();\r\n _initWorkspace();\r\n },\r\n\r\n getElement: function() {\r\n return _element;\r\n },\r\n\r\n getOffcanvas: function() {\r\n return _offcanvasObject;\r\n }\r\n\t};\r\n}();\r\n\r\n// Webpack support\r\nif (typeof module !== 'undefined') {\r\n\t// module.exports = KTLayoutAside;\r\n}\r\n\r\nexport default KTLayoutAside;","/* eslint-disable */\r\n\"use strict\";\r\n\r\nimport KTMenu from \"./../../components/menu.js\";\r\nimport { KTUtil } from \"./../../components/util.js\";\r\nimport KTLayoutAside from \"./aside.js\";\r\n\r\nvar KTLayoutAsideMenu = function() {\r\n // Private properties\r\n var _element;\r\n var _menuObject;\r\n\r\n\t// Initialize\r\n\tvar _init = function() {\r\n\t\t_menuObject = new KTMenu(_element, {\r\n\t\t\t// Submenu setup\r\n\t\t\tsubmenu: {\r\n\t\t\t\tdesktop: 'accordion',\r\n\t\t\t\ttablet: 'accordion', // menu set to accordion in tablet mode\r\n\t\t\t\tmobile: 'accordion' // menu set to accordion in mobile mode\r\n\t\t\t},\r\n\r\n\t\t\t// Accordion setup\r\n\t\t\taccordion: {\r\n\t\t\t\texpandAll: false // allow having multiple expanded accordions in the menu\r\n\t\t\t}\r\n\t\t});\r\n\r\n\t\t // Close aside offcanvas panel before page reload On tablet and mobile\r\n _menuObject.on('linkClick', function(menu) {\r\n if (KTUtil.isBreakpointDown('lg')) { // Tablet and mobile mode\r\n KTLayoutAside.getOffcanvas().hide(); // Hide offcanvas after general link click\r\n }\r\n });\r\n\t}\r\n\r\n // Public methods\r\n\treturn {\r\n\t\tinit: function(id) {\r\n _element = KTUtil.getById(id);\r\n\r\n if (!_element) {\r\n return;\r\n }\r\n\r\n // Initialize menu\r\n _init();\r\n\t\t},\r\n\r\n\t\tgetElement: function() {\r\n\t\t\treturn _element;\r\n\t\t},\r\n\r\n getMenu: function() {\r\n\t\t\treturn _menuObject;\r\n\t\t},\r\n\r\n pauseDropdownHover: function(time) {\r\n\t\t\tif (_menuObject) {\r\n\t\t\t\t_menuObject.pauseDropdownHover(time);\r\n\t\t\t}\r\n\t\t},\r\n\r\n\t\tcloseMobileOffcanvas: function() {\r\n\t\t\tif (_menuObject && KTUtil.isMobileDevice()) {\r\n\t\t\t\t_menuObject.hide();\r\n\t\t\t}\r\n\t\t}\r\n\t};\r\n}();\r\n\r\n// Webpack support\r\nif (typeof module !== 'undefined') {\r\n\t// module.exports = KTLayoutAsideMenu;\r\n}\r\n\r\nexport default KTLayoutAsideMenu;","/* eslint-disable */\r\n\"use strict\";\r\n\r\nimport { KTUtil } from \"./../../components/util.js\";\r\n\r\nvar KTLayoutSubheader = function() {\r\n // Private properties\r\n var _element;\r\n\r\n // Private functions\r\n var _getHeight = function() {\r\n var height = 0;\r\n\r\n if (_element) {\r\n height = KTUtil.actualHeight(_element);\r\n }\r\n\r\n return height;\r\n }\r\n\r\n // Public methods\r\n\treturn {\r\n\t\tinit: function(id) {\r\n _element = KTUtil.getById(id);\r\n\r\n if (!_element) {\r\n return;\r\n }\r\n\t\t},\r\n\r\n isFixed: function() {\r\n return KTUtil.hasClass(KTUtil.getBody(), 'subheader-fixed');\r\n },\r\n\r\n getElement: function() {\r\n return _element;\r\n },\r\n\r\n getHeight: function() {\r\n return _getHeight();\r\n }\r\n\t};\r\n}();\r\n\r\n// Webpack support\r\nif (typeof module !== 'undefined') {\r\n\t// module.exports = KTLayoutSubheader;\r\n}\r\n\r\nexport default KTLayoutSubheader;","/* eslint-disable */\r\n\"use strict\";\r\n\r\nimport { KTUtil } from \"./../../components/util.js\";\r\n\r\nvar KTLayoutFooter = function() {\r\n // Private properties\r\n var _element;\r\n\r\n\t// Private functions\r\n\tvar _getHeight = function() {\r\n\t\tvar height = 0;\r\n\r\n if (_element) {\r\n height = KTUtil.actualHeight(_element);\r\n }\r\n\r\n\t\treturn height;\r\n\t}\r\n\r\n // Public methods\r\n\treturn {\r\n\t\tinit: function(id) {\r\n _element = KTUtil.getById(id);\r\n\t\t},\r\n\r\n\t\tgetHeight: function() {\r\n\t\t\treturn _getHeight();\r\n\t\t},\r\n\r\n getElement: function() {\r\n return _element;\r\n }\r\n\t};\r\n}();\r\n\r\n// Webpack support\r\nif (typeof module !== 'undefined') {\r\n\t// module.exports = KTLayoutFooter;\r\n}\r\n\r\nexport default KTLayoutFooter;","/* eslint-disable */\r\n\"use strict\";\r\n\r\nimport { KTUtil } from \"./../../components/util.js\";\r\nimport KTLayoutSubheader from \"./subheader.js\";\r\nimport KTLayoutFooter from \"./footer.js\";\r\n\r\nvar KTLayoutContent = function() {\r\n // Private properties\r\n var _element;\r\n\r\n\t// Private functions\r\n\tvar _getHeight = function() {\r\n\t\tvar height;\r\n\r\n\t\theight = KTUtil.getViewPort().height;\r\n\r\n if (_element) {\r\n height = height - parseInt(KTUtil.css(_element, 'paddingTop')) - parseInt(KTUtil.css(_element, 'paddingBottom'));\r\n }\r\n\r\n height = height - KTLayoutSubheader.getHeight();\r\n height = height - KTLayoutFooter.getHeight();\r\n\r\n\t\treturn height;\r\n\t}\r\n\r\n // Public methods\r\n\treturn {\r\n\t\tinit: function(id) {\r\n _element = KTUtil.getById(id);\r\n\t\t},\r\n\r\n\t\tgetHeight: function() {\r\n\t\t\treturn _getHeight();\r\n\t\t},\r\n\r\n getElement: function() {\r\n return _element;\r\n }\r\n\t};\r\n}();\r\n\r\n// Webpack support\r\nif (typeof module !== 'undefined') {\r\n\t// module.exports = KTLayoutContent;\r\n}\r\n\r\nexport default KTLayoutContent;","/* eslint-disable */\r\n\"use strict\";\r\n\r\nimport KTScrolltop from \"./../../components/scrolltop.js\";\r\nimport { KTUtil } from \"./../../components/util.js\";\r\n\r\nvar KTLayoutScrolltop = function() {\r\n // Private properties\r\n var _element;\r\n var _object;\r\n\r\n // Private functions\r\n var _init = function() {\r\n _object = new KTScrolltop(_element, {\r\n offset: 300,\r\n speed: 600,\r\n });\r\n }\r\n\r\n // Public methods\r\n\treturn {\r\n\t\tinit: function(id) {\r\n _element = KTUtil.getById(id);\r\n\r\n if (!_element) {\r\n return;\r\n }\r\n\r\n // Initialize\r\n _init();\r\n\t\t},\r\n\r\n getElement: function() {\r\n return _element;\r\n }\r\n\t};\r\n}();\r\n\r\n// Webpack support\r\nif (typeof module !== 'undefined') {\r\n\t// module.exports = KTLayoutScrolltop;\r\n}\r\n\r\nexport default KTLayoutScrolltop;","/* eslint-disable */\r\n\"use strict\";\r\n\r\nimport KTCard from \"./../../components/card.js\";\r\nimport { KTUtil } from \"./../../components/util.js\";\r\nimport KTLayoutSubheader from \"./subheader.js\";\r\n\r\nvar KTLayoutStickyCard = function() {\r\n // Private properties\r\n\tvar _element;\r\n var _object;\r\n\r\n\t// Private functions\r\n\tvar _init = function() {\r\n\t\tvar offset = 300;\r\n\r\n\t\tif (typeof KTLayoutHeader !== 'undefined') {\r\n\t\t\toffset = KTLayoutHeader.getHeight();\r\n\t\t}\r\n\r\n _object = new KTCard(_element, {\r\n\t\t\tsticky: {\r\n\t\t\t\toffset: offset,\r\n\t\t\t\tzIndex: 90,\r\n\t\t\t\tposition: {\r\n\t\t\t\t\ttop: function() {\r\n\t\t\t\t\t\tvar pos = 0;\r\n var body = KTUtil.getBody();\r\n\r\n\t\t\t\t\t\tif (KTUtil.isBreakpointUp('lg')) {\r\n\t\t\t\t\t\t\tif (typeof KTLayoutHeader !== 'undefined' && KTLayoutHeader.isFixed()) {\r\n\t\t\t\t\t\t\t\tpos = pos + KTLayoutHeader.getHeight();\r\n\t\t\t\t\t\t\t}\r\n\r\n\t\t\t\t\t\t\tif (typeof KTLayoutSubheader !== 'undefined' && KTLayoutSubheader.isFixed()) {\r\n\t\t\t\t\t\t\t\tpos = pos + KTLayoutSubheader.getHeight();\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t} else {\r\n\t\t\t\t\t\t\tif (typeof KTLayoutHeader !== 'undefined' && KTLayoutHeader.isFixedForMobile()) {\r\n\t\t\t\t\t\t\t\tpos = pos + KTLayoutHeader.getHeightForMobile();\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t}\r\n\r\n\t\t\t\t\t\tpos = pos - 1; // remove header border width\r\n\r\n\t\t\t\t\t\treturn pos;\r\n\t\t\t\t\t},\r\n\t\t\t\t\tleft: function(card) {\r\n\t\t\t\t\t\treturn KTUtil.offset(_element).left;\r\n\t\t\t\t\t},\r\n\t\t\t\t\tright: function(card) {\r\n\t\t\t\t\t\tvar body = KTUtil.getBody();\r\n\r\n\t\t\t\t\t\tvar cardWidth = parseInt(KTUtil.css(_element, 'width'));\r\n\t\t\t\t\t\tvar bodyWidth = parseInt(KTUtil.css(body, 'width'));\r\n\t\t\t\t\t\tvar cardOffsetLeft = KTUtil.offset(_element).left;\r\n\r\n\t\t\t\t\t\treturn bodyWidth - cardWidth - cardOffsetLeft;\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t});\r\n\r\n\t\t_object.initSticky();\r\n\r\n\t\tKTUtil.addResizeHandler(function() {\r\n\t\t\t_object.updateSticky();\r\n\t\t});\r\n\t}\r\n\r\n // Public methods\r\n\treturn {\r\n\t\tinit: function(id) {\r\n _element = KTUtil.getById(id);\r\n\r\n if (!_element) {\r\n return;\r\n }\r\n\r\n // Initialize\r\n\t\t\t_init();\r\n\t\t},\r\n\r\n\t\tupdate: function() {\r\n\t\t\tif (_object) {\r\n\t\t\t\t_object.updateSticky();\r\n\t\t\t}\r\n\t\t}\r\n\t};\r\n}();\r\n\r\n// Webpack support\r\nif (typeof module !== 'undefined') {\r\n\t// module.exports = KTLayoutStickyCard;\r\n}\r\n\r\nexport default KTLayoutStickyCard;","/* eslint-disable */\r\n\"use strict\";\r\n\r\nimport { KTUtil } from \"./../../components/util.js\";\r\nimport KTLayoutContent from \"./content.js\";\r\n\r\nvar KTLayoutStretchedCard = function() {\r\n // Private properties\r\n\tvar _element;\r\n\r\n\t// Private functions\r\n\tvar _init = function() {\r\n\t\tvar scroll = KTUtil.find(_element, '.card-scroll');\r\n\t\tvar cardBody = KTUtil.find(_element, '.card-body');\r\n\t\tvar cardHeader = KTUtil.find(_element, '.card-header');\r\n\r\n\t\tvar height = KTLayoutContent.getHeight();\r\n\r\n\t\theight = height - parseInt(KTUtil.actualHeight(cardHeader));\r\n\r\n\t\theight = height - parseInt(KTUtil.css(_element, 'marginTop')) - parseInt(KTUtil.css(_element, 'marginBottom'));\r\n\t\theight = height - parseInt(KTUtil.css(_element, 'paddingTop')) - parseInt(KTUtil.css(_element, 'paddingBottom'));\r\n\r\n\t\theight = height - parseInt(KTUtil.css(cardBody, 'paddingTop')) - parseInt(KTUtil.css(cardBody, 'paddingBottom'));\r\n\t\theight = height - parseInt(KTUtil.css(cardBody, 'marginTop')) - parseInt(KTUtil.css(cardBody, 'marginBottom'));\r\n\r\n\t\theight = height - 3;\r\n\r\n\t\tKTUtil.css(scroll, 'height', height + 'px');\r\n\t}\r\n\r\n // Public methods\r\n\treturn {\r\n\t\tinit: function(id) {\r\n _element = KTUtil.getById(id);\r\n\r\n if (!_element) {\r\n return;\r\n }\r\n\r\n // Initialize\r\n\t\t\t_init();\r\n\r\n // Re-calculate on window resize\r\n KTUtil.addResizeHandler(function() {\r\n\t\t\t\t_init();\r\n\t\t\t});\r\n\t\t},\r\n\r\n\t\tupdate: function() {\r\n\t\t\t_init();\r\n\t\t}\r\n\t};\r\n}();\r\n\r\n// Webpack support\r\nif (typeof module !== 'undefined') {\r\n\t// module.exports = KTLayoutStretchedCard;\r\n}\r\n\r\nexport default KTLayoutStretchedCard;","/* eslint-disable */\r\n\"use strict\";\r\n\r\nimport { KTUtil } from \"./../../components/util.js\";\r\nimport KTOffcanvas from \"./../../components/offcanvas.js\";\r\n\r\nvar KTLayoutQuickPanel = function() {\r\n // Private properties\r\n var _element;\r\n var _offcanvasObject;\r\n var _notificationsElement;\r\n var _logsElement;\r\n var _settingsElement;\r\n\r\n // Private functions\r\n var _getContentHeight = function() {\r\n var height;\r\n\r\n var header = KTUtil.find(_element, '.offcanvas-header');\r\n var content = KTUtil.find(_element, '.offcanvas-content');\r\n\r\n var height = parseInt(KTUtil.getViewPort().height);\r\n\r\n if (header) {\r\n height = height - parseInt(KTUtil.actualHeight(header));\r\n height = height - parseInt(KTUtil.css(header, 'marginTop'));\r\n height = height - parseInt(KTUtil.css(header, 'marginBottom'));\r\n }\r\n\r\n if (content) {\r\n height = height - parseInt(KTUtil.css(content, 'marginTop'));\r\n height = height - parseInt(KTUtil.css(content, 'marginBottom'));\r\n }\r\n\r\n height = height - parseInt(KTUtil.css(_element, 'paddingTop'));\r\n height = height - parseInt(KTUtil.css(_element, 'paddingBottom'));\r\n\r\n height = height - 2;\r\n\r\n return height;\r\n }\r\n\r\n var _init = function() {\r\n _offcanvasObject = new KTOffcanvas(_element, {\r\n overlay: true,\r\n baseClass: 'offcanvas',\r\n placement: 'right',\r\n closeBy: 'kt_quick_panel_close',\r\n toggleBy: 'kt_quick_panel_toggle'\r\n });\r\n }\r\n\r\n var _initNotifications = function() {\r\n KTUtil.scrollInit(_notificationsElement, {\r\n mobileNativeScroll: true,\r\n resetHeightOnDestroy: true,\r\n handleWindowResize: true,\r\n height: function() {\r\n return _getContentHeight();\r\n }\r\n });\r\n }\r\n\r\n var _initLogs = function() {\r\n KTUtil.scrollInit(_logsElement, {\r\n mobileNativeScroll: true,\r\n resetHeightOnDestroy: true,\r\n handleWindowResize: true,\r\n height: function() {\r\n return _getContentHeight();\r\n }\r\n });\r\n }\r\n\r\n var _initSettings = function() {\r\n KTUtil.scrollInit(_settingsElement, {\r\n mobileNativeScroll: true,\r\n resetHeightOnDestroy: true,\r\n handleWindowResize: true,\r\n height: function() {\r\n return _getContentHeight();\r\n }\r\n });\r\n }\r\n\r\n var _updateScrollbars = function() {\r\n $(_element).find('a[data-toggle=\"tab\"]').on('shown.bs.tab', function (e) {\r\n KTUtil.scrollUpdate(_notificationsElement);\r\n KTUtil.scrollUpdate(_logsElement);\r\n KTUtil.scrollUpdate(_settingsElement);\r\n });\r\n }\r\n\r\n // Public methods\r\n return {\r\n init: function(id) {\r\n _element = KTUtil.getById(id);\r\n _notificationsElement = KTUtil.getById('kt_quick_panel_notifications');\r\n _logsElement = KTUtil.getById('kt_quick_panel_logs');\r\n _settingsElement = KTUtil.getById('kt_quick_panel_settings');\r\n\r\n _init();\r\n _initNotifications();\r\n _initLogs();\r\n _initSettings();\r\n\r\n \r\n }\r\n };\r\n}();\r\n\r\n// Webpack support\r\nif (typeof module !== 'undefined') {\r\n\t// module.exports = KTLayoutQuickPanel;\r\n}\r\n\r\nexport default KTLayoutQuickPanel;","/* eslint-disable */\r\n\"use strict\";\r\n\r\nimport { KTUtil } from \"./../../components/util.js\";\r\nimport KTOffcanvas from \"./../../components/offcanvas.js\";\r\n\r\nvar KTLayoutQuickUser = function() {\r\n // Private properties\r\n var _element;\r\n var _offcanvasObject;\r\n\r\n // Private functions\r\n var _init = function() {\r\n var header = KTUtil.find(_element, '.offcanvas-header');\r\n var content = KTUtil.find(_element, '.offcanvas-content');\r\n\r\n _offcanvasObject = new KTOffcanvas(_element, {\r\n overlay: true,\r\n baseClass: 'offcanvas',\r\n placement: 'right',\r\n closeBy: 'kt_quick_user_close',\r\n toggleBy: 'kt_quick_user_toggle'\r\n });\r\n\r\n KTUtil.scrollInit(content, {\r\n disableForMobile: true,\r\n resetHeightOnDestroy: true,\r\n handleWindowResize: true,\r\n height: function() {\r\n var height = parseInt(KTUtil.getViewPort().height);\r\n\r\n if (header) {\r\n height = height - parseInt(KTUtil.actualHeight(header));\r\n height = height - parseInt(KTUtil.css(header, 'marginTop'));\r\n height = height - parseInt(KTUtil.css(header, 'marginBottom'));\r\n }\r\n\r\n if (content) {\r\n height = height - parseInt(KTUtil.css(content, 'marginTop'));\r\n height = height - parseInt(KTUtil.css(content, 'marginBottom'));\r\n }\r\n\r\n height = height - parseInt(KTUtil.css(_element, 'paddingTop'));\r\n height = height - parseInt(KTUtil.css(_element, 'paddingBottom'));\r\n\r\n height = height - 2;\r\n\r\n return height;\r\n }\r\n });\r\n }\r\n\r\n // Public methods\r\n return {\r\n init: function(id) {\r\n _element = KTUtil.getById(id);\r\n\r\n if (!_element) {\r\n return;\r\n }\r\n\r\n // Initialize\r\n _init();\r\n },\r\n\r\n getElement: function() {\r\n return _element;\r\n }\r\n };\r\n}();\r\n\r\n// Webpack support\r\nif (typeof module !== 'undefined') {\r\n\t// module.exports = KTLayoutQuickUser;\r\n}\r\n\r\nexport default KTLayoutQuickUser;","/* eslint-disable */\r\n\"use strict\";\r\n\r\nimport { KTUtil } from \"./../../components/util.js\";\r\n\r\nvar KTLayoutHeaderMobile = function() {\r\n // Private properties\r\n var _element;\r\n var _object;\r\n\r\n // Get height\r\n var _getHeight = function() {\r\n var height;\r\n\r\n height = KTUtil.actualHeight(_element);\r\n\r\n return height;\r\n }\r\n\r\n // Public methods\r\n\treturn {\r\n\t\tinit: function(id) {\r\n _element = KTUtil.getById(id);\r\n\t\t},\r\n\r\n isFixed: function() {\r\n return KTUtil.hasClass(KTUtil.getBody(), 'header-mobile-fixed')\r\n },\r\n\r\n getElement: function() {\r\n return _element;\r\n },\r\n\r\n getHeader: function() {\r\n return _object;\r\n },\r\n\r\n getHeight: function() {\r\n return _getHeight();\r\n }\r\n\t};\r\n}();\r\n\r\n// Webpack support\r\nif (typeof module !== 'undefined') {\r\n\t// module.exports = KTLayoutHeaderMobile;\r\n}\r\n\r\nexport default KTLayoutHeaderMobile;","/* eslint-disable */\r\n\"use strict\";\r\n\r\nimport KTToggle from \"./../../components/toggle.js\";\r\nimport KTLayoutStickyCard from \"./sticky-card.js\";\r\nimport KTLayoutAsideMenu from \"./aside-menu.js\";\r\nimport { KTCookie } from \"./../../components/cookie.js\";\r\nimport { KTUtil } from \"./../../components/util.js\";\r\n\r\nvar KTLayoutAsideToggle = function() {\r\n // Private properties\r\n var _body;\r\n var _element;\r\n var _toggleObject;\r\n\r\n\t// Initialize\r\n\tvar _init = function() {\r\n\t\t_toggleObject = new KTToggle(_element, _body, {\r\n\t\t\ttargetState: 'aside-minimize',\r\n\t\t\ttoggleState: 'aside-toggle-active'\r\n\t\t});\r\n\r\n\t\t_toggleObject.on('toggle', function(toggle) {\r\n // Update sticky card\r\n if (typeof KTLayoutStickyCard !== 'undefined') {\r\n setTimeout(function() {\r\n KTLayoutStickyCard.update();\r\n }, 500);\r\n }\r\n\r\n // Pause header menu dropdowns\r\n if (typeof KTLayoutHeaderMenu !== 'undefined') {\r\n KTLayoutHeaderMenu.pauseDropdownHover(800);\r\n }\r\n\r\n // Pause aside menu dropdowns\r\n if (typeof KTLayoutAsideMenu !== 'undefined') {\r\n KTLayoutAsideMenu.pauseDropdownHover(800);\r\n }\r\n\r\n // Remember state in cookie\r\n\t\t\tKTCookie.setCookie('kt_aside_toggle_state', toggle.getState());\r\n\t\t\t// to set default minimized left aside use this cookie value in your\r\n\t\t\t// server side code and add \"kt-primary--minimize aside-minimize\" classes to\r\n\t\t\t// the body tag in order to initialize the minimized left aside mode during page loading.\r\n\t\t});\r\n\r\n\t\t_toggleObject.on('beforeToggle', function(toggle) {\r\n\t\t\t//if (KTUtil.hasClass(_body, 'aside-minimize') === false && KTUtil.hasClass(_body, 'aside-minimize-hover')) {\r\n\t\t\t//\tKTUtil.removeClass(_body, 'aside-minimize-hover');\r\n\t\t\t//}\r\n\t\t});\r\n\t}\r\n\r\n // Public methods\r\n\treturn {\r\n\t\tinit: function(id) {\r\n _element = KTUtil.getById(id);\r\n _body = KTUtil.getBody();\r\n\r\n if (!_element) {\r\n return;\r\n }\r\n\r\n // Initialize\r\n _init();\r\n\t\t},\r\n\r\n getElement: function() {\r\n return _element;\r\n },\r\n\r\n getToggle: function() {\r\n\t\t\treturn _toggleObject;\r\n\t\t},\r\n\r\n\t\tonToggle: function(handler) {\r\n\t\t\tif (typeof _toggleObject.element !== 'undefined') {\r\n\t\t\t\t_toggleObject.on('toggle', handler);\r\n\t\t\t}\r\n\t\t}\r\n\t};\r\n}();\r\n\r\n// Webpack support\r\nif (typeof module !== 'undefined') {\r\n\t// module.exports = KTLayoutAsideToggle;\r\n}\r\n\r\nexport default KTLayoutAsideToggle;","/* eslint-disable */\r\n\"use strict\";\r\n\r\nimport { KTUtil } from \"./../../components/util.js\";\r\nimport KTOffcanvas from \"./../../components/offcanvas.js\";\r\n\r\nvar KTLayoutQuickSearch = function() {\r\n // Private properties\r\n var _element;\r\n var _offcanvasObject;\r\n\r\n // Private functions\r\n var _init = function() {\r\n var header = KTUtil.find(_element, '.offcanvas-header');\r\n var content = KTUtil.find(_element, '.offcanvas-content');\r\n var form = KTUtil.find(_element, '.quick-search-form');\r\n var results = KTUtil.find(_element, '.quick-search-wrapper');\r\n\r\n _offcanvasObject = new KTOffcanvas(_element, {\r\n overlay: true,\r\n baseClass: 'offcanvas',\r\n placement: 'right',\r\n closeBy: 'kt_quick_search_close',\r\n toggleBy: 'kt_quick_search_toggle'\r\n });\r\n\r\n KTUtil.scrollInit(results, {\r\n disableForMobile: true,\r\n resetHeightOnDestroy: true,\r\n handleWindowResize: true,\r\n height: function() {\r\n var height = parseInt(KTUtil.getViewPort().height);\r\n\r\n if (header) {\r\n height = height - parseInt(KTUtil.actualHeight(header));\r\n height = height - parseInt(KTUtil.css(header, 'marginTop'));\r\n height = height - parseInt(KTUtil.css(header, 'marginBottom'));\r\n }\r\n\r\n if (content) {\r\n height = height - parseInt(KTUtil.css(content, 'marginTop'));\r\n height = height - parseInt(KTUtil.css(content, 'marginBottom'));\r\n }\r\n\r\n if (results) {\r\n height = height - parseInt(KTUtil.actualHeight(form));\r\n height = height - parseInt(KTUtil.css(form, 'marginTop'));\r\n height = height - parseInt(KTUtil.css(form, 'marginBottom'));\r\n\r\n height = height - parseInt(KTUtil.css(results, 'marginTop'));\r\n height = height - parseInt(KTUtil.css(results, 'marginBottom'));\r\n }\r\n\r\n height = height - parseInt(KTUtil.css(_element, 'paddingTop'));\r\n height = height - parseInt(KTUtil.css(_element, 'paddingBottom'));\r\n\r\n height = height - 2;\r\n\r\n return height;\r\n }\r\n });\r\n }\r\n\r\n // Public methods\r\n return {\r\n init: function(id) {\r\n _element = KTUtil.getById(id);\r\n\r\n if (!_element) {\r\n return;\r\n }\r\n\r\n // Initialize\r\n _init();\r\n },\r\n\r\n getElement: function() {\r\n return _element;\r\n }\r\n };\r\n}();\r\n\r\n// Webpack support\r\nif (typeof module !== 'undefined') {\r\n\t// module.exports = KTLayoutQuickSearch;\r\n}\r\n\r\nexport default KTLayoutQuickSearch;","/* eslint-disable */\r\n\"use strict\";\r\n\r\nimport { KTUtil } from \"./../../components/util.js\";\r\nimport KTOffcanvas from \"./../../components/offcanvas.js\";\r\n\r\nvar KTLayoutQuickNotifications = function() {\r\n // Private properties\r\n var _element;\r\n var _offcanvasObject;\r\n\r\n // Private functions\r\n var _init = function() {\r\n var header = KTUtil.find(_element, '.offcanvas-header');\r\n var content = KTUtil.find(_element, '.offcanvas-content');\r\n\r\n _offcanvasObject = new KTOffcanvas(_element, {\r\n overlay: true,\r\n baseClass: 'offcanvas',\r\n placement: 'right',\r\n closeBy: 'kt_quick_notifications_close',\r\n toggleBy: 'kt_quick_notifications_toggle'\r\n });\r\n\r\n KTUtil.scrollInit(content, {\r\n disableForMobile: true,\r\n resetHeightOnDestroy: true,\r\n handleWindowResize: true,\r\n height: function() {\r\n var height = parseInt(KTUtil.getViewPort().height);\r\n\r\n if (header) {\r\n height = height - parseInt(KTUtil.actualHeight(header));\r\n height = height - parseInt(KTUtil.css(header, 'marginTop'));\r\n height = height - parseInt(KTUtil.css(header, 'marginBottom'));\r\n }\r\n\r\n if (content) {\r\n height = height - parseInt(KTUtil.css(content, 'marginTop'));\r\n height = height - parseInt(KTUtil.css(content, 'marginBottom'));\r\n }\r\n\r\n height = height - parseInt(KTUtil.css(_element, 'paddingTop'));\r\n height = height - parseInt(KTUtil.css(_element, 'paddingBottom'));\r\n\r\n height = height - 2;\r\n\r\n return height;\r\n }\r\n });\r\n }\r\n\r\n // Public methods\r\n return {\r\n init: function(id) {\r\n _element = KTUtil.getById(id);\r\n\r\n if (!_element) {\r\n return;\r\n }\r\n\r\n // Initialize\r\n _init();\r\n },\r\n\r\n getElement: function() {\r\n return _element;\r\n }\r\n };\r\n}();\r\n\r\n// Webpack support\r\nif (typeof module !== 'undefined') {\r\n\t// module.exports = KTLayoutQuickNotifications;\r\n}\r\n\r\nexport default KTLayoutQuickNotifications;","/* eslint-disable */\r\n\"use strict\";\r\n\r\nimport { KTUtil } from \"./../../components/util.js\";\r\nimport KTOffcanvas from \"./../../components/offcanvas.js\";\r\n\r\nvar KTLayoutQuickActions = function() {\r\n // Private properties\r\n var _element;\r\n var _offcanvasObject;\r\n\r\n // Private functions\r\n var _init = function() {\r\n var header = KTUtil.find(_element, '.offcanvas-header');\r\n var content = KTUtil.find(_element, '.offcanvas-content');\r\n\r\n _offcanvasObject = new KTOffcanvas(_element, {\r\n overlay: true,\r\n baseClass: 'offcanvas',\r\n placement: 'right',\r\n closeBy: 'kt_quick_actions_close',\r\n toggleBy: 'kt_quick_actions_toggle'\r\n });\r\n\r\n KTUtil.scrollInit(content, {\r\n disableForMobile: true,\r\n resetHeightOnDestroy: true,\r\n handleWindowResize: true,\r\n height: function() {\r\n var height = parseInt(KTUtil.getViewPort().height);\r\n\r\n if (header) {\r\n height = height - parseInt(KTUtil.actualHeight(header));\r\n height = height - parseInt(KTUtil.css(header, 'marginTop'));\r\n height = height - parseInt(KTUtil.css(header, 'marginBottom'));\r\n }\r\n\r\n if (content) {\r\n height = height - parseInt(KTUtil.css(content, 'marginTop'));\r\n height = height - parseInt(KTUtil.css(content, 'marginBottom'));\r\n }\r\n\r\n height = height - parseInt(KTUtil.css(_element, 'paddingTop'));\r\n height = height - parseInt(KTUtil.css(_element, 'paddingBottom'));\r\n\r\n height = height - 2;\r\n\r\n return height;\r\n }\r\n });\r\n }\r\n\r\n // Public methods\r\n return {\r\n init: function(id) {\r\n _element = KTUtil.getById(id);\r\n\r\n if (!_element) {\r\n return;\r\n }\r\n\r\n // Initialize\r\n _init();\r\n },\r\n\r\n getElement: function() {\r\n return _element;\r\n }\r\n };\r\n}();\r\n\r\n// Webpack support\r\nif (typeof module !== 'undefined') {\r\n\t// module.exports = KTLayoutQuickActions;\r\n}\r\n\r\nexport default KTLayoutQuickActions;","import React, { useLayoutEffect } from \"react\";\r\nimport { KTUtil } from \"../../_assets/js/components/util\";\r\nimport KTLayoutAside from \"../../_assets/js/layout/base/aside\";\r\nimport KTLayoutAsideMenu from \"../../_assets/js/layout/base/aside-menu\";\r\nimport KTLayoutContent from \"../../_assets/js/layout/base/content\";\r\nimport KTLayoutFooter from \"../../_assets/js/layout/base/footer\";\r\nimport KTLayoutSubheader from \"../../_assets/js/layout/base/subheader\";\r\nimport KTLayoutScrolltop from \"../../_assets/js/layout/extended/scrolltop\";\r\nimport KTLayoutStickyCard from \"../../_assets/js/layout/base/sticky-card\";\r\nimport KTLayoutStretchedCard from \"../../_assets/js/layout/base/stretched-card\";\r\nimport KTLayoutQuickPanel from \"../../_assets/js/layout/extended/quick-panel\";\r\nimport KTLayoutQuickUser from \"../../_assets/js/layout/extended/quick-user\";\r\nimport KTLayoutHeaderMobile from \"../../_assets/js/layout/base/header-mobile\";\r\nimport KTLayoutAsideToggle from \"../../_assets/js/layout/base/aside-toggle\";\r\nimport KTLayoutQuickSearch from \"../../_assets/js/layout/extended/quick-search\";\r\nimport KTLayoutQuickNotifications from \"../../_assets/js/layout/extended/quick-notifications\";\r\nimport KTLayoutQuickActions from \"../../_assets/js/layout/extended/quick-actions\";\r\n\r\nexport function LayoutInit() {\r\n useLayoutEffect(() => {\r\n // Initialization\r\n KTUtil.ready(function() {\r\n ////////////////////////////////////////////////////\r\n // Layout Base Partials(mandatory for core layout)//\r\n ////////////////////////////////////////////////////\r\n\r\n // Init Mobile Header\r\n KTLayoutHeaderMobile.init(\"kt_header_mobile\");\r\n\r\n // Init Aside\r\n KTLayoutAside.init(\"kt_aside\");\r\n\r\n // Init Aside Toggle\r\n KTLayoutAsideToggle.init(\"kt_aside_toggle\");\r\n\r\n // Init Aside Menu\r\n KTLayoutAsideMenu.init(\"kt_aside_menu\");\r\n\r\n // Init Content\r\n KTLayoutContent.init(\"kt_content\");\r\n\r\n // Init Footer\r\n KTLayoutFooter.init(\"kt_footer\");\r\n\r\n //////////////////////////////////////////////\r\n // Layout Extended Partials(optional to use)//\r\n //////////////////////////////////////////////\r\n\r\n // Init subheader\r\n KTLayoutSubheader.init(\"kt_subheader\");\r\n\r\n // Init Scrolltop\r\n KTLayoutScrolltop.init(\"kt_scrolltop\");\r\n\r\n // Init Sticky Card\r\n KTLayoutStickyCard.init(\"kt_page_sticky_card\");\r\n\r\n // Init Stretched Card\r\n KTLayoutStretchedCard.init(\"kt_page_stretched_card\");\r\n\r\n // Init Quick Actions Offcanvas Panel\r\n KTLayoutQuickActions.init(\"kt_quick_actions\");\r\n\r\n // Init Quick Offcanvas Panel\r\n KTLayoutQuickPanel.init(\"kt_quick_panel\");\r\n\r\n // Init Quick User Panel\r\n KTLayoutQuickUser.init(\"kt_quick_user\");\r\n\r\n // Init Quick Search Panel\r\n KTLayoutQuickSearch.init(\"kt_quick_search\");\r\n\r\n // Init Quick Notifications Offcanvas Panel\r\n KTLayoutQuickNotifications.init(\"kt_quick_notifications\");\r\n });\r\n }, []);\r\n return <>;\r\n}\r\n","/* eslint-disable no-restricted-imports */\r\n/* eslint-disable no-script-url,jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport { Link } from 'react-router-dom';\r\nimport SVG from \"react-inlinesvg\";\r\nimport { toAbsoluteUrl } from \"../../../../_helpers\";\r\n\r\nexport function QuickActions() {\r\n return (\r\n <>\r\n - \r\n \r\n Dashboard\r\n \r\n {items.map((item, index) => (\r\n
- \r\n
\r\n {/* begin::Mobile Toggle */}\r\n {layoutProps.subheaderMobileToggle && (\r\n \r\n \r\n \r\n )}\r\n {/* end::Mobile Toggle */}\r\n\r\n {/* begin::Heading */}\r\n
\r\n {/* Toolbar */}\r\n \r\n {/* begin::Title */}\r\n
\r\n {/* end::Heading */}\r\n \r\n {subheader.title}\r\n
\r\n {/* end::Title */}\r\n\r\n\r\n {\r\n (auth.role === \"SuperAdmin\" || auth.role === \"Admin\" || auth.role === 'Manager' || auth.role === 'User') ?\r\n <>\r\n \r\n \r\n \r\n \r\n View Nspections\r\n \r\n {\r\n (auth.role === \"SuperAdmin\" || auth.role === \"Admin\") &&\r\n Logout\r\n }\r\n >\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n\r\n \r\n {\r\n auth && auth.user.tier === 'Individual' && auth.role === 'Admin' && (\r\n
\r\n \r\n\r\n \r\n );\r\n}\r\n\r\nconst mapStateToProps = (state) => ({\r\n auth: state.auth\r\n});\r\n\r\nexport default connect(mapStateToProps, authRedux.actions)(SubHeader);","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport { Link } from \"react-router-dom\";\r\nimport { shallowEqual, useSelector } from \"react-redux\";\r\nimport SVG from \"react-inlinesvg\";\r\nimport { useHistory } from \"react-router-dom\";\r\nimport { toAbsoluteUrl } from \"../../../../_helpers\";\r\n\r\nexport function QuickUser() {\r\n const history = useHistory();\r\n const user = useSelector((state) => state.auth.user, shallowEqual);\r\n\r\n const logoutClick = () => {\r\n const toggle = document.getElementById(\"kt_quick_user_toggle\");\r\n if (toggle) {\r\n toggle.click();\r\n }\r\n history.push(\"/logout\");\r\n };\r\n\r\n return (\r\n \r\n \r\n You are currently using individual tier account. To access the full features, click handleLinkClick(link, 'Starter')}\r\n >here to upgrade\r\n \r\n
\r\n )\r\n }\r\n {\r\n auth && auth.user.tier === 'Individual' && auth.role !== 'Admin' && (\r\n \r\n \r\n You are currently using individual tier account. To access the full features, please contact your administrator.\r\n \r\n
\r\n )\r\n }\r\n\r\n {\r\n auth && auth.user.tier === 'Starter' && auth.role === 'Admin' && (\r\n \r\n \r\n You are currently using starter tier account. To access the full features, click handleLinkClick(link, 'Business')}\r\n >here to upgrade\r\n \r\n
\r\n )\r\n }\r\n\r\n {\r\n auth && auth.user.tier === 'Starter' && auth.role !== 'Admin' && (\r\n \r\n \r\n You are currently using starter tier account. To access the full features, please contact your administrator.\r\n \r\n
\r\n )\r\n }\r\n \r\n
\r\n );\r\n}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React, { useState } from \"react\";\r\nimport { Link } from 'react-router-dom';\r\nimport SVG from \"react-inlinesvg\";\r\nimport { toAbsoluteUrl } from \"../../../../_helpers\";\r\nimport * as clientService from \"../../../../../services/management/clientService\";\r\n\r\nexport function QuickActions({ role, clientRefId }) {\r\n const [paymentProfileLinks, setPaymentProfileLinks] = useState({});\r\n\r\n const loadPaymentProfileLink = (id) => {\r\n const existingLinkInfo = paymentProfileLinks[id];\r\n\r\n if (existingLinkInfo) {\r\n const expiresAt = new Date(existingLinkInfo.expiresAt);\r\n const now = new Date();\r\n\r\n if (expiresAt > now) {\r\n window.open(existingLinkInfo.url, '_blank'); // Open URL in a new tab\r\n return;\r\n }\r\n }\r\n\r\n clientService.getManagementLink(id).then(res => {\r\n if (res && res.url && res.expiresAt) {\r\n const expiresAt = new Date(res.expiresAt);\r\n const now = new Date();\r\n\r\n if (expiresAt > now) {\r\n setPaymentProfileLinks({\r\n ...paymentProfileLinks,\r\n [id]: { url: res.url, expiresAt: res.expiresAt } // Store the URL and its expiry time\r\n });\r\n window.open(res.url, '_blank'); // Open URL in a new tab\r\n } else {\r\n console.log(\"Link has expired\");\r\n }\r\n } else {\r\n console.log(\"Failed to get a valid URL or expiry date.\");\r\n }\r\n }).catch(ex => {\r\n console.log(ex);\r\n })\r\n }\r\n\r\n return (\r\n <>\r\n {/* begin::Quick Actions Panel */}\r\n \r\n \r\n \r\n \r\n
\r\n\r\n \r\n User Profile\r\n 12 messages\r\n
\r\n\r\n
\r\n \r\n
\r\n\r\n \r\n\r\n \r\n
\r\n \r\n \r\n {user.firstname} {user.lastname}\r\n \r\n \r\n Sign out\r\n \r\n
\r\n {user.occupation}
\r\n \r\n {/* \r\n Sign Out\r\n */}\r\n \r\n \r\n
\r\n\r\n \r\n\r\n \r\n
\r\n \r\n\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n My Profile
\r\n \r\n Account settings and more{\" \"}\r\n \r\n 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\n \r\n
\r\n \r\n
\r\n My Messages
\r\n Inbox and tasks
\r\n \r\n
\r\n \r\n\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n My Activities
\r\n Logs and notifications
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n My Tasks
\r\n latest tasks and projects
\r\n \r\n
\r\n Recent Notifications
\r\n\r\n\r\n \r\n \r\n \r\n\r\n
\r\n\r\n \r\n \r\n Another purpose persuade\r\n \r\n Due in 2 Days\r\n
\r\n\r\n \r\n +28%\r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n Would be to people\r\n \r\n Due in 2 Days\r\n
\r\n\r\n \r\n +50%\r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n Purpose would be to persuade\r\n \r\n Due in 2 Days\r\n
\r\n\r\n \r\n -27%\r\n \r\n \r\n \r\n \r\n \r\n\r\n
\r\n \r\n \r\n The best product\r\n \r\n Due in 2 Days\r\n
\r\n\r\n \r\n +8%\r\n \r\n \r\n {/* begin::Header */}\r\n
\r\n {/* end::Quick Actions Panel */}\r\n \r\n );\r\n}\r\n","import React from \"react\";\r\nimport SVG from \"react-inlinesvg\";\r\nimport {toAbsoluteUrl} from \"../../../_helpers\";\r\n\r\nexport function ScrollTop() {\r\n return (\r\n \r\n \r\n \r\n \r\n
\r\n {/* end::Header */}\r\n\r\n {/* begin::Content */}\r\n \r\n Quick Actions\r\n \r\n {/* finance & reports */}\r\n \r\n
\r\n\r\n {\r\n role !== 'Viewer' && role !== 'User' &&\r\n (\r\n
\r\n {/* end::Content */}\r\n \r\n {/* begin::Item */}\r\n
\r\n )\r\n }\r\n \r\n \r\n \r\n
\r\n {/* end::Item */}\r\n \r\n \r\n \r\n
\r\n {/* begin::Item */}\r\n\r\n\r\n {/* end::Item */}\r\n \r\n\r\n {/* begin::Item */}\r\n {\r\n (role === 'SuperAdmin' || role === 'Admin') &&\r\n
\r\n {\r\n role === 'SuperAdmin' &&\r\n \r\n \r\n \r\n \r\n
\r\n }\r\n {/* end::Item */}\r\n\r\n {/* begin::Item */}\r\n {\r\n (role !== 'Viewer') &&\r\n \r\n \r\n \r\n \r\n
\r\n }\r\n\r\n \r\n {/* begin::Item */}\r\n
\r\n }\r\n\r\n {\r\n role === 'Admin' &&\r\n \r\n \r\n \r\n
\r\n \r\n {/* begin::Item */}\r\n
\r\n }\r\n\r\n\r\n \r\n loadPaymentProfileLink(clientRefId)}\r\n className=\"btn btn-block btn-light btn-hover-primary text-dark-50 text-center py-10 px-5\"\r\n >\r\n \r\n
\r\n \r\n {/* begin::Item */}\r\n {/*
\r\n \r\n \r\n \r\n
*/}\r\n\r\n {/* \r\n \r\n \r\n
*/}\r\n {/* end::Item */}\r\n\r\n {/* begin::Item */}\r\n {/* \r\n \r\n \r\n
*/}\r\n {/* end::Item */}\r\n \r\n {/* begin::Item */}\r\n {/*
\r\n \r\n \r\n \r\n
*/}\r\n {/* end::Item */}\r\n \r\n \r\n \r\n {\" \"}\r\n
\r\n );\r\n}\r\n","import React, { useMemo } from \"react\";\r\nimport objectPath from \"object-path\";\r\n// LayoutContext\r\nimport { useHtmlClassService } from \"../_core/MetronicLayout\";\r\n// Import Layout components\r\nimport { HeaderMobile } from \"./header-mobile/HeaderMobile\";\r\nimport Aside from \"./aside/Aside\";\r\nimport { Footer } from \"./footer/Footer\";\r\nimport { LayoutInit } from \"./LayoutInit\";\r\nimport SubHeader from \"./subheader/SubHeader\";\r\nimport { QuickPanel } from \"./extras/offcanvas/QuickPanel\";\r\nimport { QuickUser } from \"./extras/offcanvas/QuickUser\";\r\nimport { QuickSearch } from \"./extras/offcanvas/QuickSearch\";\r\nimport { QuickNotification } from \"./extras/offcanvas/QuickNotification\";\r\nimport { QuickActions } from \"./extras/offcanvas/QuickActions\";\r\nimport { ScrollTop } from \"./extras/ScrollTop\";\r\nimport { StickyToolbar } from \"./extras/StickyToolbar\";\r\nimport { AnimateLoading } from \"../../_partials/controls\";\r\n\r\nexport function Layout({ children, role, clientRefId }) {\r\n const uiService = useHtmlClassService();\r\n // Layout settings (cssClasses/cssAttributes)\r\n const layoutProps = useMemo(() => {\r\n return {\r\n selfLayout: objectPath.get(uiService.config, \"self.layout\"),\r\n subheaderDisplay: objectPath.get(uiService.config, \"subheader.display\"),\r\n contentCssClasses: uiService.getClasses(\"content\", true),\r\n contentContainerClasses: uiService.getClasses(\"content_container\", true),\r\n contentExtended: objectPath.get(uiService.config, \"content.extended\"),\r\n };\r\n }, [uiService]);\r\n\r\n return layoutProps.selfLayout !== \"blank\" ? (\r\n <>\r\n {/*begin::Main*/}\r\n \r\n {/*begin::Page*/}\r\n
\r\n {/*end::Wrapper*/}\r\n \r\n {/*end::Page*/}\r\n \r\n \r\n \r\n\r\n {/*begin::Wrapper*/}\r\n \r\n {/*begin::Content*/}\r\n \r\n
\r\n {/*end::Content*/}\r\n \r\n \r\n {/*begin::Container*/}\r\n
\r\n )}\r\n\r\n {/*end::Entry*/}\r\n \r\n {children}\r\n
\r\n {/*end::Container*/}\r\n {children}
\r\n );\r\n}\r\n","import React, {useEffect, useState} from \"react\";\r\nimport {useRouteMatch} from \"react-router-dom\";\r\n\r\nexport function Content({ children }) {\r\n const match = useRouteMatch() || {};\r\n const animationEndClass = \"grid-animateContent-finished\";\r\n const [cssClassesState, setCssClassesState] = useState([\r\n \"grid-animateContent\",\r\n animationEndClass\r\n ]);\r\n\r\n useEffect(() => {\r\n // for animation start should toggle 'grid-animateContent-finished' css class\r\n // TODO: change useMemo\r\n const fullClasses = [...cssClassesState];\r\n const startAnimation = fullClasses.filter(el => el !== animationEndClass);\r\n setCssClassesState(startAnimation);\r\n const timeOutId = setTimeout(() => {\r\n setCssClassesState(fullClasses);\r\n }, 200);\r\n\r\n return () => {\r\n clearTimeout(timeOutId);\r\n };\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [match.url]);\r\n\r\n return <>{children};\r\n}\r\n","import React from \"react\";\r\nimport {Route} from \"react-router-dom\";\r\nimport {Content} from \"./Content\";\r\n\r\nexport function ContentRoute({ children, component, render, ...props }) {\r\n return (\r\n Please wait...
};\r\n}\r\n\r\nexport function NoRecordsFoundMessage({ entities }) {\r\n const customersList = entities === null ? [] : entities;\r\n return (\r\n <>\r\n {customersList.length === 0 && entities !== null && (\r\n No records found
\r\n )}\r\n \r\n );\r\n}\r\n","import React from \"react\";\r\n\r\nfunction SelectionCheckbox({ isSelected, onChange }) {\r\n return (\r\n <>\r\n \r\n \r\n \r\n );\r\n}\r\n\r\nfunction groupingItemOnSelect(props) {\r\n const { ids, setIds, customerId } = props;\r\n if (ids.some((id) => id === customerId)) {\r\n setIds(ids.filter((id) => id !== customerId));\r\n } else {\r\n const newIds = [...ids];\r\n newIds.push(customerId);\r\n setIds(newIds);\r\n }\r\n}\r\n\r\nfunction groupingAllOnSelect(props) {\r\n const { isSelected, setIds, entities } = props;\r\n if (!isSelected) {\r\n const allIds = [];\r\n entities.forEach((el) => allIds.push(el.id));\r\n setIds(allIds);\r\n } else {\r\n setIds([]);\r\n }\r\n\r\n return isSelected;\r\n}\r\n\r\n// check official documentations: https://react-bootstrap-table.github.io/react-bootstrap-table2/storybook/index.html?selectedKind=Row%20Selection&selectedStory=Custom%20Selection%20Column%20Header%20Style&full=0&addons=1&stories=1&panelRight=0&addonPanel=storybook%2Factions%2Factions-panel\r\nexport function getSelectRow(props) {\r\n const { entities, ids, setIds } = props;\r\n return {\r\n mode: \"checkbox\",\r\n clickToSelect: true,\r\n hideSelectAll: false,\r\n selectionHeaderRenderer: () => {\r\n const isSelected =\r\n entities && entities.length > 0 && entities.length === ids.length;\r\n const props = { isSelected, entities, setIds };\r\n return (\r\n - \r\n
- \r\n Choose Label:\r\n \r\n \r\n \r\n
- \r\n \r\n \r\n Customer\r\n \r\n \r\n \r\n
- \r\n \r\n \r\n Partner\r\n \r\n \r\n \r\n
- \r\n \r\n \r\n Suplier\r\n \r\n \r\n \r\n
- \r\n \r\n \r\n Member\r\n \r\n \r\n \r\n
- \r\n \r\n \r\n Staff\r\n \r\n \r\n \r\n \r\n
- \r\n \r\n \r\n Add new\r\n \r\n \r\n
- \r\n
- \r\n Add new:\r\n \r\n
- \r\n \r\n \r\n Order\r\n \r\n \r\n
- \r\n \r\n \r\n Event\r\n \r\n \r\n
- \r\n \r\n \r\n Report\r\n \r\n \r\n
- \r\n \r\n \r\n Post\r\n \r\n \r\n
- \r\n \r\n \r\n File\r\n \r\n \r\n
- \r\n
- \r\n Add New:\r\n \r\n \r\n \r\n
- \r\n \r\n \r\n Order\r\n \r\n \r\n
- \r\n \r\n \r\n Members\r\n \r\n 3\r\n \r\n \r\n \r\n
- \r\n \r\n \r\n Nspection\r\n \r\n \r\n
- \r\n \r\n \r\n Record\r\n \r\n 5\r\n \r\n \r\n \r\n \r\n
- \r\n More options\r\n Learn more\r\n \r\n
- \r\n
- \r\n \r\n \r\n New Group\r\n \r\n \r\n
- \r\n \r\n \r\n Contacts\r\n \r\n \r\n
- \r\n \r\n \r\n Groups\r\n \r\n new\r\n \r\n \r\n \r\n
- \r\n \r\n \r\n Calls\r\n \r\n \r\n
- \r\n \r\n \r\n Settings\r\n \r\n \r\n\r\n \r\n\r\n
- \r\n \r\n \r\n Help\r\n \r\n \r\n
- \r\n \r\n \r\n Privacy\r\n \r\n 5\r\n \r\n \r\n \r\n
\r\n {/* begin::Head */}\r\n \r\n {/* {formik.status ? (\r\n
\r\n );\r\n}\r\n\r\nexport default injectIntl(connect(null, { ...auth.actions, ...alert.actions })(Login));\r\n","import React, { useState } from \"react\";\r\nimport { useFormik } from \"formik\";\r\nimport { connect } from \"react-redux\";\r\nimport * as Yup from \"yup\";\r\nimport { Link } from \"react-router-dom\";\r\nimport { FormattedMessage, injectIntl } from \"react-intl\";\r\nimport * as auth from \"../_redux/authRedux\";\r\nimport InputLabel from '@material-ui/core/InputLabel';\r\nimport { FilePond } from \"react-filepond\";\r\nimport { useHistory } from \"react-router-dom\";\r\nimport { register } from \"../_redux/authCrud\";\r\nimport { getErrorField, convertJsonToFormData } from \"../../../../helpers/helper\";\r\nimport * as alert from \"../../../../redux/alertSnackBarRedux\";\r\n\r\nconst initialValues = {\r\n id: 0,\r\n firstName: \"\",\r\n lastName: \"\",\r\n phoneNumber: \"\",\r\n roleId: 0,\r\n clientId: null,\r\n username: \"\",\r\n password: \"\",\r\n logoPath: '',\r\n businessName: '',\r\n confirmPassword: '',\r\n contactFirstName: '',\r\n contactLastName: '',\r\n contactEmail: '',\r\n contactPhone: '',\r\n companyAddress: '',\r\n isDeleted: false,\r\n noOfProject: 1,\r\n removeWaterMark: false,\r\n removeCobrandedReport: true,\r\n clientTierId: 0,\r\n logoFile: '',\r\n};\r\n\r\nfunction Registration(props) {\r\n const { intl, showAlert } = props;\r\n const history = useHistory();\r\n const [loading, setLoading] = useState(false);\r\n const [logo, setLogo] = useState([]);\r\n const RegistrationSchema = Yup.object().shape({\r\n firstName: Yup.string()\r\n .min(3, \"Minimum 3 symbols\")\r\n .max(50, \"Maximum 50 symbols\")\r\n .required(\r\n intl.formatMessage({\r\n id: \"AUTH.VALIDATION.REQUIRED_FIELD\",\r\n })\r\n ),\r\n lastName: Yup.string()\r\n .min(3, \"Minimum 3 symbols\")\r\n .max(50, \"Maximum 50 symbols\")\r\n .required(\r\n intl.formatMessage({\r\n id: \"AUTH.VALIDATION.REQUIRED_FIELD\",\r\n })\r\n ),\r\n phoneNumber: Yup.string()\r\n .min(10, \"Minimum 10 symbols\")\r\n .max(50, \"Maximum 50 symbols\")\r\n .required(\r\n intl.formatMessage({\r\n id: \"AUTH.VALIDATION.REQUIRED_FIELD\",\r\n })\r\n ),\r\n contactEmail: Yup.string()\r\n .email(\"Wrong email format\")\r\n .min(3, \"Minimum 3 symbols\")\r\n .max(50, \"Maximum 50 symbols\")\r\n .required(\r\n intl.formatMessage({\r\n id: \"AUTH.VALIDATION.REQUIRED_FIELD\",\r\n })\r\n ),\r\n logoPath: Yup.string(),\r\n logoFile: Yup.string()\r\n .nullable(),\r\n username: Yup.string()\r\n .email(\"Wrong email format\")\r\n .min(3, \"Minimum 3 symbols\")\r\n .max(50, \"Maximum 50 symbols\")\r\n .required(\r\n intl.formatMessage({\r\n id: \"AUTH.VALIDATION.REQUIRED_FIELD\",\r\n })\r\n ),\r\n password: Yup.string()\r\n .min(3, \"Minimum 3 symbols\")\r\n .max(50, \"Maximum 50 symbols\")\r\n .required(\r\n intl.formatMessage({\r\n id: \"AUTH.VALIDATION.REQUIRED_FIELD\",\r\n })\r\n ),\r\n confirmPassword: Yup.string()\r\n .oneOf([Yup.ref('password'), null], 'Passwords must match')\r\n .required(\r\n intl.formatMessage({\r\n id: \"AUTH.VALIDATION.REQUIRED_FIELD\",\r\n })\r\n ),\r\n businessName: Yup.string()\r\n .max(50, \"Maximum 50 symbols\")\r\n .required(\r\n intl.formatMessage({\r\n id: \"AUTH.VALIDATION.REQUIRED_FIELD\",\r\n })\r\n ),\r\n contactFirstName: Yup.string()\r\n .max(50, \"Maximum 50 symbols\")\r\n .required(\r\n intl.formatMessage({\r\n id: \"AUTH.VALIDATION.REQUIRED_FIELD\",\r\n })\r\n ),\r\n contactLastName: Yup.string()\r\n .max(50, \"Maximum 50 symbols\")\r\n .required(\r\n intl.formatMessage({\r\n id: \"AUTH.VALIDATION.REQUIRED_FIELD\",\r\n })\r\n ),\r\n contactPhone: Yup.string()\r\n .min(10, \"Minimum 10 symbols\")\r\n .max(50, \"Maximum 50 symbols\")\r\n .required(\r\n intl.formatMessage({\r\n id: \"AUTH.VALIDATION.REQUIRED_FIELD\",\r\n })\r\n ),\r\n companyAddress: Yup.string()\r\n .max(50, \"Maximum 50 symbols\")\r\n .required(\r\n intl.formatMessage({\r\n id: \"AUTH.VALIDATION.REQUIRED_FIELD\",\r\n })\r\n )\r\n });\r\n\r\n const enableLoading = () => {\r\n setLoading(true);\r\n };\r\n\r\n const disableLoading = () => {\r\n setLoading(false);\r\n };\r\n\r\n const getInputClasses = (fieldname) => {\r\n if (formik.touched[fieldname] && formik.errors[fieldname]) {\r\n return \"is-invalid\";\r\n }\r\n\r\n if (formik.touched[fieldname] && !formik.errors[fieldname]) {\r\n return \"is-valid\";\r\n }\r\n\r\n return \"\";\r\n };\r\n\r\n const formik = useFormik({\r\n initialValues,\r\n validationSchema: RegistrationSchema,\r\n onSubmit: (values, { setStatus, setSubmitting }) => {\r\n setSubmitting(true);\r\n enableLoading();\r\n register(convertJsonToFormData({\r\n ...values,\r\n logoFile: logo.length > 0 ? logo[0].file : null\r\n }))\r\n .then((res) => {\r\n disableLoading();\r\n showAlert({ message: res.message, variant: 'success' });\r\n setSubmitting(false);\r\n history.push('/login');\r\n })\r\n .catch((ex) => {\r\n setSubmitting(false);\r\n showAlert({ message: ex.message, variant: 'error' });\r\n setStatus(\r\n intl.formatMessage({\r\n id: \"AUTH.VALIDATION.INVALID_LOGIN\",\r\n })\r\n );\r\n disableLoading();\r\n });\r\n },\r\n });\r\n\r\n return (\r\n \r\n \r\n
\r\n
\r\n {/* end::Head */}\r\n\r\n {/*begin::Form*/}\r\n \r\n
\r\n \r\n Please enter your username and password to login\r\n
\r\n\r\n
\r\n ) : (\r\n {formik.status}
\r\n \r\n
\r\n )} */}\r\n\r\n \r\n Use account admin@demo.com and password{\" \"}\r\n demo to continue.\r\n
\r\n \r\n
\r\n \r\n
\r\n ) : null}\r\n {formik.errors.username}
\r\n \r\n
\r\n \r\n
\r\n ) : null}\r\n {formik.errors.password}
\r\n \r\n \r\n \r\n \r\n Sign In\r\n {loading && }\r\n \r\n
\r\n \r\n {/*end::Form*/}\r\n \r\n \r\n {/* begin: Alert */}\r\n {formik.status && (\r\n
\r\n );\r\n}\r\n\r\nexport default injectIntl(connect(null, { ...auth.actions, ...alert.actions })(Registration));\r\n","import React, { useState } from \"react\";\r\nimport { useFormik } from \"formik\";\r\nimport { connect } from \"react-redux\";\r\nimport { Link, Redirect } from \"react-router-dom\";\r\nimport * as Yup from \"yup\";\r\nimport { injectIntl } from \"react-intl\";\r\nimport * as auth from \"../_redux/authRedux\";\r\nimport { requestPassword } from \"../_redux/authCrud\";\r\n\r\nconst initialValues = {\r\n email: \"\",\r\n};\r\n\r\nfunction ForgotPassword(props) {\r\n const { intl } = props;\r\n const [isRequested, setIsRequested] = useState(false);\r\n const ForgotPasswordSchema = Yup.object().shape({\r\n email: Yup.string()\r\n .email(\"Wrong email format\")\r\n .min(3, \"Minimum 3 symbols\")\r\n .max(50, \"Maximum 50 symbols\")\r\n .required(\r\n intl.formatMessage({\r\n id: \"AUTH.VALIDATION.REQUIRED_FIELD\",\r\n })\r\n ),\r\n });\r\n\r\n const getInputClasses = (fieldname) => {\r\n if (formik.touched[fieldname] && formik.errors[fieldname]) {\r\n return \"is-invalid\";\r\n }\r\n\r\n if (formik.touched[fieldname] && !formik.errors[fieldname]) {\r\n return \"is-valid\";\r\n }\r\n\r\n return \"\";\r\n };\r\n\r\n const formik = useFormik({\r\n initialValues,\r\n validationSchema: ForgotPasswordSchema,\r\n onSubmit: (values, { setStatus, setSubmitting }) => {\r\n requestPassword(values.email)\r\n .then(() => setIsRequested(true))\r\n .catch(() => {\r\n setIsRequested(false);\r\n setSubmitting(false);\r\n setStatus(\r\n intl.formatMessage(\r\n { id: \"AUTH.VALIDATION.NOT_FOUND\" },\r\n { name: values.email }\r\n )\r\n );\r\n });\r\n },\r\n });\r\n\r\n return (\r\n <>\r\n {isRequested && \r\n \r\n
\r\n
\r\n\r\n \r\n
\r\n \r\n Enter your details to create your account\r\n
\r\n\r\n
\r\n )}\r\n {/* end: Alert */}\r\n {formik.status}
\r\n \r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n
\r\n User Information
\r\n\r\n
\r\n\r\n\r\n \r\n
\r\n\r\n \r\n First Name \r\n\r\n
\r\n \r\n
\r\n ) : null}\r\n {formik.errors.firstName}
\r\n \r\n
\r\n\r\n\r\n \r\n Last Name \r\n
\r\n \r\n
\r\n ) : null}\r\n {formik.errors.lastName}
\r\n \r\n
\r\n\r\n \r\n Phone Number \r\n
\r\n \r\n
\r\n ) : null}\r\n {formik.errors.phoneNumber}
\r\n \r\n
\r\n\r\n \r\n Email \r\n
\r\n \r\n
\r\n ) : null}\r\n {formik.errors.username}
\r\n \r\n
\r\n\r\n \r\n Password \r\n
\r\n \r\n
\r\n ) : null}\r\n {formik.errors.password}
\r\n \r\n
\r\n \r\n Confirm Password \r\n
\r\n \r\n
\r\n ) : null}\r\n \r\n {formik.errors.confirmPassword}\r\n
\r\n \r\n
\r\n\r\n \r\n
\r\n Client Information
\r\n\r\n
\r\n \r\n
\r\n\r\n \r\n Business Name \r\n
\r\n \r\n
\r\n ) : null}\r\n {formik.errors.businessName}
\r\n \r\n
\r\n\r\n \r\n Contact First Name \r\n
\r\n \r\n
\r\n ) : null}\r\n {formik.errors.contactFirstName}
\r\n \r\n
\r\n\r\n\r\n \r\n Contact Last Name \r\n\r\n
\r\n \r\n
\r\n ) : null}\r\n {formik.errors.contactLastName}
\r\n \r\n
\r\n\r\n \r\n Contact Phone \r\n
\r\n \r\n
\r\n \r\n
\r\n ) : null}\r\n {formik.errors.contactPhone}
\r\n \r\n
\r\n\r\n \r\n Contact Email \r\n\r\n
\r\n \r\n
\r\n ) : null}\r\n {formik.errors.contactEmail}
\r\n \r\n
\r\n\r\n \r\n Company Address \r\n\r\n
\r\n \r\n
\r\n ) : null}\r\n {formik.errors.companyAddress}
\r\n \r\n
\r\n \r\n Company Logo \r\n
\r\n \r\n \r\n Submit\r\n {loading && }\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 {formik.status && (\r\n
\r\n )}\r\n \r\n );\r\n}\r\n\r\nexport default injectIntl(connect(null, auth.actions)(ForgotPassword));\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport { Link, Switch, Redirect } from \"react-router-dom\";\r\nimport { toAbsoluteUrl } from \"../../../../_metronic/_helpers\";\r\nimport { ContentRoute } from \"../../../../_metronic/layout\";\r\nimport Login from \"./Login\";\r\nimport Registration from \"./Registration\";\r\nimport ForgotPassword from \"./ForgotPassword\";\r\nimport \"../../../../_metronic/_assets/sass/pages/login/classic/login-1.scss\";\r\n\r\nexport function AuthPage() {\r\n return (\r\n <>\r\n \r\n
\r\n Forgot Password?
\r\n\r\n Enter your email to reset your password\r\n
\r\n \r\n
\r\n )}\r\n \r\n {formik.status}\r\n
\r\n \r\n
\r\n \r\n
\r\n ) : null}\r\n {formik.errors.email}
\r\n \r\n \r\n Submit\r\n \r\n \r\n \r\n Cancel\r\n \r\n \r\n
\r\n \r\n \r\n {/*begin::Login*/}\r\n \r\n {/*begin::Aside*/}\r\n \r\n {/*begin: Aside Container*/}\r\n
\r\n {/*begin::Aside*/}\r\n\r\n {/*begin::Content*/}\r\n \r\n {/* start:: Aside header */}\r\n \r\n
\r\n {/*end: Aside Container*/}\r\n \r\n
\r\n {/* end:: Aside content */}\r\n\r\n {/* start:: Aside footer for desktop */}\r\n \r\n NSPECT Web Portal\r\n
\r\n\r\n
\r\n \r\n NSPECT is a virtual inspection tool utilizing 3D models to record inspections, communicate actions and document compliance.\r\n
\r\n\r\n {/*
\r\n {/* end:: Aside footer for desktop */}\r\n \r\n © 2021 Matterport Web Portal\r\n
*/}\r\n {/* \r\n \r\n Privacy\r\n \r\n \r\n Legal\r\n \r\n \r\n Contact\r\n \r\n
*/}\r\n \r\n {/*begin::Content header*/}\r\n {/*
\r\n {/*end::Content*/}\r\n \r\n {/*end::Login*/}\r\n \r\n \r\n );\r\n}\r\n","import React, {Component} from \"react\";\r\nimport {connect} from \"react-redux\";\r\nimport {Redirect} from \"react-router-dom\";\r\nimport {LayoutSplashScreen} from \"../../../../_metronic/layout\";\r\nimport * as auth from \"../_redux/authRedux\";\r\n\r\nclass Logout extends Component {\r\n componentDidMount() {\r\n this.props.logout();\r\n }\r\n\r\n render() {\r\n const { hasAuthToken } = this.props;\r\n return hasAuthToken ? \r\n \r\n Don't have an account yet?\r\n \r\n \r\n Sign Up!\r\n \r\n
*/}\r\n {/*end::Content header*/}\r\n\r\n {/* begin::Content body */}\r\n \r\n \r\n \r\n
\r\n {/*end::Content body*/}\r\n\r\n {/* begin::Mobile footer */}\r\n \r\n {/*
\r\n {/* end::Mobile footer */}\r\n \r\n © 2021 Matterport Web Portal\r\n
*/}\r\n {/* \r\n \r\n Privacy\r\n \r\n \r\n Legal\r\n \r\n \r\n Contact\r\n \r\n
*/}\r\n \r\n {/* Header */}\r\n
\r\n \r\n );\r\n}\r\n\r\nfunction getChartOptions(layoutProps) {\r\n const strokeColor = \"#D13647\";\r\n\r\n const options = {\r\n series: [\r\n {\r\n name: \"Net Profit\",\r\n data: [30, 45, 32, 70, 40, 40, 40]\r\n }\r\n ],\r\n chart: {\r\n type: \"area\",\r\n height: 200,\r\n toolbar: {\r\n show: false\r\n },\r\n zoom: {\r\n enabled: false\r\n },\r\n sparkline: {\r\n enabled: true\r\n },\r\n dropShadow: {\r\n enabled: true,\r\n enabledOnSeries: undefined,\r\n top: 5,\r\n left: 0,\r\n blur: 3,\r\n color: strokeColor,\r\n opacity: 0.5\r\n }\r\n },\r\n plotOptions: {},\r\n legend: {\r\n show: false\r\n },\r\n dataLabels: {\r\n enabled: false\r\n },\r\n fill: {\r\n type: \"solid\",\r\n opacity: 0\r\n },\r\n stroke: {\r\n curve: \"smooth\",\r\n show: true,\r\n width: 3,\r\n colors: [strokeColor]\r\n },\r\n xaxis: {\r\n categories: [\"Feb\", \"Mar\", \"Apr\", \"May\", \"Jun\", \"Jul\", \"Aug\"],\r\n axisBorder: {\r\n show: false\r\n },\r\n axisTicks: {\r\n show: false\r\n },\r\n labels: {\r\n show: false,\r\n style: {\r\n colors: layoutProps.colorsGrayGray500,\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily\r\n }\r\n },\r\n crosshairs: {\r\n show: false,\r\n position: \"front\",\r\n stroke: {\r\n color: layoutProps.colorsGrayGray300,\r\n width: 1,\r\n dashArray: 3\r\n }\r\n }\r\n },\r\n yaxis: {\r\n min: 0,\r\n max: 80,\r\n labels: {\r\n show: false,\r\n style: {\r\n colors: layoutProps.colorsGrayGray500,\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily\r\n }\r\n }\r\n },\r\n states: {\r\n normal: {\r\n filter: {\r\n type: \"none\",\r\n value: 0\r\n }\r\n },\r\n hover: {\r\n filter: {\r\n type: \"none\",\r\n value: 0\r\n }\r\n },\r\n active: {\r\n allowMultipleDataPointsSelection: false,\r\n filter: {\r\n type: \"none\",\r\n value: 0\r\n }\r\n }\r\n },\r\n tooltip: {\r\n style: {\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily\r\n },\r\n y: {\r\n formatter: function(val) {\r\n return \"$\" + val + \" thousands\";\r\n }\r\n },\r\n marker: {\r\n show: false\r\n }\r\n },\r\n colors: [\"transparent\"],\r\n markers: {\r\n colors: layoutProps.colorsThemeBaseDanger,\r\n strokeColor: [strokeColor],\r\n strokeWidth: 3\r\n }\r\n };\r\n return options;\r\n}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React, { useEffect, useMemo } from \"react\";\r\nimport { Dropdown } from \"react-bootstrap\";\r\nimport objectPath from \"object-path\";\r\nimport ApexCharts from \"apexcharts\";\r\nimport { DropdownCustomToggler, DropdownMenu2 } from \"../../dropdowns\";\r\nimport { useHtmlClassService } from \"../../../layout\";\r\n\r\nexport function MixedWidget6({ className, chartColor = \"danger\" }) {\r\n const uiService = useHtmlClassService();\r\n const layoutProps = useMemo(() => {\r\n return {\r\n colorsGrayGray500: objectPath.get(\r\n uiService.config,\r\n \"js.colors.gray.gray500\"\r\n ),\r\n colorsGrayGray200: objectPath.get(\r\n uiService.config,\r\n \"js.colors.gray.gray200\"\r\n ),\r\n colorsThemeBaseColor: objectPath.get(\r\n uiService.config,\r\n `js.colors.theme.base.${chartColor}`\r\n ),\r\n colorsThemeLightColor: objectPath.get(\r\n uiService.config,\r\n `js.colors.theme.light.${chartColor}`\r\n ),\r\n fontFamily: objectPath.get(uiService.config, \"js.fontFamily\"),\r\n };\r\n }, [uiService, chartColor]);\r\n\r\n useEffect(() => {\r\n const element = document.getElementById(\"kt_mixed_widget_6_chart\");\r\n\r\n if (!element) {\r\n return;\r\n }\r\n\r\n const options = getChartOption(layoutProps);\r\n const chart = new ApexCharts(element, options);\r\n chart.render();\r\n return function cleanUp() {\r\n chart.destroy();\r\n };\r\n }, [layoutProps]);\r\n\r\n return (\r\n <>\r\n {/* begin::Tiles Widget 1 */}\r\n \r\n
\r\n {/* Body */}\r\n Sales Stat
\r\n\r\n \r\n \r\n Export\r\n \r\n \r\n \r\n \r\n
\r\n \r\n {/* Chart */}\r\n
\r\n\r\n {/* Stat */}\r\n \r\n
\r\n\r\n {/* Resize */}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n Weekly Sales\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n New Users\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n Item Orders\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n Bug Reports\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n {/* end::Header */}\r\n\r\n {/* begin::Body */}\r\n \r\n Sales Progress\r\n
\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n {/* begin::Chart */}\r\n
\r\n {/* end::Body */}\r\n \r\n {/* end::Tiles Widget 1 */}\r\n \r\n );\r\n}\r\n\r\nfunction getChartOption(layoutProps) {\r\n const options = {\r\n series: [\r\n {\r\n name: \"Net Profit\",\r\n data: [35, 65, 75, 55, 45, 60, 55],\r\n },\r\n {\r\n name: \"Revenue\",\r\n data: [40, 70, 80, 60, 50, 65, 60],\r\n },\r\n ],\r\n chart: {\r\n type: \"bar\",\r\n height: \"200px\",\r\n toolbar: {\r\n show: false,\r\n },\r\n sparkline: {\r\n enabled: true,\r\n },\r\n },\r\n plotOptions: {\r\n bar: {\r\n horizontal: false,\r\n columnWidth: [\"30%\"],\r\n endingShape: \"rounded\",\r\n },\r\n },\r\n legend: {\r\n show: false,\r\n },\r\n dataLabels: {\r\n enabled: false,\r\n },\r\n stroke: {\r\n show: true,\r\n width: 1,\r\n colors: [\"transparent\"],\r\n },\r\n xaxis: {\r\n categories: [\"Feb\", \"Mar\", \"Apr\", \"May\", \"Jun\", \"Jul\"],\r\n axisBorder: {\r\n show: false,\r\n },\r\n axisTicks: {\r\n show: false,\r\n },\r\n labels: {\r\n style: {\r\n colors: layoutProps.colorsGrayGray500,\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily,\r\n },\r\n },\r\n },\r\n yaxis: {\r\n min: 0,\r\n max: 100,\r\n labels: {\r\n style: {\r\n colors: layoutProps.colorsGrayGray500,\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily,\r\n },\r\n },\r\n },\r\n fill: {\r\n type: [\"solid\", \"solid\"],\r\n opacity: [0.25, 1],\r\n },\r\n states: {\r\n normal: {\r\n filter: {\r\n type: \"none\",\r\n value: 0,\r\n },\r\n },\r\n hover: {\r\n filter: {\r\n type: \"none\",\r\n value: 0,\r\n },\r\n },\r\n active: {\r\n allowMultipleDataPointsSelection: false,\r\n filter: {\r\n type: \"none\",\r\n value: 0,\r\n },\r\n },\r\n },\r\n tooltip: {\r\n style: {\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily,\r\n },\r\n y: {\r\n formatter: function(val) {\r\n return \"$\" + val + \" thousands\";\r\n },\r\n },\r\n marker: {\r\n show: false,\r\n },\r\n },\r\n colors: [\"#ffffff\", \"#ffffff\"],\r\n grid: {\r\n borderColor: layoutProps.colorsGrayGray200,\r\n strokeDashArray: 4,\r\n yaxis: {\r\n lines: {\r\n show: true,\r\n },\r\n },\r\n padding: {\r\n left: 20,\r\n right: 20,\r\n },\r\n },\r\n };\r\n return options;\r\n}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport SVG from \"react-inlinesvg\";\r\nimport { toAbsoluteUrl } from \"../../../_helpers\";\r\n\r\nexport function MixedWidget10({ className }) {\r\n return (\r\n \r\n {/* begin::Row */}\r\n
\r\n {/* end::Stats */}\r\n \r\n
\r\n {/* end::Row */}\r\n {/* begin::Row */}\r\n \r\n
\r\n \r\n Average Sale\r\n
\r\n $650
\r\n \r\n
\r\n \r\n Commission\r\n
\r\n $233,600
\r\n \r\n
\r\n {/* end::Row */}\r\n \r\n
\r\n \r\n Annual Taxes\r\n
\r\n $29,004
\r\n \r\n
\r\n \r\n Annual Income\r\n
\r\n $1,480,00
\r\n \r\n {/* begin::Body */}\r\n
\r\n );\r\n}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport SVG from \"react-inlinesvg\";\r\nimport { toAbsoluteUrl } from \"../../../_helpers\";\r\n\r\nexport function MixedWidget11({ className }) {\r\n return (\r\n \r\n
\r\n {/* end::Body */}\r\n \r\n {/* begin::Info */}\r\n \r\n PitStop - Multiple Email\r\n
\r\n Generator\r\n \r\n {/* end::Link */}\r\n\r\n {/* begin::Desc */}\r\n
\r\n {/* begin::Team */}\r\n \r\n \r\n 7 Hours Ago\r\n \r\n
\r\n {/* end::Info */}\r\n\r\n {/* begin::Link */}\r\n \r\n \r\n {\" \"}\r\n \r\n
\r\n \r\n Generator\r\n \r\n {/* end::Link */}\r\n\r\n {/* begin::Desc */}\r\n
\r\n Pitstop creates quick email campaigns.\r\n
\r\n We help to strengthen your brand\r\n
\r\n for your every purpose.\r\n
\r\n {/* begin::Pic */}\r\n \r\n
\r\n {/* end::Team */}\r\n \r\n \r\n
\r\n \r\n {/* end::Pic */}\r\n\r\n {/* begin::Pic */}\r\n \r\n \r\n \r\n
\r\n \r\n {/* end::Pic */}\r\n\r\n {/* begin::Pic */}\r\n \r\n \r\n \r\n
\r\n \r\n {/* end::Pic */}\r\n \r\n {/* begin::Body */}\r\n
\r\n );\r\n}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport SVG from \"react-inlinesvg\";\r\nimport { toAbsoluteUrl } from \"../../../_helpers\";\r\n\r\nexport function MixedWidget12({ className }) {\r\n return (\r\n \r\n
\r\n {/* end::Body */}\r\n \r\n {/* begin::Info */}\r\n \r\n Craft - ReactJS Admin\r\n
\r\n Theme\r\n \r\n {/* end::Link */}\r\n\r\n {/* begin::Desc */}\r\n
\r\n {/* begin::Team */}\r\n \r\n \r\n 2 Hours Ago\r\n \r\n
\r\n {/* end::Info */}\r\n\r\n {/* begin::Link */}\r\n \r\n \r\n {\" \"}\r\n \r\n
\r\n \r\n Theme\r\n \r\n {/* end::Link */}\r\n\r\n {/* begin::Desc */}\r\n
\r\n Craft uses the latest and greatest frameworks\r\n
\r\n with ReactJS for complete modernization and\r\n
\r\n future proofing your business operations\r\n
\r\n and sales opportunities\r\n
\r\n {/* begin::Pic */}\r\n \r\n
\r\n {/* end::Team */}\r\n \r\n \r\n
\r\n \r\n {/* end::Pic */}\r\n\r\n {/* begin::Pic */}\r\n \r\n \r\n \r\n
\r\n \r\n {/* end::Pic */}\r\n\r\n {/* begin::Pic */}\r\n \r\n \r\n \r\n
\r\n \r\n {/* end::Pic */}\r\n\r\n {/* begin::Pic */}\r\n \r\n \r\n \r\n
\r\n \r\n {/* end::Pic */}\r\n \r\n {/* begin::Body */}\r\n
\r\n );\r\n}\r\n","/* eslint-disable react/jsx-no-undef */\r\n/* eslint-disable no-script-url,jsx-a11y/anchor-is-valid */\r\nimport React, {useMemo, useEffect} from \"react\";\r\nimport objectPath from \"object-path\";\r\nimport ApexCharts from \"apexcharts\";\r\nimport {Dropdown} from \"react-bootstrap\";\r\nimport {useHtmlClassService} from \"../../../layout\";\r\nimport {DropdownMenu4, DropdownCustomToggler} from \"../../dropdowns\";\r\nimport {KTUtil} from \"../../../_assets/js/components/util\";\r\n\r\nexport function MixedWidget14({ className }) {\r\n const uiService = useHtmlClassService();\r\n\r\n const layoutProps = useMemo(() => {\r\n return {\r\n colorsGrayGray100: objectPath.get(uiService.config, \"js.colors.gray.gray100\"),\r\n colorsGrayGray700: objectPath.get(uiService.config, \"js.colors.gray.gray700\"),\r\n colorsThemeBaseSuccess: objectPath.get(\r\n uiService.config,\r\n \"js.colors.theme.base.success\"\r\n ),\r\n colorsThemeLightSuccess: objectPath.get(\r\n uiService.config,\r\n \"js.colors.theme.light.success\"\r\n ),\r\n fontFamily: objectPath.get(uiService.config, \"js.fontFamily\")\r\n };\r\n }, [uiService]);\r\n\r\n useEffect(() => {\r\n const element = document.getElementById(\"kt_mixed_widget_14_chart\");\r\n if (!element) {\r\n return;\r\n }\r\n\r\n const height = parseInt(KTUtil.css(element, 'height'));\r\n const options = getChartOptions(layoutProps, height);\r\n\r\n const chart = new ApexCharts(element, options);\r\n chart.render();\r\n return function cleanUp() {\r\n chart.destroy();\r\n };\r\n }, [layoutProps]);\r\n\r\n return (\r\n \r\n
\r\n {/* end::Body */}\r\n \r\n {/* begin::Info */}\r\n \r\n KT.com - High Quality\r\n
\r\n Templates\r\n \r\n {/* end::Link */}\r\n\r\n {/* begin::Desc */}\r\n
\r\n {/* begin::Team */}\r\n \r\n \r\n 5 Weeks Ago\r\n \r\n
\r\n {/* end::Info */}\r\n\r\n {/* begin::Link */}\r\n \r\n \r\n {\" \"}\r\n \r\n
\r\n \r\n Templates\r\n \r\n {/* end::Link */}\r\n\r\n {/* begin::Desc */}\r\n
\r\n Easy to use, incredibly flexible and secure\r\n
\r\n with in-depth documentation that outlines\r\n
\r\n everything for you\r\n
\r\n {/* begin::Pic */}\r\n \r\n
\r\n {/* end::Team */}\r\n \r\n \r\n
\r\n \r\n {/* end::Pic */}\r\n\r\n {/* begin::Pic */}\r\n \r\n \r\n \r\n
\r\n \r\n {/* end::Pic */}\r\n\r\n {/* begin::Pic */}\r\n \r\n \r\n \r\n
\r\n \r\n {/* end::Pic */}\r\n \r\n {/* Header */}\r\n
\r\n );\r\n}\r\n\r\n\r\n\r\nfunction getChartOptions(layoutProps, height) {\r\n const options = {\r\n series: [74],\r\n chart: {\r\n height: height,\r\n type: 'radialBar',\r\n },\r\n plotOptions: {\r\n radialBar: {\r\n hollow: {\r\n margin: 0,\r\n size: \"65%\"\r\n },\r\n dataLabels: {\r\n showOn: \"always\",\r\n name: {\r\n show: false,\r\n fontWeight: \"700\",\r\n },\r\n value: {\r\n color: layoutProps.colorsGrayGray700,\r\n fontSize: \"30px\",\r\n fontWeight: \"700\",\r\n offsetY: 12,\r\n show: true\r\n },\r\n },\r\n track: {\r\n background: layoutProps.colorsThemeLightSuccess,\r\n strokeWidth: '100%'\r\n }\r\n }\r\n },\r\n colors: [layoutProps.colorsThemeBaseSuccess],\r\n stroke: {\r\n lineCap: \"round\",\r\n },\r\n labels: [\"Progress\"]\r\n };\r\n return options;\r\n}\r\n","/* eslint-disable no-script-url,jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport SVG from \"react-inlinesvg\";\r\nimport {Dropdown} from \"react-bootstrap\";\r\nimport {toAbsoluteUrl} from \"../../../_helpers\";\r\nimport {DropdownCustomToggler, DropdownMenu4} from \"../../dropdowns\";\r\n\r\nexport function ListsWidget1({ className }) {\r\n return (\r\n <>\r\n \r\n
\r\n {/* Body */}\r\n Action Needed
\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n Notes: Current sprint requires stakeholders
\r\n to approve newly amended policies\r\n
\r\n {/* Header */}\r\n
\r\n \r\n );\r\n}\r\n","/* eslint-disable no-script-url,jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport SVG from \"react-inlinesvg\";\r\nimport {Dropdown} from \"react-bootstrap\";\r\nimport {toAbsoluteUrl} from \"../../../_helpers\";\r\nimport {DropdownCustomToggler, DropdownMenu1, DropdownMenu2} from \"../../dropdowns\";\r\n\r\nexport function ListsWidget3({ className }) {\r\n return (\r\n <>\r\n \r\n
\r\n\r\n {/* Body */}\r\n \r\n Tasks Overview\r\n
\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n Nspection Briefing\r\n \r\n Nspection Manager\r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n Concept Design\r\n \r\n Art Director\r\n
\r\n \r\n
\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n Functional Logics\r\n \r\n Lead Developer\r\n
\r\n \r\n
\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n Development\r\n \r\n DevOps\r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n Testing\r\n \r\n QA Managers\r\n
\r\n \r\n {/* Head */}\r\n
\r\n \r\n );\r\n}\r\n\r\nconst ItemDropdown = ({item}) => {\r\n return (<>\r\n \r\n
\r\n {/* Body */}\r\n Authors
\r\n\r\n \r\n \r\n Create\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n Ricky Hunt\r\n \r\n PHP, SQLite, Artisan CLI\r\n
\r\n \r\n
\r\n\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n Anne Clarc\r\n \r\n PHP, SQLite, Artisan CLI\r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n Kristaps Zumman\r\n \r\n PHP, SQLite, Artisan CLI\r\n
\r\n \r\n
\r\n\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n Ricky Hunt\r\n \r\n PHP, SQLite, Artisan CLI\r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n Carles Puyol\r\n \r\n PHP, SQLite, Artisan CLI\r\n
\r\n \r\n {/* Head */}\r\n
\r\n \r\n );\r\n}\r\n\r\nconst ItemDropdown = ({item}) => {\r\n return (<>\r\n \r\n
\r\n {/* Body */}\r\n Todo
\r\n\r\n \r\n \r\n Create\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n\r\n \r\n\r\n
\r\n\r\n \r\n \r\n Create FireStone Logo\r\n \r\n Due in 2 Days\r\n
\r\n \r\n \r\n\r\n \r\n\r\n
\r\n\r\n \r\n \r\n Stakeholder Meeting\r\n \r\n Due in 3 Days\r\n
\r\n \r\n \r\n\r\n \r\n\r\n
\r\n\r\n \r\n \r\n Scoping & Estimations\r\n \r\n Due in 5 Days\r\n
\r\n \r\n \r\n\r\n \r\n\r\n
\r\n\r\n \r\n \r\n Sprint Showcase\r\n \r\n Due in 1 Day\r\n
\r\n \r\n \r\n\r\n \r\n
\r\n \r\n \r\n Nspection Retro\r\n \r\n \r\n Due in 12 Days\r\n \r\n
\r\n \r\n {/* Header */}\r\n
\r\n \r\n );\r\n}\r\n","/* eslint-disable no-script-url,jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport { Dropdown } from \"react-bootstrap\";\r\nimport { DropdownCustomToggler, DropdownMenu1 } from \"../../dropdowns\";\r\n\r\nexport function ListsWidget9({ className }) {\r\n return (\r\n <>\r\n \r\n
\r\n {/* Body */}\r\n Trends
\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n
\r\n\r\n \r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n Top Authors\r\n \r\n 5 day ago\r\n
\r\n \r\n A brief write up about the top Authors that fits within this\r\n section\r\n
\r\n\r\n
\r\n\r\n \r\n
\r\n\r\n \r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n Popular Authors\r\n \r\n 5 day ago\r\n
\r\n \r\n A brief write up about the Popular Authors that fits within this\r\n section\r\n
\r\n\r\n
\r\n \r\n
\r\n\r\n \r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n New Users\r\n \r\n 5 day ago\r\n
\r\n \r\n A brief write up about the New Users that fits within this section\r\n
\r\n\r\n {/* Header */}\r\n
\r\n \r\n );\r\n}\r\n","/* eslint-disable no-script-url,jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport { Dropdown } from \"react-bootstrap\";\r\nimport { DropdownCustomToggler, DropdownMenu3 } from \"../../dropdowns\";\r\n\r\nexport function ListsWidget10({ className }) {\r\n return (\r\n <>\r\n \r\n
\r\n {/* Body */}\r\n \r\n My Activity\r\n \r\n 890,344 Sales\r\n \r\n
\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n 08:42\r\n
\r\n\r\n \r\n \r\n
\r\n\r\n \r\n Outlines keep you honest. And keep structure\r\n
\r\n \r\n
\r\n\r\n \r\n 10:00\r\n
\r\n\r\n \r\n \r\n
\r\n\r\n \r\n \r\n AEOL meeting\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n 14:37\r\n
\r\n\r\n \r\n \r\n
\r\n\r\n \r\n Make deposit\r\n \r\n USD 700\r\n \r\n . to ESL\r\n
\r\n \r\n
\r\n\r\n \r\n 16:50\r\n
\r\n\r\n \r\n \r\n
\r\n\r\n \r\n Indulging in poorly driving and keep structure keep great\r\n
\r\n \r\n
\r\n\r\n \r\n 21:03\r\n
\r\n\r\n \r\n \r\n
\r\n\r\n \r\n New order placed\r\n \r\n #XF-2356\r\n \r\n .\r\n
\r\n \r\n
\r\n\r\n \r\n 23:07\r\n
\r\n\r\n \r\n \r\n
\r\n\r\n \r\n Outlines keep and you honest. Indulging in poorly driving\r\n
\r\n \r\n
\r\n\r\n \r\n 16:50\r\n
\r\n\r\n \r\n \r\n
\r\n\r\n \r\n Indulging in poorly driving and keep structure keep great\r\n
\r\n \r\n
\r\n \r\n 21:03\r\n
\r\n\r\n \r\n \r\n
\r\n\r\n \r\n New order placed\r\n \r\n #XF-2356\r\n \r\n .\r\n
\r\n \r\n {/* Header */}\r\n
\r\n \r\n );\r\n}\r\n","/* eslint-disable no-script-url,jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport SVG from \"react-inlinesvg\";\r\nimport { Dropdown } from \"react-bootstrap\";\r\nimport { DropdownCustomToggler, DropdownMenu4 } from \"../../dropdowns\";\r\nimport { toAbsoluteUrl } from \"../../../_helpers\";\r\n\r\nexport function ListsWidget11({ className }) {\r\n return (\r\n <>\r\n \r\n
\r\n\r\n {/* Body */}\r\n \r\n Notifications\r\n
\r\n\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n \r\n\r\n
\r\n \r\n
\r\n \r\n \r\n Daily Standup Meeting\r\n \r\n\r\n \r\n Due in 2 Days\r\n \r\n
\r\n\r\n \r\n Approved\r\n \r\n \r\n
\r\n {/* end::Item */}\r\n\r\n {/* begin::Item */}\r\n \r\n \r\n\r\n {/* begin::Section */}\r\n
\r\n {/* end::Content */}\r\n \r\n {/* begin::Info */}\r\n
\r\n {/* end::Section */}\r\n \r\n {/* begin::Title */}\r\n \r\n Group Town Hall Meet-up with showcase\r\n \r\n {/* end::Title */}\r\n\r\n {/* begin::Data */}\r\n \r\n Due in 2 Days\r\n \r\n {/* end::Data */}\r\n
\r\n {/* end::Info */}\r\n\r\n {/* begin::Label */}\r\n \r\n In Progress\r\n \r\n {/* end::Label */}\r\n \r\n {/* begin::Content */}\r\n
\r\n {/* end::Item */}\r\n\r\n {/* begin::Item */}\r\n \r\n {/* begin::Checkbox */}\r\n \r\n {/* end::Checkbox */}\r\n\r\n {/* begin::Section */}\r\n
\r\n {/* end::Content */}\r\n \r\n {/* begin::Info */}\r\n
\r\n {/* end::Section */}\r\n \r\n {/* begin::Title */}\r\n \r\n Next sprint planning and estimations\r\n \r\n {/* end::Title */}\r\n\r\n {/* begin::Data */}\r\n \r\n Due in 2 Days\r\n \r\n {/* end::Data */}\r\n
\r\n {/* end::Info */}\r\n\r\n {/* begin::Label */}\r\n \r\n Success\r\n \r\n {/* end::Label */}\r\n \r\n {/* begin::Content */}\r\n
\r\n {/* end: Item */}\r\n\r\n {/* begin: Item */}\r\n \r\n {/* begin::Checkbox */}\r\n \r\n {/* end::Checkbox */}\r\n\r\n {/* begin::Section */}\r\n
\r\n {/* end::Content */}\r\n \r\n {/* begin::Info */}\r\n
\r\n {/* end::Section */}\r\n \r\n {/* begin::Title */}\r\n \r\n Sprint delivery and project deployment\r\n \r\n {/* end::Title */}\r\n\r\n {/* begin::Data */}\r\n \r\n Due in 2 Days\r\n \r\n {/* end::Data */}\r\n
\r\n {/* end::Info */}\r\n\r\n {/* begin::Label */}\r\n \r\n Rejected\r\n \r\n {/* end::Label */}\r\n \r\n {/* begin::Content */}\r\n
\r\n {/* end: Item */}\r\n \r\n {/* begin::Checkbox */}\r\n \r\n {/* end::Checkbox */}\r\n\r\n {/* begin::Section */}\r\n
\r\n {/* end::Content */}\r\n \r\n {/* begin::Info */}\r\n
\r\n {/* end::Section */}\r\n \r\n {/* begin::Title */}\r\n \r\n Data analytics research showcase\r\n \r\n {/* end::Title */}\r\n\r\n {/* begin::Data */}\r\n \r\n Due in 2 Days\r\n \r\n {/* end::Data */}\r\n
\r\n {/* end::Info */}\r\n\r\n {/* begin::Label */}\r\n \r\n In Progress\r\n \r\n {/* end::Label */}\r\n \r\n {/* Header */}\r\n
\r\n \r\n );\r\n}\r\n","/* eslint-disable no-script-url,jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport { Dropdown } from \"react-bootstrap\";\r\nimport { DropdownCustomToggler, DropdownMenu1 } from \"../../dropdowns\";\r\nimport { toAbsoluteUrl } from \"../../../_helpers\";\r\n\r\nexport function ListsWidget14({ className }) {\r\n return (\r\n <>\r\n {/* begin::List Widget 14 */}\r\n \r\n
\r\n\r\n {/* Body */}\r\n Trends
\r\n\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n\r\n
\r\n\r\n \r\n \r\n Group lunch celebration\r\n \r\n Due in 2 Days\r\n
\r\n\r\n \r\n +28%\r\n \r\n \r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n Home navigation optimization\r\n \r\n Due in 2 Days\r\n
\r\n\r\n \r\n +50%\r\n \r\n \r\n \r\n \r\n \r\n\r\n
\r\n\r\n \r\n \r\n Rebrand strategy planning\r\n \r\n Due in 2 Days\r\n
\r\n\r\n \r\n -27%\r\n \r\n \r\n \r\n \r\n \r\n\r\n
\r\n \r\n \r\n Product goals strategy meet-up\r\n \r\n Due in 2 Days\r\n
\r\n\r\n \r\n +8%\r\n \r\n \r\n {/* begin::Header */}\r\n
\r\n {/* end: Item */}\r\n\r\n {/* begin::Item */}\r\n \r\n
\r\n {/* end::Header */}\r\n\r\n {/* begin::Body */}\r\n \r\n Market Leaders\r\n
\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n {/* begin::Item */}\r\n
\r\n {/* end::Item */}\r\n\r\n {/* begin: Item */}\r\n \r\n {/* begin::Symbol */}\r\n
\r\n {/* end::Symbol */}\r\n\r\n {/* begin::Title */}\r\n \r\n
\r\n \r\n \r\n Cup & Green\r\n \r\n \r\n Local, clean & environmental\r\n \r\n \r\n Created by:{\" \"}\r\n CoreAd\r\n \r\n
\r\n {/* end::Title */}\r\n\r\n {/* begin::Info */}\r\n \r\n
\r\n {/* end::Info */}\r\n \r\n \r\n 24,900\r\n \r\n \r\n votes\r\n \r\n
\r\n \r\n {/* begin::Symbol */}\r\n
\r\n {/* end::Symbol */}\r\n\r\n {/* begin::Title */}\r\n \r\n
\r\n \r\n \r\n Yellow Background\r\n \r\n \r\n Strong abstract concept\r\n \r\n \r\n Created by:{\" \"}\r\n \r\n KeenThemes\r\n \r\n \r\n
\r\n {/* end::Title */}\r\n\r\n {/* begin::Info */}\r\n \r\n
\r\n {/* end::Info */}\r\n \r\n \r\n 70,380\r\n \r\n \r\n votes\r\n \r\n
\r\n \r\n {/* begin::Symbol */}\r\n
\r\n {/* end::Symbol */}\r\n\r\n {/* begin::Title */}\r\n \r\n
\r\n \r\n \r\n Nike & Blue\r\n \r\n \r\n Footwear overalls\r\n \r\n \r\n Created by:{\" \"}\r\n \r\n Invision Inc.\r\n \r\n \r\n
\r\n {/* end::Title */}\r\n\r\n {/* begin::Info */}\r\n \r\n
\r\n {/* end::Info */}\r\n \r\n {/* end::Item */}\r\n\r\n {/* begin::Item */}\r\n \r\n \r\n 7,200\r\n \r\n \r\n votes\r\n \r\n
\r\n \r\n {/* begin::Symbol */}\r\n
\r\n {/* end::Symbol */}\r\n\r\n {/* begin::Title */}\r\n \r\n
\r\n \r\n \r\n Desserts platter\r\n \r\n \r\n Food trends & reviews\r\n \r\n \r\n Created by:{\" \"}\r\n \r\n Figma Studio\r\n \r\n \r\n
\r\n {/* end::Title */}\r\n\r\n {/* begin::Info */}\r\n \r\n
\r\n {/* end::Info */}\r\n \r\n {/* end::Item */}\r\n\r\n {/* begin::Item */}\r\n \r\n \r\n 36,450\r\n \r\n \r\n votes\r\n \r\n
\r\n \r\n {/* begin::Symbol */}\r\n
\r\n {/* end::Symbol */}\r\n\r\n {/* begin::Title */}\r\n \r\n
\r\n \r\n \r\n Cup & Green\r\n \r\n \r\n Local, clean & environmental\r\n \r\n \r\n Created by:{\" \"}\r\n CoreAd\r\n \r\n
\r\n {/* end::Title */}\r\n\r\n {/* begin::Info */}\r\n \r\n
\r\n {/* end::Info */}\r\n \r\n {/* end::Item */}\r\n \r\n {/* end::Body */}\r\n \r\n {/* end::List Widget 14 */}\r\n \r\n );\r\n}\r\n","/* eslint-disable no-script-url,jsx-a11y/anchor-is-valid */\r\nimport React, { useMemo, useEffect } from \"react\";\r\nimport objectPath from \"object-path\";\r\nimport ApexCharts from \"apexcharts\";\r\nimport SVG from \"react-inlinesvg\";\r\nimport { toAbsoluteUrl } from \"../../../_helpers\";\r\nimport { useHtmlClassService } from \"../../../layout\";\r\n\r\nexport function StatsWidget11({ className, symbolShape, baseColor }) {\r\n const uiService = useHtmlClassService();\r\n const layoutProps = useMemo(() => {\r\n return {\r\n colorsGrayGray500: objectPath.get(\r\n uiService.config,\r\n \"js.colors.gray.gray500\"\r\n ),\r\n colorsGrayGray200: objectPath.get(\r\n uiService.config,\r\n \"js.colors.gray.gray200\"\r\n ),\r\n colorsGrayGray300: objectPath.get(\r\n uiService.config,\r\n \"js.colors.gray.gray300\"\r\n ),\r\n colorsThemeBaseSuccess: objectPath.get(\r\n uiService.config,\r\n `js.colors.theme.base.${baseColor}`\r\n ),\r\n colorsThemeLightSuccess: objectPath.get(\r\n uiService.config,\r\n `js.colors.theme.light.${baseColor}`\r\n ),\r\n fontFamily: objectPath.get(uiService.config, \"js.fontFamily\"),\r\n };\r\n }, [uiService, baseColor]);\r\n\r\n useEffect(() => {\r\n const element = document.getElementById(\"kt_stats_widget_11_chart\");\r\n\r\n if (!element) {\r\n return;\r\n }\r\n\r\n const options = getChartOption(layoutProps);\r\n const chart = new ApexCharts(element, options);\r\n chart.render();\r\n return function cleanUp() {\r\n chart.destroy();\r\n };\r\n }, [layoutProps]);\r\n\r\n return (\r\n \r\n \r\n 23,900\r\n \r\n \r\n votes\r\n \r\n
\r\n \r\n
\r\n \r\n );\r\n}\r\n\r\nfunction getChartOption(layoutProps) {\r\n const options = {\r\n series: [\r\n {\r\n name: \"Net Profit\",\r\n data: [40, 40, 30, 30, 35, 35, 50],\r\n },\r\n ],\r\n chart: {\r\n type: \"area\",\r\n height: 150,\r\n toolbar: {\r\n show: false,\r\n },\r\n zoom: {\r\n enabled: false,\r\n },\r\n sparkline: {\r\n enabled: true,\r\n },\r\n },\r\n plotOptions: {},\r\n legend: {\r\n show: false,\r\n },\r\n dataLabels: {\r\n enabled: false,\r\n },\r\n fill: {\r\n type: \"solid\",\r\n opacity: 1,\r\n },\r\n stroke: {\r\n curve: \"smooth\",\r\n show: true,\r\n width: 3,\r\n colors: [layoutProps.colorsThemeBaseSuccess],\r\n },\r\n xaxis: {\r\n categories: [\"Feb\", \"Mar\", \"Apr\", \"May\", \"Jun\", \"Aug\", \"Sep\"],\r\n axisBorder: {\r\n show: false,\r\n },\r\n axisTicks: {\r\n show: false,\r\n },\r\n labels: {\r\n show: false,\r\n style: {\r\n colors: layoutProps.colorsGrayGray500,\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily,\r\n },\r\n },\r\n crosshairs: {\r\n show: false,\r\n position: \"front\",\r\n stroke: {\r\n color: layoutProps.colorsGrayGray300,\r\n width: 1,\r\n dashArray: 3,\r\n },\r\n },\r\n tooltip: {\r\n enabled: true,\r\n formatter: undefined,\r\n offsetY: 0,\r\n style: {\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily,\r\n },\r\n },\r\n },\r\n yaxis: {\r\n min: 0,\r\n max: 55,\r\n labels: {\r\n show: false,\r\n style: {\r\n colors: layoutProps.colorsGrayGray500,\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily,\r\n },\r\n },\r\n },\r\n states: {\r\n normal: {\r\n filter: {\r\n type: \"none\",\r\n value: 0,\r\n },\r\n },\r\n hover: {\r\n filter: {\r\n type: \"none\",\r\n value: 0,\r\n },\r\n },\r\n active: {\r\n allowMultipleDataPointsSelection: false,\r\n filter: {\r\n type: \"none\",\r\n value: 0,\r\n },\r\n },\r\n },\r\n tooltip: {\r\n style: {\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily,\r\n },\r\n y: {\r\n formatter: function(val) {\r\n return \"$\" + val + \" thousands\";\r\n },\r\n },\r\n },\r\n colors: [layoutProps.colorsThemeLightSuccess],\r\n markers: {\r\n colors: [layoutProps.colorsThemeLightSuccess],\r\n strokeColor: [layoutProps.colorsThemeBaseSuccess],\r\n strokeWidth: 3,\r\n },\r\n };\r\n return options;\r\n}\r\n","/* eslint-disable no-script-url,jsx-a11y/anchor-is-valid */\r\nimport React, {useMemo, useEffect} from \"react\";\r\nimport objectPath from \"object-path\";\r\nimport ApexCharts from \"apexcharts\";\r\nimport SVG from \"react-inlinesvg\";\r\nimport {useHtmlClassService} from \"../../../layout\";\r\nimport {toAbsoluteUrl} from \"../../../_helpers\";\r\n\r\nexport function StatsWidget12({ className }) {\r\n const uiService = useHtmlClassService();\r\n const layoutProps = useMemo(() => {\r\n return {\r\n colorsGrayGray500: objectPath.get(\r\n uiService.config,\r\n \"js.colors.gray.gray500\"\r\n ),\r\n colorsGrayGray200: objectPath.get(\r\n uiService.config,\r\n \"js.colors.gray.gray200\"\r\n ),\r\n colorsGrayGray300: objectPath.get(\r\n uiService.config,\r\n \"js.colors.gray.gray300\"\r\n ),\r\n colorsThemeBasePrimary: objectPath.get(\r\n uiService.config,\r\n \"js.colors.theme.base.primary\"\r\n ),\r\n colorsThemeLightPrimary: objectPath.get(\r\n uiService.config,\r\n \"js.colors.theme.light.primary\"\r\n ),\r\n fontFamily: objectPath.get(uiService.config, \"js.fontFamily\")\r\n };\r\n }, [uiService]);\r\n\r\n useEffect(() => {\r\n const element = document.getElementById(\"kt_stats_widget_12_chart\");\r\n\r\n if (!element) {\r\n return;\r\n }\r\n\r\n const options = getChartOption(layoutProps);\r\n const chartnewUsers = new ApexCharts(element, options);\r\n chartnewUsers.render();\r\n return function cleanUp() {\r\n chartnewUsers.destroy();\r\n };\r\n }, [layoutProps]);\r\n\r\n return (\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n 750$\r\n \r\n \r\n Weekly Income\r\n \r\n
\r\n \r\n
\r\n \r\n );\r\n}\r\n\r\nfunction getChartOption(layoutProps) {\r\n var options = {\r\n series: [\r\n {\r\n name: \"Net Profit\",\r\n data: [40, 40, 30, 30, 35, 35, 50]\r\n }\r\n ],\r\n chart: {\r\n type: \"area\",\r\n height: 150,\r\n toolbar: {\r\n show: false\r\n },\r\n zoom: {\r\n enabled: false\r\n },\r\n sparkline: {\r\n enabled: true\r\n }\r\n },\r\n plotOptions: {},\r\n legend: {\r\n show: false\r\n },\r\n dataLabels: {\r\n enabled: false\r\n },\r\n fill: {\r\n type: \"solid\",\r\n opacity: 1\r\n },\r\n stroke: {\r\n curve: \"smooth\",\r\n show: true,\r\n width: 3,\r\n colors: [layoutProps.colorsThemeBasePrimary]\r\n },\r\n xaxis: {\r\n categories: [\"Feb\", \"Mar\", \"Apr\", \"May\", \"Jun\", \"Aug\", \"Sep\"],\r\n axisBorder: {\r\n show: false\r\n },\r\n axisTicks: {\r\n show: false\r\n },\r\n labels: {\r\n show: false,\r\n style: {\r\n colors: layoutProps.colorsGrayGray500,\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily\r\n }\r\n },\r\n crosshairs: {\r\n show: false,\r\n position: \"front\",\r\n stroke: {\r\n color: layoutProps.colorsGrayGray300,\r\n width: 1,\r\n dashArray: 3\r\n }\r\n },\r\n tooltip: {\r\n enabled: true,\r\n formatter: undefined,\r\n offsetY: 0,\r\n style: {\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily\r\n }\r\n }\r\n },\r\n yaxis: {\r\n min: 0,\r\n max: 55,\r\n labels: {\r\n show: false,\r\n style: {\r\n colors: layoutProps.colorsGrayGray500,\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily\r\n }\r\n }\r\n },\r\n states: {\r\n normal: {\r\n filter: {\r\n type: \"none\",\r\n value: 0\r\n }\r\n },\r\n hover: {\r\n filter: {\r\n type: \"none\",\r\n value: 0\r\n }\r\n },\r\n active: {\r\n allowMultipleDataPointsSelection: false,\r\n filter: {\r\n type: \"none\",\r\n value: 0\r\n }\r\n }\r\n },\r\n tooltip: {\r\n style: {\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily\r\n },\r\n y: {\r\n formatter: function(val) {\r\n return \"$\" + val + \" thousands\";\r\n }\r\n }\r\n },\r\n colors: [layoutProps.colorsThemeLightPrimary],\r\n markers: {\r\n colors: [layoutProps.colorsThemeLightPrimary],\r\n strokeColor: [layoutProps.colorsThemeBasePrimary],\r\n strokeWidth: 3\r\n }\r\n };\r\n return options;\r\n}\r\n","/* eslint-disable no-script-url,jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport SVG from \"react-inlinesvg\";\r\nimport { toAbsoluteUrl } from \"../../../_helpers\";\r\n\r\nexport function AdvanceTablesWidget1({ className }) {\r\n return (\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n +6,5K\r\n \r\n New Users\r\n
\r\n \r\n {/* begin::Header */}\r\n
\r\n );\r\n}\r\n","/* eslint-disable no-script-url,jsx-a11y/anchor-is-valid */\r\nimport React, {useState} from \"react\";\r\nimport { Nav, Tab } from \"react-bootstrap\";\r\nimport SVG from \"react-inlinesvg\";\r\nimport {toAbsoluteUrl} from \"../../../_helpers\";\r\n\r\nexport function AdvanceTablesWidget2({ className }) {\r\n const [key, setKey] = useState(\"Month\");\r\n\r\n return (\r\n \r\n
\r\n {/* end::Header */}\r\n\r\n {/* begin::Body */}\r\n \r\n \r\n Agents Stats\r\n \r\n \r\n More than 400+ new members\r\n \r\n
\r\n\r\n \r\n \r\n \r\n \r\n Add New Member\r\n \r\n
\r\n \r\n {/* begin::Table */}\r\n
\r\n {/* end::Body */}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n authors\r\n \r\n company \r\n progress \r\n \r\n action\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Brad Simmons\r\n \r\n \r\n HTML, JS, ReactJS\r\n \r\n \r\n \r\n \r\n Intertico\r\n \r\n \r\n Web, UI/UX Design\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Jessie Clarcson\r\n \r\n \r\n C#, ASP.NET, MS SQL\r\n \r\n \r\n \r\n \r\n Agoda\r\n \r\n \r\n Houses & Hotels\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Lebron Wayde\r\n \r\n \r\n PHP, Laravel, VueJS\r\n \r\n \r\n \r\n \r\n RoadGee\r\n \r\n \r\n Transportation\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Natali Trump\r\n \r\n \r\n Python, PostgreSQL, ReactJS\r\n \r\n \r\n \r\n \r\n The Hill\r\n \r\n Insurance\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n {/* end::Table */}\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n 65%\r\n \r\n \r\n Progress\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n 83%\r\n \r\n \r\n Progress\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n 47%\r\n \r\n \r\n Progress\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n 71%\r\n \r\n \r\n Progress\r\n \r\n
\r\n \r\n
\r\n \r\n {/* Head */}\r\n
\r\n );\r\n}\r\n","/* eslint-disable no-script-url,jsx-a11y/anchor-is-valid,jsx-a11y/img-redundant-alt */\r\nimport React from \"react\";\r\nimport SVG from \"react-inlinesvg\";\r\nimport {toAbsoluteUrl} from \"../../../_helpers\";\r\n\r\nexport function AdvanceTablesWidget4({ className }) {\r\n return (\r\n \r\n
\r\n {/* Body */}\r\n \r\n \r\n New Arrivals\r\n \r\n \r\n More than 400+ new members\r\n \r\n
\r\n\r\n \r\n setKey(_key)}\r\n className=\"nav nav-pills nav-pills-sm nav-dark-75\"\r\n >\r\n \r\n \r\n Month\r\n \r\n \r\n \r\n \r\n Week\r\n \r\n \r\n \r\n \r\n Day\r\n \r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n | \r\n | \r\n | \r\n | \r\n | \r\n | \r\n |
|---|---|---|---|---|---|
| \r\n \r\n \r\n \r\n | \r\n \r\n \r\n Email:{\" \"}\r\n \r\n | \r\n \r\n \r\n $2,000,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n ReactJs, HTML\r\n \r\n | \r\n\r\n \r\n Approved\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
| \r\n \r\n \r\n \r\n | \r\n \r\n \r\n Email:{\" \"}\r\n \r\n | \r\n \r\n \r\n $4,600,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n Python, MySQL\r\n \r\n | \r\n\r\n \r\n In Progress\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
| \r\n \r\n \r\n \r\n | \r\n \r\n \r\n Email:{\" \"}\r\n \r\n | \r\n \r\n \r\n $560,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n Laravel, Metronic\r\n \r\n | \r\n\r\n \r\n Success\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
| \r\n \r\n \r\n \r\n | \r\n \r\n \r\n Email:{\" \"}\r\n \r\n | \r\n \r\n \r\n $57,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n AngularJS, C#\r\n \r\n | \r\n\r\n \r\n Rejected\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
| \r\n \r\n \r\n \r\n | \r\n \r\n \r\n Email:{\" \"}\r\n \r\n | \r\n \r\n \r\n $45,200,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n ReactJS, Ruby\r\n \r\n | \r\n\r\n \r\n In Progress\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
\r\n {/* Head */}\r\n
\r\n );\r\n}\r\n","/* eslint-disable jsx-a11y/img-redundant-alt */\r\n/* eslint-disable no-script-url,jsx-a11y/anchor-is-valid */\r\nimport React, { useState } from \"react\";\r\nimport SVG from \"react-inlinesvg\";\r\nimport { Nav, Tab } from \"react-bootstrap\";\r\nimport { toAbsoluteUrl } from \"../../../_helpers\";\r\n\r\nexport function AdvanceTablesWidget7({ className }) {\r\n const [key, setKey] = useState(\"Month\");\r\n\r\n return (\r\n \r\n
\r\n {/* Body */}\r\n \r\n Agents Stats\r\n More than 400+ new members\r\n
\r\n\r\n New Report\r\n Create\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n | products | \r\nearnings | \r\n\r\n | company | \r\nrating | \r\n\r\n |
|---|---|---|---|---|---|
| \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Brad\r\n Simmons\r\n HTML, JS, ReactJS\r\n \r\n | \r\n \r\n \r\n $8,000,000\r\n \r\n \r\n In Proccess\r\n \r\n | \r\n\r\n \r\n $520\r\n \r\n \r\n Paid\r\n \r\n | \r\n\r\n \r\n Intertico\r\n \r\n \r\n Web, UI/UX Design\r\n \r\n | \r\n\r\n ![\"image\"]({toAbsoluteUrl(\"/media/logos/stars.png\")}) \r\n \r\n Best Rated\r\n \r\n | \r\n \r\n View Offer\r\n | \r\n
| \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Jessie\r\n Clarcson\r\n C#, ASP.NET, MS SQL\r\n \r\n | \r\n \r\n \r\n $23,000,000\r\n \r\n \r\n Pending\r\n \r\n | \r\n\r\n \r\n $1,600\r\n \r\n \r\n Rejected\r\n \r\n | \r\n\r\n \r\n Agoda\r\n \r\n \r\n Houses & Hotels\r\n \r\n | \r\n\r\n \r\n \r\n Above Avarage\r\n \r\n | \r\n \r\n View Offer\r\n | \r\n
| \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Lebron Wayde\r\n \r\n PHP, Laravel, VueJS\r\n \r\n | \r\n \r\n \r\n $34,000,000\r\n \r\n \r\n Paid\r\n \r\n | \r\n\r\n \r\n $6,700\r\n \r\n \r\n Paid\r\n \r\n | \r\n\r\n \r\n RoadGee\r\n \r\n \r\n Paid\r\n \r\n | \r\n\r\n \r\n \r\n Best Rated\r\n \r\n | \r\n \r\n View Offer\r\n | \r\n
| \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n Natali Trump\r\n \r\n Python, PostgreSQL, ReactJS\r\n \r\n | \r\n \r\n \r\n $2,600,000\r\n \r\n \r\n Paid\r\n \r\n | \r\n\r\n \r\n $14,000\r\n \r\n \r\n Pending\r\n \r\n | \r\n\r\n \r\n The Hill\r\n \r\n \r\n Insurance\r\n \r\n | \r\n\r\n \r\n \r\n Avarage\r\n \r\n | \r\n \r\n \r\n View Offer\r\n \r\n | \r\n
\r\n {/* Head */}\r\n \r\n
\r\n {/* end::Tap pane Day */}\r\n \r\n \r\n \r\n );\r\n}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React, { useEffect, useMemo } from \"react\";\r\nimport SVG from \"react-inlinesvg\";\r\nimport { Dropdown } from \"react-bootstrap\";\r\nimport objectPath from \"object-path\";\r\nimport ApexCharts from \"apexcharts\";\r\nimport { toAbsoluteUrl } from \"../../../_helpers\";\r\nimport { DropdownCustomToggler, DropdownMenu4 } from \"../../dropdowns\";\r\nimport { useHtmlClassService } from \"../../../layout\";\r\n\r\nexport function TilesWidget1({ className, chartColor = \"danger\" }) {\r\n const uiService = useHtmlClassService();\r\n const layoutProps = useMemo(() => {\r\n return {\r\n colorsGrayGray500: objectPath.get(\r\n uiService.config,\r\n \"js.colors.gray.gray500\"\r\n ),\r\n colorsGrayGray300: objectPath.get(\r\n uiService.config,\r\n \"js.colors.gray.gray300\"\r\n ),\r\n colorsThemeBaseColor: objectPath.get(\r\n uiService.config,\r\n `js.colors.theme.base.${chartColor}`\r\n ),\r\n colorsThemeLightColor: objectPath.get(\r\n uiService.config,\r\n `js.colors.theme.light.${chartColor}`\r\n ),\r\n fontFamily: objectPath.get(uiService.config, \"js.fontFamily\"),\r\n };\r\n }, [uiService, chartColor]);\r\n\r\n useEffect(() => {\r\n const element = document.getElementById(\"kt_tiles_widget_1_chart\");\r\n\r\n if (!element) {\r\n return;\r\n }\r\n\r\n const options = getChartOption(layoutProps);\r\n const chart = new ApexCharts(element, options);\r\n chart.render();\r\n return function cleanUp() {\r\n chart.destroy();\r\n };\r\n }, [layoutProps]);\r\n\r\n return (\r\n <>\r\n {/* begin::Tiles Widget 1 */}\r\n \r\n
\r\n {/* Body */}\r\n \r\n \r\n New Arrivals\r\n \r\n \r\n More than 400+ new members\r\n \r\n
\r\n\r\n \r\n setKey(_key)}\r\n className=\"nav nav-pills nav-pills-sm nav-dark-75\"\r\n >\r\n \r\n \r\n Month\r\n \r\n \r\n \r\n \r\n Week\r\n \r\n \r\n \r\n \r\n Day\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n {/* end::Tap pane Week */}\r\n\r\n {/* begin::Tap pane DAY */}\r\n \r\n {/* begin::Tap pane MONTH */}\r\n \r\n
\r\n {/* end::Tap pane MONTH */}\r\n\r\n {/* begin::Tap pane WEEK */}\r\n \r\n \r\n \r\n
\r\n
\r\n | \r\n | \r\n | \r\n | \r\n | \r\n | \r\n |
|---|---|---|---|---|---|
| \r\n \r\n \r\n \r\n | \r\n \r\n \r\n Email:{\" \"}\r\n \r\n | \r\n \r\n \r\n $2,000,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n ReactJs, HTML\r\n \r\n | \r\n\r\n \r\n Approved\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
| \r\n \r\n \r\n \r\n | \r\n \r\n \r\n Email:{\" \"}\r\n \r\n | \r\n \r\n \r\n $4,600,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n Python, MySQL\r\n \r\n | \r\n\r\n \r\n In Progress\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
| \r\n \r\n \r\n \r\n | \r\n \r\n \r\n Email:{\" \"}\r\n \r\n | \r\n \r\n \r\n $560,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n Laravel, Metronic\r\n \r\n | \r\n\r\n \r\n Success\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
| \r\n \r\n \r\n \r\n | \r\n \r\n \r\n Email:{\" \"}\r\n \r\n | \r\n \r\n \r\n $57,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n AngularJS, C#\r\n \r\n | \r\n\r\n \r\n Rejected\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
| \r\n \r\n \r\n \r\n | \r\n \r\n \r\n Email:{\" \"}\r\n \r\n | \r\n \r\n \r\n $45,200,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n ReactJS, Ruby\r\n \r\n | \r\n\r\n \r\n In Progress\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
\r\n \r\n \r\n
\r\n
\r\n | \r\n | \r\n | \r\n | \r\n | \r\n | \r\n |
|---|---|---|---|---|---|
| \r\n \r\n \r\n \r\n | \r\n \r\n | \r\n \r\n \r\n $4,600,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n Python, MySQL\r\n \r\n | \r\n\r\n \r\n In Progress\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
| \r\n \r\n \r\n \r\n | \r\n \r\n | \r\n \r\n \r\n $560,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n Laravel, Metronic\r\n \r\n | \r\n\r\n \r\n Success\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
| \r\n \r\n \r\n \r\n | \r\n \r\n | \r\n \r\n \r\n $57,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n AngularJS, C#\r\n \r\n | \r\n\r\n \r\n Rejected\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
| \r\n \r\n \r\n \r\n | \r\n \r\n \r\n Email:\r\n \r\n | \r\n \r\n \r\n $2,000,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n ReactJs, HTML\r\n \r\n | \r\n\r\n \r\n Approved\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
| \r\n \r\n \r\n \r\n | \r\n \r\n | \r\n \r\n \r\n $45,200,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n ReactJS, Ruby\r\n \r\n | \r\n\r\n \r\n In Progress\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
\r\n \r\n \r\n
\r\n
\r\n | \r\n | \r\n | \r\n | \r\n | \r\n | \r\n |
|---|---|---|---|---|---|
| \r\n \r\n \r\n \r\n | \r\n \r\n \r\n Email:\r\n \r\n | \r\n \r\n \r\n $2,000,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n ReactJs, HTML\r\n \r\n | \r\n\r\n \r\n Approved\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
| \r\n \r\n \r\n \r\n | \r\n \r\n | \r\n \r\n \r\n $4,600,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n Python, MySQL\r\n \r\n | \r\n\r\n \r\n In Progress\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
| \r\n \r\n \r\n \r\n | \r\n \r\n | \r\n \r\n \r\n $560,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n Laravel, Metronic\r\n \r\n | \r\n\r\n \r\n Success\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
| \r\n \r\n \r\n \r\n | \r\n \r\n | \r\n \r\n \r\n $57,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n AngularJS, C#\r\n \r\n | \r\n\r\n \r\n Rejected\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
| \r\n \r\n \r\n \r\n | \r\n \r\n | \r\n \r\n \r\n $45,200,000\r\n \r\n Paid\r\n | \r\n\r\n \r\n ReactJS, Ruby\r\n \r\n | \r\n\r\n \r\n In Progress\r\n \r\n | \r\n\r\n \r\n \r\n | \r\n
\r\n {/* begin::Header */}\r\n
\r\n {/* end::Tiles Widget 1 */}\r\n \r\n );\r\n}\r\n\r\nfunction getChartOption(layoutProps) {\r\n const options = {\r\n series: [\r\n {\r\n name: \"Net Profit\",\r\n data: [20, 22, 30, 28, 25, 26, 30, 28, 22, 24, 25, 35],\r\n },\r\n ],\r\n chart: {\r\n type: \"area\",\r\n height: 150,\r\n toolbar: {\r\n show: false,\r\n },\r\n zoom: {\r\n enabled: false,\r\n },\r\n sparkline: {\r\n enabled: true,\r\n },\r\n },\r\n plotOptions: {},\r\n legend: {\r\n show: false,\r\n },\r\n dataLabels: {\r\n enabled: false,\r\n },\r\n fill: {\r\n type: \"gradient\",\r\n opacity: 1,\r\n gradient: {\r\n type: \"vertical\",\r\n shadeIntensity: 0.55,\r\n gradientToColors: undefined,\r\n inverseColors: true,\r\n opacityFrom: 1,\r\n opacityTo: 0.2,\r\n stops: [25, 50, 100],\r\n colorStops: [],\r\n },\r\n },\r\n stroke: {\r\n curve: \"smooth\",\r\n show: true,\r\n width: 3,\r\n colors: [layoutProps.colorsThemeBaseColor],\r\n },\r\n xaxis: {\r\n categories: [\r\n \"Jan\",\r\n \"Feb\",\r\n \"Mar\",\r\n \"Apr\",\r\n \"May\",\r\n \"Jun\",\r\n \"Jul\",\r\n \"Aug\",\r\n \"Sep\",\r\n \"Oct\",\r\n \"Nov\",\r\n \"Dec\",\r\n ],\r\n axisBorder: {\r\n show: false,\r\n },\r\n axisTicks: {\r\n show: false,\r\n },\r\n labels: {\r\n show: false,\r\n style: {\r\n colors: layoutProps.colorsGrayGray500,\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily,\r\n },\r\n },\r\n crosshairs: {\r\n show: false,\r\n position: \"front\",\r\n stroke: {\r\n color: layoutProps.colorsGrayGray300,\r\n width: 1,\r\n dashArray: 3,\r\n },\r\n },\r\n tooltip: {\r\n enabled: true,\r\n formatter: undefined,\r\n offsetY: 0,\r\n style: {\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily,\r\n },\r\n },\r\n },\r\n yaxis: {\r\n min: 0,\r\n max: 37,\r\n labels: {\r\n show: false,\r\n style: {\r\n colors: layoutProps.colorsGrayGray500,\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily,\r\n },\r\n },\r\n },\r\n states: {\r\n normal: {\r\n filter: {\r\n type: \"none\",\r\n value: 0,\r\n },\r\n },\r\n hover: {\r\n filter: {\r\n type: \"none\",\r\n value: 0,\r\n },\r\n },\r\n active: {\r\n allowMultipleDataPointsSelection: false,\r\n filter: {\r\n type: \"none\",\r\n value: 0,\r\n },\r\n },\r\n },\r\n tooltip: {\r\n style: {\r\n fontSize: \"12px\",\r\n fontFamily: layoutProps.fontFamily,\r\n },\r\n y: {\r\n formatter: function(val) {\r\n return \"$\" + val + \" thousands\";\r\n },\r\n },\r\n },\r\n colors: [layoutProps.colorsThemeLightColor],\r\n markers: {\r\n colors: [layoutProps.colorsThemeLightColor],\r\n strokeColor: [layoutProps.colorsThemeBaseColor],\r\n strokeWidth: 3,\r\n },\r\n padding: {\r\n top: 0,\r\n bottom: 0,\r\n },\r\n };\r\n return options;\r\n}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport { toAbsoluteUrl } from \"../../../_helpers\";\r\n\r\nexport function TilesWidget3({ className, widgetHeight = \"175px\" }) {\r\n const backgroundImageUrl = toAbsoluteUrl(\"/media/bg/bg-9.jpg\");\r\n return (\r\n <>\r\n {/* begin::Tiles Widget 3 */}\r\n \r\n
\r\n {/* end::Header */}\r\n\r\n {/* begin::Body */}\r\n \r\n
\r\n \r\n
\r\n Weekly Sales Stats
\r\n 890,344 Sales
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n {/* begin::Chart */}\r\n
\r\n {/* end::Body */}\r\n \r\n {/* begin::Item */}\r\n
\r\n {/* end::Items */}\r\n \r\n
\r\n {/* end::Item */}\r\n\r\n {/* begin::Item */}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n Top Authors\r\n \r\n
\r\n \r\n Ricky Hunt, Sandra Trepp\r\n
\r\n \r\n +105$\r\n
\r\n \r\n
\r\n {/* end::Item */}\r\n\r\n {/* begin::Item */}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n Bestsellers\r\n \r\n
\r\n \r\n Pitstop Email Marketing\r\n
\r\n \r\n +60$\r\n
\r\n \r\n
\r\n {/* end::Item */}\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n Top Engagement\r\n \r\n
\r\n \r\n KT.com solution provider\r\n
\r\n \r\n +75$\r\n
\r\n \r\n {/* begin::Title */}\r\n \r\n Properties\r\n \r\n {/* end::Title */}\r\n
\r\n {/* end::Body */}\r\n \r\n {/* end::Tiles Widget 3 */}\r\n \r\n );\r\n}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\n\r\nexport function TilesWidget10({ className, widgetHeight = \"175px\" }) {\r\n return (\r\n <>\r\n \r\n
\r\n {/* end::Body */}\r\n \r\n \r\n );\r\n}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport SVG from \"react-inlinesvg\";\r\nimport { toAbsoluteUrl } from \"../../../_helpers\";\r\n\r\nexport function TilesWidget11({\r\n className,\r\n baseColor = \"primary\",\r\n widgetHeight = \"150px\",\r\n}) {\r\n return (\r\n <>\r\n \r\n
\r\n \r\n Start Now\r\n \r\n Create CRM Reports
\r\n\r\n Generate the latest CRM Report\r\n
\r\n \r\n \r\n \r\n \r\n \r\n 790\r\n
\r\n\r\n \r\n \r\n \r\n New Customers\r\n \r\n
\r\n \r\n \r\n );\r\n}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport { toAbsoluteUrl } from \"../../../_helpers\";\r\n\r\nexport function TilesWidget13({ className, widgetHeight = \"175px\" }) {\r\n const backgroundImageUrl = toAbsoluteUrl(\"/media/svg/patterns/taieri.svg\");\r\n\r\n return (\r\n <>\r\n \r\n 8,600\r\n
\r\n\r\n \r\n
\r\n {/* end::Body */}\r\n \r\n \r\n );\r\n}\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React from \"react\";\r\nimport SVG from \"react-inlinesvg\";\r\nimport { toAbsoluteUrl } from \"../../../_helpers\";\r\n\r\nexport function TilesWidget14({ className }) {\r\n const backgroundImageUrl = toAbsoluteUrl(\"/media/stock-600x600/img-16.jpg\");\r\n\r\n return (\r\n <>\r\n \r\n Create SaaS
\r\n Create Report\r\n
\r\n Create SaaS
Based Reports
\r\n Create Report\r\n \r\n \r\n Create Report\r\n \r\n
\r\n {/* end::Body */}\r\n \r\n \r\n );\r\n}\r\n","// Mixed\r\nexport { MixedWidget1 } from \"./mixed/MixedWidget1\";\r\nexport { MixedWidget4 } from \"./mixed/MixedWidget4\";\r\nexport { MixedWidget6 } from \"./mixed/MixedWidget6\";\r\nexport { MixedWidget10 } from \"./mixed/MixedWidget10\";\r\nexport { MixedWidget11 } from \"./mixed/MixedWidget11\";\r\nexport { MixedWidget12 } from \"./mixed/MixedWidget12\";\r\nexport { MixedWidget14 } from \"./mixed/MixedWidget14\";\r\n\r\n// Lists\r\nexport { ListsWidget1 } from \"./lists/ListsWidget1\";\r\nexport { ListsWidget3 } from \"./lists/ListsWidget3\";\r\nexport { ListsWidget4 } from \"./lists/ListsWidget4\";\r\nexport { ListsWidget8 } from \"./lists/ListsWidget8\";\r\nexport { ListsWidget9 } from \"./lists/ListsWidget9\";\r\nexport { ListsWidget10 } from \"./lists/ListsWidget10\";\r\nexport { ListsWidget11 } from \"./lists/ListsWidget11\";\r\nexport { ListsWidget14 } from \"./lists/ListsWidget14\";\r\n\r\n// Stats\r\nexport { StatsWidget10 } from \"./stats/StatsWidget10\";\r\nexport { StatsWidget11 } from \"./stats/StatsWidget11\";\r\nexport { StatsWidget12 } from \"./stats/StatsWidget12\";\r\n\r\n// Base tables\r\nexport { BaseTablesWidget1 } from \"./base-tables/BaseTablesWidget1\";\r\nexport { BaseTablesWidget2 } from \"./base-tables/BaseTablesWidget2\";\r\nexport { BaseTablesWidget6 } from \"./base-tables/BaseTablesWidget6\";\r\n\r\n// Advance tables\r\nexport { AdvanceTablesWidget1 } from \"./advance-tables/AdvanceTablesWidget1\";\r\nexport { AdvanceTablesWidget2 } from \"./advance-tables/AdvanceTablesWidget2\";\r\nexport { AdvanceTablesWidget4 } from \"./advance-tables/AdvanceTablesWidget4\";\r\nexport { AdvanceTablesWidget7 } from \"./advance-tables/AdvanceTablesWidget7\";\r\nexport { AdvanceTablesWidget9 } from \"./advance-tables/AdvanceTablesWidget9\";\r\n\r\n// Tiles\r\nexport { TilesWidget1 } from \"./tiles/TilesWidget1\";\r\nexport { TilesWidget3 } from \"./tiles/TilesWidget3\";\r\nexport { TilesWidget10 } from \"./tiles/TilesWidget10\";\r\nexport { TilesWidget11 } from \"./tiles/TilesWidget11\";\r\nexport { TilesWidget12 } from \"./tiles/TilesWidget12\";\r\nexport { TilesWidget13 } from \"./tiles/TilesWidget13\";\r\nexport { TilesWidget14 } from \"./tiles/TilesWidget14\";\r\n","import axiosInstance from '../apiService';\r\nimport constants from '../../constants/constants';\r\n\r\nconst ENDPOINTORIGIN = \"Client/\";\r\n\r\nconst getClientById = async (id) => await axiosInstance.get(ENDPOINTORIGIN + 'GetClientById?id=' + id, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst getClients = async () => await axiosInstance.get(ENDPOINTORIGIN + 'GetClients', constants.REQUIRE_INTERCEPTORS);\r\nconst getPaymentProfilesForClient = async () => await axiosInstance.get(ENDPOINTORIGIN + 'GetPaymentProfilesForClient', constants.REQUIRE_INTERCEPTORS);\r\nconst getManagementLink = async (chargifyCustomerId) => await axiosInstance.get(ENDPOINTORIGIN + `GetManagementLink?chargifyCustomerId=${chargifyCustomerId}`, constants.REQUIRE_INTERCEPTORS);\r\nconst getSubscriptionById = async () => await axiosInstance.get(ENDPOINTORIGIN + 'GetSubscriptionById', constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst generateSecurityToken = async () => await axiosInstance.get(ENDPOINTORIGIN + 'GenerateSecurityToken', constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst saveClient = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'SaveClient', model, { ...constants.REQUIRE_INTERCEPTORS, fileHandler: true });\r\n\r\nconst upgradeClientTier = async (clientId, tierToUpgradeTo) => await axiosInstance.post(ENDPOINTORIGIN + 'UpgradeClientTier?clientId=' + clientId + '&tierToUpgradeTo=' + tierToUpgradeTo, {}, constants.REQUIRE_INTERCEPTORS)\r\n\r\nconst deleteClientByIsDeleteFlag = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'DeleteClientByIsDeletedFlag', model, constants.REQUIRE_INTERCEPTORS);\r\n\r\nconst savePaymentProfileAndOrSubscribe = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'SavePaymentProfileAndOrSubscribe', model, constants.REQUIRE_INTERCEPTORS);\r\nconst savePaymentProfile = async (model) => await axiosInstance.post(ENDPOINTORIGIN + 'SavePaymentProfile', model, constants.REQUIRE_INTERCEPTORS);\r\n\r\nexport {\r\n getClientById,\r\n getClients,\r\n saveClient,\r\n generateSecurityToken,\r\n upgradeClientTier,\r\n getManagementLink,\r\n deleteClientByIsDeleteFlag,\r\n getPaymentProfilesForClient,\r\n savePaymentProfileAndOrSubscribe,\r\n getSubscriptionById,\r\n savePaymentProfile\r\n}","import {createSlice} from \"@reduxjs/toolkit\";\r\n\r\nconst initialCustomersState = {\r\n listLoading: false,\r\n actionsLoading: false,\r\n totalCount: 0,\r\n entities: null,\r\n customerForEdit: undefined,\r\n lastError: null\r\n};\r\nexport const callTypes = {\r\n list: \"list\",\r\n action: \"action\"\r\n};\r\n\r\nexport const customersSlice = createSlice({\r\n name: \"customers\",\r\n initialState: initialCustomersState,\r\n reducers: {\r\n catchError: (state, action) => {\r\n state.error = `${action.type}: ${action.payload.error}`;\r\n if (action.payload.callType === callTypes.list) {\r\n state.listLoading = false;\r\n } else {\r\n state.actionsLoading = false;\r\n }\r\n },\r\n startCall: (state, action) => {\r\n state.error = null;\r\n if (action.payload.callType === callTypes.list) {\r\n state.listLoading = true;\r\n } else {\r\n state.actionsLoading = true;\r\n }\r\n },\r\n // getCustomerById\r\n customerFetched: (state, action) => {\r\n state.actionsLoading = false;\r\n state.customerForEdit = action.payload.customerForEdit;\r\n state.error = null;\r\n },\r\n // findCustomers\r\n customersFetched: (state, action) => {\r\n const { totalCount, entities } = action.payload;\r\n state.listLoading = false;\r\n state.error = null;\r\n state.entities = entities;\r\n state.totalCount = totalCount;\r\n },\r\n // createCustomer\r\n customerCreated: (state, action) => {\r\n state.ewactionsLoading = false;\r\n state.error = null;\r\n state.entities.push(action.payload.customer);\r\n },\r\n // updateCustomer\r\n customerUpdated: (state, action) => {\r\n state.error = null;\r\n state.actionsLoading = false;\r\n state.entities = state.entities.map(entity => {\r\n if (entity.id === action.payload.customer.id) {\r\n return action.payload.customer;\r\n }\r\n return entity;\r\n });\r\n },\r\n // deleteCustomer\r\n customerDeleted: (state, action) => {\r\n state.error = null;\r\n state.actionsLoading = false;\r\n state.entities = state.entities.filter(el => el.id !== action.payload.id);\r\n },\r\n // deleteCustomers\r\n customersDeleted: (state, action) => {\r\n state.error = null;\r\n state.actionsLoading = false;\r\n state.entities = state.entities.filter(\r\n el => !action.payload.ids.includes(el.id)\r\n );\r\n },\r\n // customersUpdateState\r\n customersStatusUpdated: (state, action) => {\r\n state.actionsLoading = false;\r\n state.error = null;\r\n const { ids, status } = action.payload;\r\n state.entities = state.entities.map(entity => {\r\n if (ids.findIndex(id => id === entity.id) > -1) {\r\n entity.status = status;\r\n }\r\n return entity;\r\n });\r\n }\r\n }\r\n});\r\n","import {createSlice} from \"@reduxjs/toolkit\";\r\n\r\nconst initialProductsState = {\r\n listLoading: false,\r\n actionsLoading: false,\r\n totalCount: 0,\r\n entities: null,\r\n productForEdit: undefined,\r\n lastError: null\r\n};\r\nexport const callTypes = {\r\n list: \"list\",\r\n action: \"action\"\r\n};\r\n\r\nexport const productsSlice = createSlice({\r\n name: \"products\",\r\n initialState: initialProductsState,\r\n reducers: {\r\n catchError: (state, action) => {\r\n state.error = `${action.type}: ${action.payload.error}`;\r\n if (action.payload.callType === callTypes.list) {\r\n state.listLoading = false;\r\n } else {\r\n state.actionsLoading = false;\r\n }\r\n },\r\n startCall: (state, action) => {\r\n state.error = null;\r\n if (action.payload.callType === callTypes.list) {\r\n state.listLoading = true;\r\n } else {\r\n state.actionsLoading = true;\r\n }\r\n },\r\n // getProductById\r\n productFetched: (state, action) => {\r\n state.actionsLoading = false;\r\n state.productForEdit = action.payload.productForEdit;\r\n state.error = null;\r\n },\r\n // findProducts\r\n productsFetched: (state, action) => {\r\n const { totalCount, entities } = action.payload;\r\n state.listLoading = false;\r\n state.error = null;\r\n state.entities = entities;\r\n state.totalCount = totalCount;\r\n },\r\n // createProduct\r\n productCreated: (state, action) => {\r\n state.actionsLoading = false;\r\n state.error = null;\r\n state.entities.push(action.payload.product);\r\n },\r\n // updateProduct\r\n productUpdated: (state, action) => {\r\n state.error = null;\r\n state.actionsLoading = false;\r\n state.entities = state.entities.map(entity => {\r\n if (entity.id === action.payload.product.id) {\r\n return action.payload.product;\r\n }\r\n return entity;\r\n });\r\n },\r\n // deleteProduct\r\n productDeleted: (state, action) => {\r\n state.error = null;\r\n state.actionsLoading = false;\r\n state.entities = state.entities.filter(el => el.id !== action.payload.id);\r\n },\r\n // deleteProducts\r\n productsDeleted: (state, action) => {\r\n state.error = null;\r\n state.actionsLoading = false;\r\n state.entities = state.entities.filter(\r\n el => !action.payload.ids.includes(el.id)\r\n );\r\n },\r\n // productsUpdateState\r\n productsStatusUpdated: (state, action) => {\r\n state.actionsLoading = false;\r\n state.error = null;\r\n const { ids, status } = action.payload;\r\n state.entities = state.entities.map(entity => {\r\n if (ids.findIndex(id => id === entity.id) > -1) {\r\n entity.status = status;\r\n }\r\n return entity;\r\n });\r\n }\r\n }\r\n});\r\n","import {createSlice} from \"@reduxjs/toolkit\";\r\n\r\nconst initialRemarksState = {\r\n listLoading: false,\r\n actionsLoading: false,\r\n totalCount: 0,\r\n entities: null,\r\n remarkForEdit: undefined,\r\n lastError: null\r\n};\r\nexport const callTypes = {\r\n list: \"list\",\r\n action: \"action\"\r\n};\r\n\r\nexport const remarksSlice = createSlice({\r\n name: \"remarks\",\r\n initialState: initialRemarksState,\r\n reducers: {\r\n catchError: (state, action) => {\r\n state.error = `${action.type}: ${action.payload.error}`;\r\n if (action.payload.callType === callTypes.list) {\r\n state.listLoading = false;\r\n } else {\r\n state.actionsLoading = false;\r\n }\r\n },\r\n startCall: (state, action) => {\r\n state.error = null;\r\n if (action.payload.callType === callTypes.list) {\r\n state.listLoading = true;\r\n } else {\r\n state.actionsLoading = true;\r\n }\r\n },\r\n // getRemarkById\r\n remarkFetched: (state, action) => {\r\n state.actionsLoading = false;\r\n state.remarkForEdit = action.payload.remarkForEdit;\r\n state.error = null;\r\n },\r\n // findRemarks\r\n remarksFetched: (state, action) => {\r\n const { totalCount, entities } = action.payload;\r\n state.listLoading = false;\r\n state.error = null;\r\n state.entities = entities;\r\n state.totalCount = totalCount;\r\n },\r\n // createRemark\r\n remarkCreated: (state, action) => {\r\n state.actionsLoading = false;\r\n state.error = null;\r\n state.entities.push(action.payload.remark);\r\n },\r\n // updateRemark\r\n remarkUpdated: (state, action) => {\r\n state.error = null;\r\n state.actionsLoading = false;\r\n state.entities = state.entities.map(entity => {\r\n if (entity.id === action.payload.remark.id) {\r\n return action.payload.remark;\r\n }\r\n return entity;\r\n });\r\n },\r\n // deleteRemark\r\n remarkDeleted: (state, action) => {\r\n state.error = null;\r\n state.actionsLoading = false;\r\n state.entities = state.entities.filter(el => el.id !== action.payload.id);\r\n },\r\n // deleteRemarks\r\n remarksDeleted: (state, action) => {\r\n state.error = null;\r\n state.actionsLoading = false;\r\n state.entities = state.entities.filter(\r\n el => !action.payload.ids.includes(el.id)\r\n );\r\n },\r\n // remarksUpdateState\r\n remarksStatusUpdated: (state, action) => {\r\n state.actionsLoading = false;\r\n state.error = null;\r\n const { ids, status } = action.payload;\r\n state.entities = state.entities.map(entity => {\r\n if (ids.findIndex(id => id === entity.id) > -1) {\r\n entity.status = status;\r\n }\r\n return entity;\r\n });\r\n }\r\n }\r\n});\r\n","import {createSlice} from \"@reduxjs/toolkit\";\r\n\r\nconst initialSpecificationsState = {\r\n listLoading: false,\r\n actionsLoading: false,\r\n totalCount: 0,\r\n entities: null,\r\n specificationForEdit: undefined,\r\n lastError: null\r\n};\r\nexport const callTypes = {\r\n list: \"list\",\r\n action: \"action\"\r\n};\r\n\r\nexport const specificationsSlice = createSlice({\r\n name: \"specifications\",\r\n initialState: initialSpecificationsState,\r\n reducers: {\r\n catchError: (state, action) => {\r\n state.error = `${action.type}: ${action.payload.error}`;\r\n if (action.payload.callType === callTypes.list) {\r\n state.listLoading = false;\r\n } else {\r\n state.actionsLoading = false;\r\n }\r\n },\r\n startCall: (state, action) => {\r\n state.error = null;\r\n if (action.payload.callType === callTypes.list) {\r\n state.listLoading = true;\r\n } else {\r\n state.actionsLoading = true;\r\n }\r\n },\r\n // getSpecificationById\r\n specificationFetched: (state, action) => {\r\n state.actionsLoading = false;\r\n state.specificationForEdit = action.payload.specificationForEdit;\r\n state.error = null;\r\n },\r\n // findSpecifications\r\n specificationsFetched: (state, action) => {\r\n const { totalCount, entities } = action.payload;\r\n state.listLoading = false;\r\n state.error = null;\r\n state.entities = entities;\r\n state.totalCount = totalCount;\r\n },\r\n // createSpecification\r\n specificationCreated: (state, action) => {\r\n state.actionsLoading = false;\r\n state.error = null;\r\n state.entities.push(action.payload.specification);\r\n },\r\n // updateSpecification\r\n specificationUpdated: (state, action) => {\r\n state.error = null;\r\n state.actionsLoading = false;\r\n state.entities = state.entities.map(entity => {\r\n if (entity.id === action.payload.specification.id) {\r\n return action.payload.specification;\r\n }\r\n return entity;\r\n });\r\n },\r\n // deleteSpecification\r\n specificationDeleted: (state, action) => {\r\n state.error = null;\r\n state.actionsLoading = false;\r\n state.entities = state.entities.filter(el => el.id !== action.payload.id);\r\n },\r\n // deleteSpecifications\r\n specificationsDeleted: (state, action) => {\r\n state.error = null;\r\n state.actionsLoading = false;\r\n state.entities = state.entities.filter(\r\n el => !action.payload.ids.includes(el.id)\r\n );\r\n }\r\n }\r\n});\r\n","import { persistReducer } from \"redux-persist\";\r\nimport storage from \"redux-persist/lib/storage\";\r\nimport { put, takeLatest } from \"redux-saga/effects\";\r\nimport { getUserByToken } from \"./authCrud\";\r\nimport jwt_decode from \"jwt-decode\";\r\n\r\nexport const actionTypes = {\r\n Login: \"[Login] Action\",\r\n Logout: \"[Logout] Action\",\r\n Register: \"[Register] Action\",\r\n UserRequested: \"[Request User] Action\",\r\n UserLoaded: \"[Load User] Auth API\",\r\n SetUser: \"[Set User] Action\",\r\n UpgradeTier: \"[Upgrade Tier] Action\",\r\n};\r\n\r\nconst initialAuthState = {\r\n user: undefined,\r\n authToken: undefined,\r\n role: undefined\r\n};\r\n\r\nexport const reducer = persistReducer(\r\n { storage, key: \"auth-token\", whitelist: [\"user\", \"authToken\", \"role\", \"clientRefId\"] },\r\n (state = initialAuthState, action) => {\r\n switch (action.type) {\r\n case actionTypes.Login: {\r\n const { token } = action.payload;\r\n const decodedToken = jwt_decode(token);\r\n return { authToken: token, user: undefined, role: decodedToken.role, clientRefId: decodedToken.RefId };\r\n }\r\n\r\n case actionTypes.Register: {\r\n const { authToken } = action.payload;\r\n\r\n return { authToken, user: undefined };\r\n }\r\n\r\n case actionTypes.Logout: {\r\n // TODO: Change this code. Actions in reducer aren't allowed.\r\n return initialAuthState;\r\n }\r\n\r\n case actionTypes.UserLoaded: {\r\n const { user } = action.payload;\r\n return { ...state, user };\r\n }\r\n\r\n case actionTypes.SetUser: {\r\n const { user } = action.payload;\r\n return { ...state, user };\r\n }\r\n\r\n case actionTypes.UpgradeTier: {\r\n const { user } = state;\r\n const updatedUser = { ...user, tier: action.payload };\r\n return { ...state, user: updatedUser };\r\n }\r\n\r\n default:\r\n return state;\r\n }\r\n }\r\n);\r\n\r\nexport const actions = {\r\n login: (user) => ({ type: actionTypes.Login, payload: user }),\r\n register: (authToken) => ({\r\n type: actionTypes.Register,\r\n payload: { authToken },\r\n }),\r\n logout: () => ({ type: actionTypes.Logout }),\r\n requestUser: (user) => ({\r\n type: actionTypes.UserRequested,\r\n payload: { user },\r\n }),\r\n fulfillUser: (user) => ({ type: actionTypes.UserLoaded, payload: { user } }),\r\n setUser: (user) => ({ type: actionTypes.SetUser, payload: user }),\r\n upgradeTier: (tier) => ({ type: actionTypes.UpgradeTier, payload: tier })\r\n};\r\n\r\nexport function* saga() {\r\n yield takeLatest(actionTypes.Login, function* loginSaga({ payload }) {\r\n yield put(actions.requestUser(payload));\r\n });\r\n\r\n yield takeLatest(actionTypes.Register, function* registerSaga() {\r\n yield put(actions.requestUser());\r\n });\r\n\r\n yield takeLatest(actionTypes.UserRequested, function* userRequested({ payload }) {\r\n\r\n yield put(actions.fulfillUser(payload.user));\r\n });\r\n}\r\n"],"sourceRoot":""}\r\n \r\n Create Reports\r\n
\r\n
\r\n\r\n