\r\n
\r\n
\r\n {(jobDetails != null && this.state.inValidStatus.indexOf(jobDetails.workflowStatusId) > -1) ?\r\n <>\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
Url has been expired or invalid! \r\n \r\n
Go TO Login \r\n
\r\n
\r\n
\r\n
\r\n :\r\n (jobDetails != null && this.state.completedStatus.indexOf(jobDetails.workflowStatusId) > -1 && this.dayDifference(new Date(jobDetails.lastUpdatedDateTime), new Date()) > 5 || this.state.urlExpired) ?\r\n <>\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
Url has been expired! \r\n \r\n
Go TO Login \r\n
\r\n
\r\n
\r\n
\r\n :\r\n\r\n (jobDetails != null && !isCurrentTenant && jobDetails.isUserTenant && jobDetails.propertyId != null && jobDetails.workflowStatusId != 6) ?\r\n <>\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
Only current tenants are allow to view or edit job details! \r\n \r\n
Go TO Login \r\n
\r\n
\r\n
\r\n
\r\n :\r\n (jobDetails != null && !isCurrentTenant && jobDetails.isUserTenant && jobDetails.propertyId != null && jobDetails.workflowStatusId != 6) ?\r\n <>\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
Only current tenants are allow to view or edit job details! \r\n \r\n
Go TO Login \r\n
\r\n
\r\n
\r\n
\r\n :\r\n <>\r\n
\r\n \r\n
\r\n
\r\n
{t('title_maintanance_request')} \r\n \r\n
:''} */}\r\n \r\n
\r\n
\r\n
\r\n
\r\n
this.backToList(event)}\r\n isJobEdit={true} jobDetail={jobDetails}\r\n {...routerProps}\r\n reloadPage={()=>this.reloadPage()} />}\r\n />\r\n this.onJobApproveOrReject()}\r\n />}\r\n />\r\n this.onJobApproveOrReject()}\r\n />}\r\n />\r\n this.onJobApproveOrReject()}\r\n />}\r\n />\r\n this.reload()}\r\n />}\r\n />\r\n \r\n\r\n {((jobDetails != null && jobDetails.workflowStatusId == 1) || (jobDetails != null && localStorage.getItem('sendemailfortenattogetmoreinfo') == \"true\")) ? \r\n {(this.props.location && this.props.location.pathname === '/external/overview') ?\r\n this.onSubmitJobDetails()} style={{ color: (style.primaryButtonStyle.color) ? style.primaryButtonStyle.color : \"\", backgroundColor: (style.primaryButtonStyle.backgroundColor) ? style.primaryButtonStyle.backgroundColor : \"\" }}>\r\n {t('btn_post')}\r\n {(this.state.isJobPosting) ? \r\n : <>}\r\n
:\r\n (jobDetails != null\r\n && (jobDetails.workflowStatusId == 6 && (this.state.ownerApprovalStatus == 0 || this.state.ownerApprovalStatus == 6))\r\n && !this.state.isJobApprovedOrRejected\r\n ) ?\r\n < div className={(this.props.location.pathname === '/external/ownerApprove' || this.props.location.pathname === '/external/ownerReject' || this.props.location.pathname === '/external/ownerAttend' || this.props.location.pathname === '/external/job-notes' || this.props.location.pathname === '/external/job-quotes') ? \"d-none\" : \"d-flex col-12 w-100 flex-wrap align-items-center px-0\"} >\r\n {(jobDetails.workflowStatusId === 6 && (jobDetails.bidCount === 0 || (jobDetails.isOwnerApprovalPendingForVariation && jobDetails.currentVariation))) ?\r\n \r\n
If you want more information or have any questions, please reply to the email that you received which will go directly to your property manager.
\r\n
\r\n {(jobDetails.isPercentageReached) ? '' :\r\n //\r\n // \r\n <>\r\n I will Attend \r\n {(this.state.showApproveRejectDrawer) ?\r\n this.onJobApproveOrReject()}\r\n toggleOwnerApproveRejectDrawer={this.toggleApproveRejectDrawer.bind(this)} >\r\n \r\n : ''\r\n }\r\n \r\n }\r\n {(jobDetails.workflowStatusId === 6 && (jobDetails.bidCount === 0 || (jobDetails.isOwnerApprovalPendingForVariation && jobDetails.currentVariation))) ?\r\n //\r\n // \r\n\r\n //\r\n // \r\n <>\r\n Approve \r\n {(this.state.showApproveDrawer) ?\r\n this.onJobApproveOrReject()}\r\n toggleOwnerApproveDrawer={this.toggleApproveDrawer.bind(this)} >\r\n \r\n : ''\r\n }\r\n Reject \r\n {(this.state.showRejectDrawer) ?\r\n this.onJobApproveOrReject()}\r\n toggleOwnerRejectDrawer={this.toggleRejectDrawer.bind(this)} >\r\n \r\n : ''\r\n }\r\n \r\n : ''\r\n }\r\n
\r\n : ''}\r\n {(jobDetails != null && (jobDetails.workflowStatusId == 4) && jobDetails.scheduleEventId != null) ?
\r\n {(jobDetails.scheduleEventStatus !== 2) ? <>\r\n this.onAcceptSchedule()}> Approve \r\n this.onRejectSchedule()}> Reject \r\n : ''}\r\n this.toggleSheduleJobDrawer()}> Re-schedule Job \r\n {(this.state.showScheduleJob) ?\r\n this.toggleSheduleJobDrawer()}\r\n getJobDetails={(event) => { window.location.reload() }}\r\n CloseJobDetailsDrawer={(event) => window.location.reload()}>\r\n : ''\r\n }\r\n
: ''}\r\n \r\n
\r\n
\r\n {this.state.ToolTipMessage}\r\n \r\n }\r\n >\r\n {this.props.children}\r\n \r\n \r\n );\r\n }\r\n}\r\n\r\n\r\nexport default ToolTipLayout;","import React from 'react';\r\nimport { AppConfiguration } from \"read-appsettings-json\";\r\nimport { Link } from 'react-router-dom';\r\n\r\nexport default class ExternalDownloadPage extends React.Component {\r\n render() {\r\n return \r\n
\r\n
\r\n \r\n\r\n
Simplified property\r\n maintenance + inspections \r\n today \r\n
Post a maintenance request in less than 60 seconds + hold a remote inspection all from your smartphone.
\r\n
Get started for free today.
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n this.reloadPage()} />}\r\n />\r\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, ownProps) => {\r\n try {\r\n let userDetails = state.User;\r\n\r\n return {\r\n userDetails: userDetails,\r\n profileThumbnailsCdnEndpoint: state.AppSettings.imageCdnEndpoint,\r\n jobTypes: state.Jobs.jobTypes,\r\n theme: state.theme,\r\n isCustomThemeEnable: state.isCustomThemeEnable\r\n };\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n};\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n updateUserDetails: details => { dispatch({ type: \"SET_USER_DETAILS\", userDetails: details }) },\r\n updateIsTenantField: isCurrentTenant => { dispatch({ type: \"CHECK_CURRENT_TENANT\", isCurrentTenant: isCurrentTenant }) },\r\n setJobDetails: jobDetails => { dispatch({ type: 'SET_JOB_DETAILS', jobDetails: jobDetails }) },\r\n setJobDetailsLoadingStatus: status => { dispatch({ type: 'SET_JOB_DETAILS_LOADING_STATUS', status: status }) },\r\n addJobTypes: jobTypes => { dispatch({ type: 'SET_JOB_TYPES', jobTypes: jobTypes }) }\r\n };\r\n};\r\n\r\nexport default connect(\r\n mapStateToProps,\r\n mapDispatchToProps\r\n)(ExternalUserApp);","// In production, we register a service worker to serve assets from local cache.\r\n\r\n// This lets the app load faster on subsequent visits in production, and gives\r\n// it offline capabilities. However, it also means that developers (and users)\r\n// will only see deployed updates on the \"N+1\" visit to a page, since previously\r\n// cached resources are updated in the background.\r\n\r\n// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.\r\n// This link also includes instructions on opting out of this behavior.\r\n\r\nconst isLocalhost = Boolean(\r\n window.location.hostname === 'localhost' ||\r\n // [::1] is the IPv6 localhost address.\r\n window.location.hostname === '[::1]' ||\r\n // 127.0.0.1/8 is considered localhost for IPv4.\r\n window.location.hostname.match(\r\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\r\n )\r\n);\r\n\r\nexport default function register () {\r\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\r\n // The URL constructor is available in all browsers that support SW.\r\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location);\r\n if (publicUrl.origin !== window.location.origin) {\r\n // Our service worker won't work if PUBLIC_URL is on a different origin\r\n // from what our page is served on. This might happen if a CDN is used to\r\n // serve assets; see https://github.com/facebookincubator/create-react-app/issues/2374\r\n return;\r\n }\r\n\r\n window.addEventListener('load', () => {\r\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\r\n\r\n if (isLocalhost) {\r\n // This is running on localhost. Lets check if a service worker still exists or not.\r\n checkValidServiceWorker(swUrl);\r\n } else {\r\n // Is not local host. Just register service worker\r\n registerValidSW(swUrl);\r\n }\r\n });\r\n }\r\n}\r\n\r\nfunction registerValidSW (swUrl) {\r\n navigator.serviceWorker\r\n .register(swUrl)\r\n .then(registration => {\r\n registration.onupdatefound = () => {\r\n const installingWorker = registration.installing;\r\n installingWorker.onstatechange = () => {\r\n if (installingWorker.state === 'installed') {\r\n if (navigator.serviceWorker.controller) {\r\n // At this point, the old content will have been purged and\r\n // the fresh content will have been added to the cache.\r\n // It's the perfect time to display a \"New content is\r\n // available; please refresh.\" message in your web app.\r\n console.log('New content is available; please refresh.');\r\n } else {\r\n // At this point, everything has been precached.\r\n // It's the perfect time to display a\r\n // \"Content is cached for offline use.\" message.\r\n console.log('Content is cached for offline use.');\r\n }\r\n }\r\n };\r\n };\r\n })\r\n .catch(error => {\r\n console.error('Error during service worker registration:', error);\r\n });\r\n}\r\n\r\nfunction checkValidServiceWorker (swUrl) {\r\n // Check if the service worker can be found. If it can't reload the page.\r\n fetch(swUrl)\r\n .then(response => {\r\n // Ensure service worker exists, and that we really are getting a JS file.\r\n if (\r\n response.status === 404 ||\r\n response.headers.get('content-type').indexOf('javascript') === -1\r\n ) {\r\n // No service worker found. Probably a different app. Reload the page.\r\n navigator.serviceWorker.ready.then(registration => {\r\n registration.unregister().then(() => {\r\n window.location.reload();\r\n });\r\n });\r\n } else {\r\n // Service worker found. Proceed as normal.\r\n registerValidSW(swUrl);\r\n }\r\n })\r\n .catch(() => {\r\n console.log(\r\n 'No internet connection found. App is running in offline mode.'\r\n );\r\n });\r\n}\r\n\r\nexport function unregister () {\r\n if ('serviceWorker' in navigator) {\r\n navigator.serviceWorker.ready.then(registration => {\r\n registration.unregister();\r\n });\r\n }\r\n}\r\n","const initState = {\r\n tenantCount:0,\r\n isCurrentTenant: false,\r\n tenantProperties: []\r\n}\r\n\r\nconst TenantReducer = (state = initState, action) =>{\r\n\r\n switch (action.type) {\r\n case 'ADD_Tenant':\r\n return {\r\n ...state,\r\n tenantCount: action.tenantCount\r\n }\r\n case 'CHECK_CURRENT_TENANT':\r\n return{\r\n ...state,\r\n isCurrentTenant: action.isCurrentTenant\r\n }\r\n case 'SET_PROPERTIES':\r\n return{\r\n ...state,\r\n tenantProperties: action.properties\r\n }\r\n \r\n default:\r\n return state;\r\n }\r\n}\r\n\r\nexport default TenantReducer;","const initState = {\r\n ownerCount: 0\r\n}\r\n\r\nconst OwnerReducer = (state = initState, action) =>{\r\n if(action.type === \"ADD_Owner\"){\r\n \r\n return{\r\n ...state,\r\n ownerCount: action.ownerCount\r\n }\r\n }\r\n return state;\r\n}\r\n\r\nexport default OwnerReducer;","import { AppConfiguration } from \"read-appsettings-json\";\r\n\r\nconst apiendpoint = AppConfiguration.Setting().apiendpoint;\r\nconst imageCdnEndpoint = AppConfiguration.Setting().azureStorage.ImageCdnEndpoint;\r\nconst imageThumbnailsCdnEndpoint = AppConfiguration.Setting().azureStorage.ImageThumbnailsCdnEndpoint;\r\nconst clientSecret = AppConfiguration.Setting().ClientSecret;\r\nconst profileThumbnailsCdnEndpoint = AppConfiguration.Setting().azureStorage.ProfileThumbnailsCdnEndpoint;\r\nconst videoCdnEndpoint = AppConfiguration.Setting().azureStorage.VideoCdnEndpoint;\r\nconst generalFilesCdnEndpoint = AppConfiguration.Setting().azureStorage.GeneralFilesCdnEndpoint;\r\nconst BAndAEndPoint = AppConfiguration.Setting().BAndAApiEndPoint;\r\nconst intercomApiKey = AppConfiguration.Setting().Intercom.ApiKey;\r\n\r\nconst initState = {\r\n apiEndPoint: apiendpoint,\r\n imageCdnEndpoint: imageCdnEndpoint,\r\n imageThumbnailsCdnEndpoint: imageThumbnailsCdnEndpoint,\r\n profileThumbnailsCdnEndpoint: profileThumbnailsCdnEndpoint,\r\n videoCdnEndpoint: videoCdnEndpoint,\r\n generalFilesCdnEndpoint: generalFilesCdnEndpoint,\r\n clientSecret: clientSecret,\r\n BAndAEndPoint: BAndAEndPoint,\r\n intercomApiKey: intercomApiKey\r\n};\r\n\r\nconst appSettingsReducers = (state = initState, action) => {\r\n switch (action.type) {\r\n case \"LOAD_APP_SETTINGS\":\r\n return {\r\n ...state,\r\n appSettings: action.appSettings\r\n };\r\n default:\r\n return state;\r\n }\r\n};\r\nexport default appSettingsReducers;\r\n","const initState = {\r\n isOpen: false,\r\n isRefreshGrid: false,\r\n conversations: [],\r\n jobTypes: [],\r\n jobDetails: null,\r\n isJobDetailsLoading: false\r\n}\r\n\r\n\r\nconst JobsReducer = (state = initState, action) => {\r\n switch (action.type) {\r\n case \"SHOW_JOB_DETAILS_DRAWER\":\r\n return {\r\n ...state,\r\n isOpen: action.isOpen,\r\n refreshMyJobs: action.refreshMyJobs\r\n }\r\n case \"Conversations\":\r\n return {\r\n ...state,\r\n conversations: action.chatList\r\n }\r\n case 'REFRESH_GRID':\r\n return {\r\n ...state,\r\n isRefreshGrid: action.isRefresh\r\n }\r\n case 'SET_JOB_TYPES':\r\n return {\r\n ...state,\r\n jobTypes: action.jobTypes\r\n }\r\n case 'SET_JOB_DETAILS':\r\n return {\r\n ...state,\r\n jobDetails: action.jobDetails\r\n }\r\n case 'SET_JOB_DETAILS_LOADING_STATUS':\r\n return {\r\n ...state,\r\n isJobDetailsLoading: action.status\r\n }\r\n default:\r\n return state;\r\n }\r\n}\r\n\r\nexport default JobsReducer;","const initState = {\r\n conversationList: ''\r\n}\r\n\r\n\r\nconst ConversationReducer = (state = initState, action) => {\r\n if (action.type == 'SHOW_CONVERSATION') {\r\n return {\r\n ...state,\r\n conversationList: action.chatList\r\n }\r\n }\r\n return state;\r\n // switch(action.type) {\r\n // case 'SHOW_CONVERSATION': \r\n // console.log(action.chatList);\r\n // return {\r\n // ...state,\r\n // conversationList: action.chatList\r\n // }\r\n // break;\r\n // default:\r\n // return state;\r\n // }\r\n}\r\n\r\nexport default ConversationReducer;","const initState = {\r\n email: '',\r\n firstName: '',\r\n lastName: '',\r\n profileImageUrl: '',\r\n userType: '',\r\n userId: '',\r\n userIdEncripted: '',\r\n homePhoneNumber: '',\r\n location: '',\r\n mobileNumber: '',\r\n officePhoneNumber: '',\r\n countryId: '',\r\n dateFormat: '',\r\n dateTimeFormat: '',\r\n dateTimeFormatMin: '',\r\n userRoles: []\r\n}\r\n\r\nconst UserReducer = (state = initState, action) => {\r\n\r\n if (action.type === \"SET_USER_DETAILS\") {\r\n\r\n return {\r\n ...state,\r\n email: action.userDetails.email,\r\n firstName: action.userDetails.firstName,\r\n lastName: action.userDetails.lastName,\r\n profileImageUrl: action.userDetails.profileImageUrl,\r\n profileImageId: action.userDetails.profileImageId,\r\n userType: action.userDetails.userType,\r\n userId: action.userDetails.userId,\r\n userIdEncripted: action.userDetails.userIdEncripted,\r\n homePhoneNumber: action.userDetails.homePhoneNumber,\r\n location: action.userDetails.location,\r\n countryId: action.userDetails.countryId,\r\n mobileNumber: action.userDetails.mobileNumber,\r\n officePhoneNumber: action.userDetails.officePhoneNumber,\r\n dateFormat: action.userDetails.dateFormat,\r\n dateTimeFormat: action.userDetails.dateTimeFormat,\r\n dateTimeFormatMin: action.userDetails.dateTimeFormatMin,\r\n }\r\n }\r\n else if(action.type === \"SET_USER_ROLES\") {\r\n return {\r\n ...state,\r\n userRoles: action.roles\r\n }\r\n }\r\n return state;\r\n}\r\n\r\nexport default UserReducer;","import TenantReducer from './TenantReducer';\r\nimport OwnerReducer from './OwnerReducer';\r\nimport AppSettingsReducer from './AppSettingsReducer';\r\nimport JobsReducer from './JobsReducer';\r\nimport {combineReducers} from 'redux'\r\nimport ConversationReducer from './ConversationReducer';\r\nimport UserReducer from './UserReducer';\r\n\r\nconst RootReducer = combineReducers({\r\n Tenant : TenantReducer,\r\n Owner : OwnerReducer,\r\n MyJobs : JobsReducer,\r\n Jobs : JobsReducer,\r\n AppSettings: AppSettingsReducer,\r\n Conversation: ConversationReducer,\r\n User: UserReducer\r\n})\r\n\r\nexport default RootReducer","import { AppConfiguration } from \"read-appsettings-json\";\r\nimport Firebase from \"firebase\";\r\nconst appsettings = AppConfiguration.Setting();\r\n\r\nexport const firebaseConfig = {\r\n apiKey: appsettings.PushSettings.RealtimeApiKey,\r\n authDomain: appsettings.PushSettings.RealtimeAuthDomain,\r\n databaseURL: appsettings.PushSettings.RealtimeDatabaseURL,\r\n projectId: appsettings.PushSettings.RealtimeProjectId,\r\n storageBucket: appsettings.PushSettings.RealtimeStorageBucket,\r\n messagingSenderId: appsettings.PushSettings.RealtimeMessagingSenderId\r\n}\r\nexport const initFirebaseApp = () => {\r\n Firebase.initializeApp(firebaseConfig);\r\n}\r\n\r\n","import React from 'react';\r\nimport { connect } from \"react-redux\";\r\nimport Loader from \"react-loader-spinner\";\r\nimport { ButtonToolbar, ToggleButton, ToggleButtonGroup } from \"react-bootstrap\";\r\nimport ImageViewer from '../../../Common/ImageViewer/ImageViewer';\r\nimport { AXIOS } from \"../../../../Utilities/HttpRequest/Axios\";\r\nimport { toast } from 'react-toastify';\r\nimport 'react-toastify/dist/ReactToastify.css';\r\nimport { Form } from 'react-bootstrap';\r\nimport settingsService from '../../../../Services/settingsService';\r\nimport jobService from '../../../../Services/JobService';\r\nimport { Guid } from 'guid-typescript';\r\nimport DatePicker from \"react-datepicker\";\r\nimport { Search, Label, Button, Modal, Dropdown } from 'semantic-ui-react'\r\nimport \"react-datepicker/dist/react-datepicker.css\";\r\nimport * as _ from 'lodash';\r\nimport 'semantic-ui-css/semantic.min.css'\r\nimport './BotJobPost_Wizard.scss';\r\nimport propertyService from '../../../../Services/PropertyService';\r\nimport FrequentlyUsedServices from '../../../Drawers/JobPostDrawer/FrequentlyUsedServices/FrequentlyUsedServices';\r\nimport AttachmentsDrawer from '../../../Drawers/AttachmentsDrawer/AttachmentsDrawer';\r\nimport Disclaimer from '../../../Drawers/JobPostDrawer/Disclaimer/Disclaimer';\r\nimport { AppConfiguration } from 'read-appsettings-json';\r\nimport { trackPromise } from 'react-promise-tracker';\r\nimport { Link } from 'react-router-dom';\r\nimport { withTranslation } from 'react-i18next';\r\nimport translateService from '../../../../Services/TranslateService';\r\nimport { string } from 'prop-types';\r\nimport { any } from 'prop-types';\r\n\r\nclass BotJobPostWizard extends React.Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.title = React.createRef();\r\n this.jobDescription = React.createRef();\r\n this.budgetRef = React.createRef();\r\n this.issueAreaInProperty = React.createRef();\r\n }\r\n notifyError = (msg) => {\r\n toast.error(msg, {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n if (this.props.isFromBot) {\r\n this.props.showChatbotError(msg);\r\n }\r\n }\r\n\r\n state = {\r\n userType: localStorage.getItem(\"userType\"),\r\n userId: localStorage.getItem(\"userId\"),\r\n stepFlow: [[0, \"selectProperty\"], [1, \"getMaintenaceIssue\"], [2, \"getMaintenaceTroubleShootGuide\"],[3, \"getAttachments\"], [4, \"selectPrePostSummary\"], [5, \"setResponse\"], [6, \"setTroubleShooteResponse\"]],\r\n isJobEdit: (this.props.isJobEdit) ? true : false,\r\n jobEditId: (this.props.jobEditId) ? this.props.jobEditId : \"\",\r\n currentStep: 0,\r\n isConsumerJobPost: false,\r\n propertySearchData: [],\r\n formData: {\r\n address: '',\r\n location: '',\r\n propertyId: '',\r\n propertyName: '',\r\n suburbId: '',\r\n propertyType: '',\r\n jobBudget: 0,\r\n jobDescription: '',\r\n jobDescriptionEng: '',\r\n issueAreaInProperty: '',\r\n issueAreaInPropertyEng: '',\r\n },\r\n availableServices: [],\r\n availableServicesDetails: [],\r\n selectedService: { childJobTypes: [] },\r\n selectedServiceType: {\r\n parentJobType: { id: '' }\r\n },\r\n selectedSubServiceType: {},\r\n jobDetails: { attachments: [] },\r\n attachments: [],\r\n jobId: '',\r\n dueDate: '',\r\n formattedDueDate: '',\r\n jobUrgencyList: [\r\n {\r\n value: this.props.t('editjob_lbl13'),\r\n jobUrgency: -1\r\n },\r\n {\r\n value: this.props.t('editjob_lbl11'),\r\n jobUrgency: 1\r\n },\r\n {\r\n value: this.props.t('editjob_lbl12'),\r\n jobUrgency: 2\r\n }\r\n ],\r\n jobUrgency: 2,\r\n jobUrgencyCheckbox: false,\r\n propertyList: [],\r\n value: '',\r\n isLoading: false,\r\n filteredResults: [],\r\n propertyId: '',\r\n isPropertiesLoading: false,\r\n parentJobTypes: [],\r\n primaryJobTypes: [],\r\n secondaryJobTypes: [],\r\n frequentlyUsedServices: [],\r\n isShowMoreServices: false,\r\n locationDetails: {\r\n latitude: '',\r\n longitude: '',\r\n placeId: '',\r\n suburbId: '',\r\n location: ''\r\n },\r\n isMandatoryToUploadFiles: false,\r\n isJobForMe: false,\r\n jobBudget: \"\",\r\n jobForMe: {},\r\n selectedTradees: [],\r\n isSelectedOnDemand: false,\r\n selectedQuoteLimit: 0,\r\n inviteToProviders: false,\r\n isJobPosting: false,\r\n isRestrictKeyCollectionForResidentialProperties: false,\r\n showDisclaimerDrawer: false,\r\n showBackToHomeConfirmation: false,\r\n jobPostWorkflowStatus: 1,\r\n propertyLocks: [],\r\n isJobForMeText: '',\r\n isSubServiceTypeSelected: false,\r\n isShowAttchmentDrawer: false,\r\n parentId: '',\r\n childJobTypeId: '',\r\n subChildJobTypeId: '',\r\n jobNumber: '',\r\n jobOverViewUrl: '',\r\n isPropertyOwner: (localStorage.userType == 5) ? true : false,\r\n isShowInviteTradeDrawer: false,\r\n budgetAmount: 0,\r\n isPropertySelected: false,\r\n title: '',\r\n isLoadingTroubleshootingGuide: false,\r\n troubleShootingGuideDetails: {\r\n troubleshootGuideId: '',\r\n troubleshootGuide: '',\r\n aiPoweredTroubleshootGuide: [],\r\n primaryJobTypeId: '',\r\n secondaryJobTypeId: ''\r\n },\r\n isAIPoweredTroubleshootRequested: false,\r\n isAlternativeAITroubleshootGuideRequested: false,\r\n aiPoweredTroubleshootResultsEmpty: false,\r\n isSkipTroubleshootGuideLoading: false,\r\n primaryButtonStyle: (this.props.customStyle && this.props.customStyle.primaryButtonStyle) ? this.props.customStyle.primaryButtonStyle : {\r\n color: ''\r\n },\r\n secondaryButtonStyle: (this.props.customStyle && this.props.customStyle.secondaryButtonStyle) ? this.props.customStyle.secondaryButtonStyle : {\r\n color: ''\r\n },\r\n optionsStyle: (this.props.customStyle && this.props.customStyle.optionsStyle) ? this.props.customStyle.optionsStyle : {\r\n color: ''\r\n },\r\n urgencyLabelStyle: {\r\n \"display\": \"inline-block\"\r\n },\r\n urgencyCheckboxStyle: {\r\n \"height\": \"20px\",\r\n \"width\": \"60px\"\r\n },\r\n isFromBot: (this.props.isFromBot) ? true : false,\r\n isTrackIssue: (this.props.isTrackIssue) ? true : false,\r\n isMaintatanceIssueProvided: false,\r\n isJobPostOrTroubleshootGuideSelected: false,\r\n isDraftJob: false,\r\n tradeeCount: 0,\r\n jobTypeTags: [],\r\n isLoadingJobTypeTags: false,\r\n jobAssignTags: [],\r\n selectedComponent: '',\r\n selectedGoogleImage: [],\r\n selectedFeatureComponent: [],\r\n previousStep: 0,\r\n chatbotSetting: this.props.chatbotSetting ? this.props.chatbotSetting : {\r\n hideQandABot: false,\r\n hideCheckRentalStatus: false,\r\n hideKeyCollectionOptions: false,\r\n hideTroubleshootGuide: false,\r\n enableAIPoweredTroubleshootGuide: false,\r\n enableDraftJobFeature: false\r\n },\r\n maintenanceTroubleshootGuideId: null,\r\n propertyType: \"Residential\",\r\n actionValue: 0\r\n }\r\n\r\n componentDidMount() {\r\n var normalFlow = [[0, \"selectProperty\"], [1, \"getMaintenaceIssue\"], [2, \"getMaintenaceTroubleShootGuide\"], [3, \"selectServiceType\"], [4, \"selectUgency\"], [5, \"selectKeyCollectionType\"], [6, \"selectBudget\"], [7, \"getAttachments\"], [8, \"getTrades\"], [9, \"selectSubmitOption\"], [10, \"setResponse\"], [11, \"setTroubleShooteResponse\"]];\r\n setTimeout(() => {\r\n this.GetTenantPropertiesByUserId();\r\n }, 1000);\r\n this.getAvailableServices();\r\n this.GetFrequentlyUsedJobTypes();\r\n this.setState({\r\n jobId: Guid.create().toString(),\r\n jobDetails: {\r\n id: this.state.jobId\r\n }\r\n });\r\n this.getAllAvailableJobTypes();\r\n if (localStorage.userType == 5) {\r\n this.setState({\r\n isJobForMe: true\r\n })\r\n }\r\n if (this.state.chatbotSetting.hideKeyCollectionOptions) {\r\n this.setState({\r\n keyCollectType: this.state.chatbotSetting.defaultKeyCollectionOption\r\n });\r\n }\r\n }\r\n\r\n componentDidUpdate() {\r\n if (this.props.isCustomThemeEnable) {\r\n this.createToggleBtnDynamicStyle();\r\n this.createOkBtnDynamicStyle();\r\n this.createActiveBtnDynamicStyle();\r\n this.attchmentBarStyle();\r\n }\r\n }\r\n\r\n applyTranslation(texts, sourceLng, targetLng) {\r\n const requestModel = {\r\n text: texts,\r\n targetCode: (targetLng == \"en-US\" || targetLng ==\"en-GB\") ? \"en\" : targetLng,\r\n sourceCode: sourceLng\r\n };\r\n\r\n return translateService.translate(requestModel);\r\n }\r\n\r\n createToggleBtnDynamicStyle() {\r\n const color = this.props.customStyle.optionsStyle.color;\r\n const border = this.props.customStyle.optionsStyle.border;\r\n let labelInsideToggleGroup = document.querySelectorAll('label.btn');\r\n\r\n for (var i = 0; i < labelInsideToggleGroup.length; i++) {\r\n labelInsideToggleGroup[i].style.color = color;\r\n labelInsideToggleGroup[i].style.border = border;\r\n labelInsideToggleGroup[i].style.background = '';\r\n }\r\n }\r\n createOkBtnDynamicStyle() {\r\n const color = this.props.customStyle.optionsStyle.color;\r\n let okIcons = document.querySelectorAll('span.ba-icn-ok');\r\n\r\n for (var i = 0; i < okIcons.length; i++) {\r\n okIcons[i].style.background = color;\r\n }\r\n }\r\n createActiveBtnDynamicStyle() {\r\n const color = this.props.customStyle.optionsStyle.activeBackground;\r\n let active = document.querySelectorAll('label.btn.active');\r\n for (var i = 0; i < active.length; i++) {\r\n active[i].style.background = color;\r\n }\r\n }\r\n attchmentBarStyle() {\r\n const color = this.props.customStyle.optionsStyle.color;\r\n const border = this.props.customStyle.optionsStyle.border;\r\n let label = document.querySelector('.rich-control');\r\n if (label) {\r\n label.querySelector('label').style.color = color;\r\n }\r\n let boader = document.querySelector('div.form-control.rich-control');\r\n if (boader) {\r\n boader.style.border = border;\r\n }\r\n }\r\n\r\n //get data\r\n\r\n getJobDetailsByJobId = jobId => {\r\n const userId = localStorage.getItem(\"userId\");\r\n this.setState({ isJobDetailsLoading: true })\r\n if (jobId) {\r\n try {\r\n AXIOS.GET(`tenant-api/job?jobId=${jobId}&userId=${userId}`).then(\r\n data => {\r\n //need to set jobdetails to state\r\n this.setState({});\r\n }\r\n )\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n }\r\n };\r\n\r\n\r\n getOrganizationSettings(organizationId) {\r\n settingsService.getOrganizationSettingsByOrgId(organizationId)\r\n .then((res) => {\r\n this.setState({\r\n isMandatoryToUploadFiles: res.organizationSettingsModel.allowTenantsToImageAttachmentFeatureForTheJobposting,\r\n isRestrictKeyCollectionForResidentialProperties: res.organizationSettingsModel.isRestrictKeyCollectionForResidentialProperties,\r\n allowTenantsToSeeMatchingTrades: res.organizationSettingsModel.allowTenantsToSeeMatchingTrades,\r\n isEnableSuggestingImage: res.organizationSettingsModel.isEnableSuggestingImage,\r\n isEnableIssueTag: res.organizationSettingsModel.isEnableIssueTag,\r\n })\r\n\r\n })\r\n\r\n }\r\n\r\n GetTenantPropertiesByUserId = () => {\r\n let none = [{ propertyId: 0, propertyName: '--None--', suburbId: '', location: '', address: '', propertyType: 'Residential' }];\r\n\r\n this.setState({ isPropertiesLoading: true });\r\n let properties;\r\n let propertyNames = [];\r\n const { i18n } = this.props;\r\n\r\n propertyService.GetTenantPropertiesByUserId()\r\n .then((res) => {\r\n properties = res.properties;\r\n if (res.properties.length > 0) {\r\n\r\n properties.forEach(x => {\r\n propertyNames.push(x.address ? x.address : \" \");\r\n });\r\n if (this.state.isFromBot) {\r\n this.applyTranslation(([propertyNames]), \"en\", i18n.language).then((trans) => {\r\n if (trans.length > 0) {\r\n trans.forEach((x, i) => {\r\n properties[i].address = trans[i];\r\n });\r\n }\r\n\r\n this.setState({\r\n propertyList: properties,\r\n propertyId: properties[0].propertyId\r\n });\r\n this.getPropertyDetailsByPropertyId(properties[0].propertyId);\r\n this.setState({ isPropertiesLoading: false });\r\n });\r\n }\r\n else {\r\n this.setState({\r\n propertyList: properties,\r\n propertyId: properties[0].propertyId,\r\n isCurrentTenant:properties[0].isCurrentTenant\r\n });\r\n if (localStorage.userType != 5) {\r\n this.getPropertyDetailsByPropertyId(properties[0].propertyId);\r\n }\r\n this.setState({ isPropertiesLoading: false });\r\n }\r\n this.handlePropertyChange(properties[0].propertyId);\r\n } else {\r\n this.setState({\r\n propertyList: [],\r\n propertyId: 0\r\n });\r\n this.onChangeJobType(1);\r\n }\r\n });\r\n }\r\n\r\n getAvailableServices = () => {\r\n try {\r\n this.setState({ isLoading: true })\r\n AXIOS.GET(`tenant-api/available-job-types?userId=${localStorage.getItem('userId')}`)\r\n .then(dataJson => {\r\n this.setState({ isLoading: false })\r\n this.setState({ availableServicesDetails: dataJson });\r\n this.setState({ availableServices: dataJson });\r\n let formData = this.state.formData;\r\n formData.childJobTypeId = '';\r\n formData.childJobType = '';\r\n this.setState({ formData: formData });\r\n })\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n }\r\n\r\n GetFrequentlyUsedJobTypes = () => {\r\n try {\r\n let jobTypesLabels = [];\r\n let data;\r\n const { i18n } = this.props;\r\n if (this.state.isFromBot) {\r\n jobService.GetFrequentlyUsedJobTypes()\r\n .then(result => {\r\n data = result;\r\n jobTypesLabels = data.map(x => x.label);\r\n return this.applyTranslation((jobTypesLabels), \"en\", i18n.language);\r\n\r\n }).then((trans) => {\r\n if (trans.length > 0) {\r\n trans.forEach((x, i) => {\r\n data[i].label = trans[i];\r\n });\r\n }\r\n this.setState({ frequentlyUsedServices: data });\r\n })\r\n }\r\n else {\r\n jobService.GetFrequentlyUsedJobTypes()\r\n .then(data => {\r\n this.setState({ frequentlyUsedServices: data });\r\n })\r\n }\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n }\r\n\r\n getAllAvailableJobTypes() {\r\n let jobTypes = this.props.jobTypes;\r\n let parents = _.map(jobTypes, m => m.parentJobType);\r\n const parentJobTypes = _.filter(parents, f => f.parentRef === null);\r\n this.setState({ parentJobTypes: parentJobTypes });\r\n }\r\n\r\n getPropertyDetailsByPropertyId = (propertyId) => {\r\n const selectedProperty = this.state.propertyList.filter(a => a.propertyId == propertyId);\r\n if (selectedProperty && selectedProperty.length > 0 && selectedProperty[0].propertyId != null) {\r\n this.setState({\r\n propertyId: propertyId,\r\n //locationDetails: {},\r\n formData: {\r\n address: selectedProperty[0].address,\r\n location: selectedProperty[0].location,\r\n propertyId: selectedProperty[0].propertyId,\r\n propertyName: selectedProperty[0].propertyName,\r\n suburbId: selectedProperty[0].suburbId,\r\n propertyType: selectedProperty[0].propertyType\r\n },\r\n locationDetails: selectedProperty[0],\r\n jobForMe: {\r\n propertyType: selectedProperty[0].propertyType,\r\n address: selectedProperty[0].address,\r\n latitude: selectedProperty[0].latitude,\r\n location: selectedProperty[0].location,\r\n longitude: selectedProperty[0].longitude,\r\n placeId: selectedProperty[0].placeId,\r\n suburbId: selectedProperty[0].suburbId,\r\n },\r\n });\r\n this.getOrganizationSettings(selectedProperty[0].orgnizationId);\r\n } else {\r\n this.setState({\r\n propertyId: null,\r\n locationDetails: {},\r\n formData: {\r\n address: '',\r\n location: '',\r\n propertyId: null,\r\n propertyName: '',\r\n suburbId: null,\r\n propertyType: ''\r\n }\r\n });\r\n }\r\n setTimeout(() => {\r\n if (this.state.isJobForMe == 1) {\r\n this.setState({ keyCollectType: 1 });\r\n }\r\n }, 500);\r\n }\r\n\r\n onChangeJobType = (value) => {\r\n if (value === 1 && localStorage.userType == 4) {\r\n this.setState({ isJobForMeText: You (tenant) will be paying for this job and are responsible
});\r\n } else {\r\n this.setState({ isJobForMeText: '' });\r\n }\r\n\r\n this.setState({\r\n isJobForMe: (value === 1) ? true : false,\r\n jobForMe: {\r\n propertyType: '',\r\n address: '',\r\n latitude: '',\r\n location: '',\r\n longitude: '',\r\n placeId: '',\r\n suburbId: '',\r\n budget: ''\r\n },\r\n formData: {\r\n propertyId: \"\"\r\n }\r\n });\r\n }\r\n\r\n onKeyCollectionChange = (event) => {\r\n this.setState({\r\n keyCollectType: event\r\n });\r\n }\r\n\r\n handlePropertyChange = (props) => {\r\n this.setState({ property: props });\r\n this.getPropertyDetailsByPropertyId(props);\r\n }\r\n\r\n\r\n\r\n handleOnChangeJobDescription = (value) => {\r\n\r\n let jobforMe = this.state.jobForMe;\r\n jobforMe.jobDescription = this.jobDescription.current.value;\r\n this.setState({ jobForMe: jobforMe });\r\n\r\n\r\n let formdata = this.state.formData;\r\n const typedDescription = this.jobDescription.current.value;\r\n formdata.jobDescription = typedDescription;\r\n formdata.jobDescriptionEng = typedDescription;\r\n this.setState({\r\n formdata: formdata,\r\n isMaintatanceIssueProvided: true\r\n });\r\n\r\n }\r\n\r\n handleResultSelect = (e, { result }) => {\r\n this.setState({ value: result.label })\r\n this.getChildJobTypes(result.id);\r\n }\r\n handleSearchChange = (e, { value }) => {\r\n this.setState({ filteredResults: [], value });\r\n if (value.length > 2) {\r\n this.setState({ isLoading: true })\r\n setTimeout(() => {\r\n document.querySelector('.jobpost-wizard .auto-complete').classList.remove(\"hide-results\");\r\n this.setState({\r\n isLoading: false,\r\n filteredResults: this.state.parentJobTypes.filter(suggestion => suggestion.label.toLowerCase().indexOf(this.state.value.toLowerCase()) > -1)\r\n })\r\n }, 300)\r\n } else {\r\n document.querySelector('.jobpost-wizard .auto-complete').classList.add(\"hide-results\");\r\n }\r\n }\r\n\r\n resultRenderer = (event) => {\r\n return \r\n
{this.state.selectedServiceType.parentJobType.description}* \r\n \r\n \r\n {this.state.secondaryJobTypes.map((jbType, index) => {\r\n return \r\n \r\n \r\n )\r\n } else {\r\n return\r\n }\r\n\r\n }\r\n\r\n onChangeChildTypeOfServices = (input) => {\r\n this.setState({ subChildJobTypeId: input });\r\n const childJobType = this.state.selectedServiceType.childJobTypes.filter(a => a.id === input)[0];\r\n let formData = this.state.formData;\r\n formData.childJobTypeId = childJobType.id;\r\n formData.childJobType = childJobType.title;\r\n this.setState({ formData: formData });\r\n }\r\n\r\n createTypeOfServicesButtons = (props) => {\r\n const { t } = this.props;\r\n let isServiceTypeSelected = this.state.isServiceTypeSelected;\r\n if (this.state.selectedService.childJobTypes) {\r\n return (\r\n <>\r\n \r\n {(isServiceTypeSelected) ?\r\n
\r\n
{this.state.isFromBot ? t('pj_lbl_select_sub_type') : 'Please select the type of subservice you require.'}* \r\n
{this.state.isFromBot ? t('pj_lbl_choose_an_option') : 'choose an option'}
\r\n
\r\n\r\n : ''}\r\n\r\n
\r\n { this.getSubChildJobTypes(event); }}>\r\n {this.state.selectedService.childJobTypes.map((jbType, index) => {\r\n return \r\n
{t('editjob_lbl13')} : this.state.jobUrgency == 1 ? {t('editjob_lbl11')} : {t('editjob_lbl12')} ;\r\n }\r\n\r\n closeDisclaimer = () => {\r\n this.setState({\r\n showDisclaimerDrawer: false,\r\n });\r\n }\r\n\r\n getTroubleShoutingGuide(index) {\r\n if (this.state.chatbotSetting.enableAIPoweredTroubleshootGuide) {\r\n this.getAIPoweredTroubleShoutingGuide(index);\r\n } else {\r\n this.getDefaultTroubleShoutingGuide(index);\r\n }\r\n }\r\n\r\n getDefaultTroubleShoutingGuide(index) {\r\n const { i18n } = this.props;\r\n this.setState({\r\n isLoadingTroubleshootingGuide: true\r\n });\r\n jobService.GetTroubleShootingGuide(this.state.formData.propertyId, this.state.formData.jobDescriptionEng).then(res => {\r\n if (res.responseCode == 12 && res.troubleshootGuide != null) {\r\n if (i18n.language != \"en\" && !i18n.language.toString().includes(\"en\")) {\r\n this.applyTranslation(res.troubleshootGuide, \"en\", i18n.language).then((trans) => {\r\n res.troubleshootGuide = trans[0];\r\n this.setState({\r\n troubleShootingGuideDetails: res,\r\n maintenanceTroubleshootGuideId: res.troubleshootGuideId,\r\n isLoadingTroubleshootingGuide: false\r\n });\r\n });\r\n } else {\r\n this.setState({\r\n troubleShootingGuideDetails: res,\r\n maintenanceTroubleshootGuideId: res.troubleshootGuideId,\r\n isLoadingTroubleshootingGuide: false\r\n });\r\n }\r\n\r\n if (this.state.chatbotSetting.hideTroubleshootGuide) {\r\n this.continueJobPosting(index + 1);\r\n }\r\n\r\n } else {\r\n this.setState({\r\n troubleShootingGuideDetails: res,\r\n isLoadingTroubleshootingGuide: false\r\n });\r\n this.continueJobPosting(index + 1);\r\n }\r\n });\r\n }\r\n\r\n getAIPoweredTroubleShoutingGuide(index) {\r\n const { i18n } = this.props;\r\n this.setState({\r\n isLoadingTroubleshootingGuide: true\r\n });\r\n jobService.GetAIPoweredTroubleShootingGuide(this.state.formData.propertyId, this.state.formData.jobDescriptionEng).then(res => {\r\n if (res.success == true && res.contents != null) {\r\n if (i18n.language != \"en\" && !i18n.language.toString().includes(\"en\")) {\r\n this.applyTranslation(res.contents[0], \"en\", i18n.language).then((trans) => {\r\n res.contents[0] = trans[0];\r\n\r\n let troubleShootingGuideDetails = this.state.troubleShootingGuideDetails;\r\n troubleShootingGuideDetails.aiPoweredTroubleshootGuide = res.contents;\r\n troubleShootingGuideDetails.primaryJobTypeId = res.primaryJobTypeId;\r\n troubleShootingGuideDetails.secondaryJobTypeId = res.secondaryJobTypeId;\r\n\r\n this.setState({\r\n troubleShootingGuideDetails: troubleShootingGuideDetails,\r\n aiPoweredTroubleshootResultsEmpty: false,\r\n isLoadingTroubleshootingGuide: false\r\n });\r\n });\r\n } else {\r\n let troubleShootingGuideDetails = this.state.troubleShootingGuideDetails;\r\n troubleShootingGuideDetails.aiPoweredTroubleshootGuide = res.contents;\r\n troubleShootingGuideDetails.primaryJobTypeId = res.primaryJobTypeId;\r\n troubleShootingGuideDetails.secondaryJobTypeId = res.secondaryJobTypeId;\r\n\r\n this.setState({\r\n troubleShootingGuideDetails: troubleShootingGuideDetails,\r\n aiPoweredTroubleshootResultsEmpty: false,\r\n isLoadingTroubleshootingGuide: false\r\n });\r\n }\r\n } else {\r\n let troubleShootingGuideDetails = this.state.troubleShootingGuideDetails;\r\n troubleShootingGuideDetails.primaryJobTypeId = res.primaryJobTypeId;\r\n troubleShootingGuideDetails.secondaryJobTypeId = res.secondaryJobTypeId;\r\n\r\n this.setState({\r\n troubleShootingGuideDetails: troubleShootingGuideDetails,\r\n aiPoweredTroubleshootResultsEmpty: true,\r\n isLoadingTroubleshootingGuide: false\r\n });\r\n }\r\n });\r\n }\r\n\r\n directToAIPoweredTroubleShootGuide = () => {\r\n this.setState({\r\n isAIPoweredTroubleshootRequested: true\r\n });\r\n }\r\n\r\n showAlternativeTroubleshootResults = (index) => {\r\n this.setState({ isAlternativeAITroubleshootGuideRequested: true });\r\n this.getAIPoweredTroubleShoutingGuide(index);\r\n }\r\n\r\n\r\n render() {\r\n const currentStepIndex = this.state.currentStep;\r\n let step = this.showCurrentStep(currentStepIndex);\r\n let backToHomeModal = this.backToHomeModal();\r\n return (\r\n );\r\n }\r\n\r\n showCurrentStep = (index) => { \r\n let currentStep = this.state.stepFlow[index][1];\r\n switch (currentStep) {\r\n case \"selectProperty\":\r\n return this.selectPropertyStep(index);\r\n case \"getMaintenaceIssue\": \r\n return this.getMaintenaceIssue(index);\r\n case \"getMaintenaceTroubleShootGuide\":\r\n if (this.state.chatbotSetting.enableAIPoweredTroubleshootGuide) {\r\n return this.getAIPoweredTroubleShootGuide(index);\r\n } else if (!this.state.chatbotSetting.hideTroubleshootGuide) {\r\n return this.getMaintenaceTroubleShootGuide(index);\r\n }\r\n case \"getAttachments\":\r\n return this.getAttachments(index);\r\n case \"selectPrePostSummary\":\r\n return this.selectPrePostSummary(index);\r\n case \"setResponse\":\r\n return this.setResponse(index);\r\n case \"setTroubleShooteResponse\":\r\n return this.setTroubleShooteResponse();\r\n case \"selectServiceType\":\r\n return this.selectServiceType(index);\r\n default:\r\n return this.nextStep(index);\r\n }\r\n }\r\n\r\n selectPropertyStep = (index) => {\r\n const { propertyList, propertyId, isJobForMe, jobForMe, formData, isPropertyOwner } = this.state;\r\n const forMeText = this.state.isJobForMeText;\r\n const { t } = this.props;\r\n return (\r\n \r\n
\r\n
\r\n
\r\n
{t('new_ui_pj_lbl_prop_select')} \r\n \r\n\r\n
\r\n {(this.state.isPropertiesLoading) ?
: ''}\r\n \r\n {(!this.state.isPropertiesLoading) ?
\r\n 0 ) ? propertyList[0].propertyId : \"\"}\r\n onChange={(value) => { this.handlePropertyChange(value) }}>\r\n {propertyList.map((a, index) => {\r\n return {a.address} \r\n :<>}\r\n
\r\n\r\n
\r\n
\r\n \r\n
\r\n this.nextStep(index)} style={this.state.primaryButtonStyle}>{t('new_ui_pj_btn_continue')} \r\n
\r\n\r\n
\r\n
\r\n
\r\n this.previousStep(index)} style={this.state.secondaryButtonStyle}>{t('btn_back')} \r\n this.backToHomeConfirmationModal()} style={this.state.secondaryButtonStyle}>{t('new_ui_pj_btn_home')} \r\n
\r\n
\r\n
\r\n
{t('new_ui_pj_hdr_job_describe')} \r\n \r\n\r\n
\r\n \r\n
\r\n
\r\n
{t('editjob_priority')} \r\n
{ return { key: index, text: a.value, value: a.jobUrgency }; })}\r\n placeholder='Choose job Priority'\r\n onChange={this.handleJobUrgencyOnChange}\r\n />\r\n {(this.state.jobUrgency==1) ? {t('new_ui_pj_lbl_urgent_notice')}
\r\n
\r\n
\r\n
\r\n this.nextStep(index)} style={this.state.primaryButtonStyle}>{t('new_ui_pj_btn_continue')} \r\n
\r\n
\r\n
\r\n\r\n
\r\n this.previousStep(index)} style={this.state.secondaryButtonStyle}>{t('btn_back')} \r\n this.backToHomeConfirmationModal()} style={this.state.secondaryButtonStyle}>{t('new_ui_pj_btn_home')} \r\n
\r\n
\r\n
{t('new_ui_pj_hdr_troubleshoot_steps')} \r\n
\r\n {isLoadingTroubleshootingGuide ?
\r\n : (
\r\n \r\n
{t('new_ui_pj_lbl_troubleshoot_proceed')}
\r\n\r\n
\r\n
)}\r\n
\r\n
\r\n
\r\n {!isLoadingTroubleshootingGuide && (
\r\n
\r\n this.continueJobPosting(index)} style={this.state.secondaryButtonStyle}>{t('new_ui_pj_btn_troubleshoot_not_fixed')} \r\n this.saveTroubleShootResult(true)} style={this.state.primaryButtonStyle}>{t('new_ui_pj_btn_troubleshoot_fixed')} \r\n
\r\n
)}\r\n
\r\n
\r\n\r\n
\r\n this.previousStep(index)} style={this.state.secondaryButtonStyle}>{t('btn_back')} \r\n this.backToHomeConfirmationModal()} style={this.state.secondaryButtonStyle}>{t('new_ui_pj_btn_home')} \r\n
\r\n {!isAIPoweredTroubleshootRequested ?\r\n isLoadingTroubleshootingGuide ?
\r\n
:
\r\n
\r\n
{t('new_ui_pj_hdr_ai_troubleshoot_confirmation')}
\r\n
\r\n
\r\n this.continueJobPosting(index)} style={this.state.secondaryButtonStyle}>{t('lbl_attachment_no')} \r\n this.directToAIPoweredTroubleShootGuide()} style={this.state.primaryButtonStyle}>{t('lbl_attachment_yes')} \r\n
\r\n
:
\r\n
{t('new_ui_pj_hdr_troubleshoot_steps')} \r\n
\r\n {isLoadingTroubleshootingGuide ?
\r\n : (aiPoweredTroubleshootResultsEmpty ?
\r\n
\r\n
\r\n
{t('new_ui_pj_lbl_ai_troubleshoot_no_response')}
\r\n
\r\n
:
\r\n\r\n
{t('new_ui_pj_lbl_troubleshoot_proceed')}
\r\n\r\n {troubleShootingGuideDetails.aiPoweredTroubleshootGuide.map((a, index) => {\r\n return
\r\n
\r\n
{a.split('\\n').map(str =>
{str}
)}\r\n
\r\n })\r\n }\r\n
)}\r\n
\r\n
}\r\n
\r\n {!isLoadingTroubleshootingGuide && isAIPoweredTroubleshootRequested && (
\r\n
\r\n {!isAlternativeAITroubleshootGuideRequested &&\r\n (
)\r\n }\r\n
this.continueJobPosting(index)} style={this.state.secondaryButtonStyle}>{t('new_ui_pj_btn_troubleshoot_not_fixed')}
\r\n
this.showTroubleshootSuccessResult()} style={this.state.primaryButtonStyle}>{t('new_ui_pj_btn_troubleshoot_fixed')}
\r\n
\r\n
)}\r\n
\r\n
\r\n
\r\n this.previousStep(index)} style={this.state.secondaryButtonStyle}>{t('btn_back')} \r\n this.backToHomeConfirmationModal()} style={this.state.secondaryButtonStyle}>{t('new_ui_pj_btn_home')} \r\n
\r\n
\r\n {(this.state.attachments.length == 0) ?\r\n
\r\n
{t('new_ui_pj_lbl_attchmnts_notice')}
\r\n
: ''\r\n }\r\n
\r\n
\r\n
{ this.setState({ attachments: event }) }}\r\n isJobPost={true}\r\n isFromBot={true}\r\n t={t}>\r\n \r\n {(this.state.attachments) ?\r\n \r\n
\r\n {(!this.state.chatbotSetting.hideKeyCollectionOptions) ?\r\n
\r\n
{t('new_ui_pj_lbl_summary_key_collection')} \r\n {(this.state.isRestrictKeyCollectionForResidentialProperties && this.state.formData.propertyType == 'Residential') ?\r\n
\r\n this.onKeyCollectionChange(value)} defaultValue={3}>\r\n {t('lbl_propkey_case6')} \r\n \r\n :\r\n
\r\n \r\n this.onKeyCollectionChange(value)} defaultValue={this.state.keyCollectType}>\r\n {t('lbl_keycollection_option1')} {t('lbl_keycollection_option2')} {t('lbl_keycollection_option3')} \r\n \r\n\r\n
\r\n }\r\n
: ''\r\n }\r\n
\r\n
\r\n
\r\n this.nextStep(index)} style={this.state.primaryButtonStyle}>{t('new_ui_pj_btn_continue')} \r\n
\r\n
\r\n
\r\n \r\n
\r\n this.previousStep(index)} style={this.state.secondaryButtonStyle}>{t('btn_back')} \r\n this.backToHomeConfirmationModal()} style={this.state.secondaryButtonStyle}>{t('new_ui_pj_btn_home')} \r\n
\r\n
\r\n
\r\n
{t('new_ui_pj_hdr_job_summary')} \r\n \r\n\r\n
\r\n
\r\n
{t('new_ui_pj_lbl_summary_address')}
\r\n
{this.state.formData.address}
\r\n
\r\n
\r\n
{t('new_ui_pj_lbl_summary_description')}
\r\n
{this.state.formData.jobDescription}
\r\n
\r\n {(this.state.attachments) ?\r\n
: ''\r\n }\r\n
\r\n
{t('editjob_priority')}
\r\n
{this.GetJobUrgency()}
\r\n
\r\n {(!this.state.chatbotSetting.hideKeyCollectionOptions) ?\r\n
\r\n
{t('new_ui_pj_lbl_summary_key_collection')}
\r\n {(this.state.isRestrictKeyCollectionForResidentialProperties && this.state.formData.propertyType == 'Residential' && this.state.keyCollectType == 3) ?\r\n \r\n
{t('lbl_propkey_case6')}
\r\n \r\n :\r\n
\r\n {(this.state.keyCollectType == 1) ?
{t('lbl_keycollection_option1')}
\r\n : (this.state.keyCollectType == 2) ?
{t('lbl_keycollection_option2')}
\r\n :
{t('lbl_keycollection_option3')}
\r\n }\r\n
\r\n }\r\n
: ''\r\n }\r\n
\r\n\r\n
\r\n
\r\n this.onSubmitJob(1)} style={this.state.primaryButtonStyle}>{t('new_ui_pj_btn_summary_job_post')} \r\n
\r\n
\r\n
\r\n
\r\n {(this.state.isShowMoreServices) ?\r\n
\r\n
\r\n
Type the service that you need. \r\n
( eg. Electrician )
\r\n
\r\n
\r\n Service \r\n
\r\n
:\r\n
\r\n \r\n\r\n }\r\n {serviceTypes}\r\n {serviceTypeChild}\r\n \r\n
\r\n this.previousStep(index)} style={this.state.secondaryButtonStyle}>{this.state.isFromBot ? t('btn_back') : 'BACK'} \r\n this.nextStep(index)} style={this.state.primaryButtonStyle}>{this.state.isFromBot ? t('btn_next') : 'NEXT'} \r\n
\r\n
\r\n
\r\n
\r\n
\r\n {/* style={{ color: (this.props.customStyle.brand) ? this.props.customStyle.brand : '' }} */}\r\n
\r\n
\r\n
{t('new_ui_pj_hdr_job_response')} \r\n \r\n
\r\n
{t('new_ui_pj_lbl_job_response_ref')} {this.state.jobNumber}
\r\n
\r\n
\r\n
{t('new_ui_pj_lbl_job_response_notice')}
\r\n
\r\n
\r\n
{t('new_ui_pj_lbl_job_response_nxt_step')}
\r\n
\r\n
\r\n
\r\n
\r\n this.backToMainMenu()} className=\"btn btn-primary\" style={this.state.primaryButtonStyle} >{t('new_ui_pj_btn_back_to_menu')} \r\n
\r\n \r\n
\r\n
\r\n
\r\n \r\n
\r\n {/* style={{ color: (this.props.customStyle.brand) ? this.props.customStyle.brand : '' }} */}\r\n
\r\n
\r\n
{t('new_ui_pj_hdr_troubleshoot_response')} \r\n \r\n
\r\n
{t('new_ui_pj_lbl_troubleshoot_response')} \r\n \r\n
\r\n this.backToMainMenu()} className=\"btn btn-primary mx-0\" style={this.state.primaryButtonStyle} >{t('new_ui_pj_btn_back_to_menu')} \r\n
\r\n \r\n
\r\n
\r\n //
\r\n //
\r\n // \r\n // \r\n //
\r\n //
\r\n //
{t('new_ui_pj_hdr_troubleshoot_response')} \r\n // \r\n //
\r\n //
{t('new_ui_pj_lbl_troubleshoot_response')} \r\n // \r\n //
\r\n // this.backToMainMenu()} className=\"btn btn-primary\" style={this.state.primaryButtonStyle} >{t('new_ui_pj_btn_back_to_menu')} \r\n //
\r\n //
\r\n //
\r\n \r\n \r\n
\r\n
\r\n
\r\n
{t('new_ui_pj_lbl_return_home')}
\r\n
\r\n
{t('new_ui_pj_lbl_return_home_confirmation')}
\r\n
\r\n
\r\n
\r\n
\r\n \r\n this.closeReturnHomeConfirmation()}>{t('lbl_attachment_no')} \r\n this.backToMainMenu()} primary>{t('lbl_attachment_yes')} \r\n \r\n \r\n \r\n );\r\n }\r\n\r\n closeReturnHomeConfirmation = () => {\r\n this.setState({\r\n showBackToHomeConfirmation: false\r\n });\r\n }\r\n\r\n backToMainMenu = () => {\r\n this.setState({\r\n showBackToHomeConfirmation: false\r\n });\r\n this.props.backToMainMenu();\r\n }\r\n\r\n handleChatbotScroll = () => {\r\n this.props.scorolToTop();\r\n }\r\n\r\n t() {\r\n return false;\r\n }\r\n\r\n addParentJobTypeToFrequentlyUsedServices = (parentId) => {\r\n let { frequentlyUsedServices, availableServices } = this.state;\r\n let parentJob = _.find(frequentlyUsedServices, f => f.value === parentId);\r\n let selectedNode = _.find(availableServices, f => f.value === parentId);\r\n const { i18n } = this.props;\r\n if (!parentJob) {\r\n let services = frequentlyUsedServices;\r\n let parent = {\r\n label: selectedNode.label,\r\n value: selectedNode.value\r\n }\r\n if (this.state.isFromBot && i18n.language !== \"en\" && !i18n.language.toString().includes(\"en\")) {\r\n\r\n this.applyTranslation(([selectedNode.label]), \"en\", i18n.language).then((trans) => {\r\n if (trans.length > 0) {\r\n parent.label = trans[0];\r\n\r\n services.unshift(parent);\r\n this.setState({\r\n frequentlyUsedServices: services\r\n })\r\n }\r\n });\r\n } else {\r\n services.unshift(parent);\r\n this.setState({\r\n frequentlyUsedServices: services\r\n })\r\n }\r\n\r\n }\r\n }\r\n\r\n}\r\n\r\n\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n try {\r\n return {\r\n jobTypes: state.Jobs.jobTypes,\r\n dateFormat: state.User.dateFormat,\r\n userRoles: state.User.userRoles,\r\n properties: state.Tenant.tenantProperties,\r\n isCurrentTenant: state.Tenant.isCurrentTenant,\r\n };\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n};\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n updateProperties: properties => {\r\n dispatch({ type: \"SET_PROPERTIES\", properties: properties });\r\n },\r\n };\r\n};\r\nexport default connect(mapStateToProps, mapDispatchToProps)(withTranslation()(BotJobPostWizard));","import React, { Component } from 'react';\r\nimport '../../../Layout/LogMaintenanceBotLayout.css';\r\nimport { connect } from 'react-redux';\r\nimport { toast } from 'react-toastify';\r\nimport botService from '../../../../Services/BotService.js';\r\nimport * as _ from 'lodash';\r\nimport { Accordion, ButtonToolbar, Card, ToggleButton, ToggleButtonGroup } from 'react-bootstrap';\r\nimport { Loader } from 'semantic-ui-react';\r\nimport translateService from '../../../../Services/TranslateService';\r\nimport { Tab, Tabs } from \"react-bootstrap\";\r\nclass QandA_Wizard extends React.Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.refProblem = React.createRef();\r\n this.state = {\r\n isCustomThemeEnable: this.props.isCustomThemeEnable,\r\n theme: this.props.theme,\r\n style: this.props.style,\r\n tenantId: this.props.tenantId,\r\n stepFlow: [[0, \"QandAList\"], [1, \"ProblemBox\"], [2, \"FinalSend\"]],\r\n currentStep: 0,\r\n previousStep: 0,\r\n selectedQandAType: '',\r\n selectedQandATypeDisplay: '',\r\n selectedQandATypeNumber: 0,\r\n qandaList: [],\r\n pageSize: 5,\r\n pageNumber: 0,\r\n problem: '',\r\n problemEng: '',\r\n isNotificationSended:false,\r\n assignedPM:{name:'',email:'',contact:''},\r\n sendingNotification:false,\r\n }\r\n }\r\n\r\n\r\n componentDidMount() {\r\n this.LoadQandAForTenant();\r\n this.setTheme();\r\n if(this.props.fromQandAMessege){\r\n this.setState({currentStep :1}); \r\n }\r\n }\r\n\r\n\r\n componentDidUpdate() {\r\n if (this.props.isCustomThemeEnable) {\r\n this.createToggleBtnDynamicStyle();\r\n this.createOkBtnDynamicStyle();\r\n this.createActiveBtnDynamicStyle();\r\n }\r\n }\r\n\r\n\r\n applyTranslation(texts, sourceLng, targetLng) {\r\n const requestModel = {\r\n text: texts,\r\n targetCode: (targetLng == \"en-US\" || targetLng ==\"en-GB\") ? \"en\" : targetLng,\r\n sourceCode: sourceLng\r\n };\r\n \r\n return translateService.translate(requestModel);\r\n }\r\n\r\n\r\n createToggleBtnDynamicStyle() {\r\n const color = this.props.style.optionsStyle.color;\r\n const border = this.props.style.optionsStyle.border;\r\n let labelInsideToggleGroup = document.querySelectorAll('label.btn');\r\n\r\n for (var i = 0; i < labelInsideToggleGroup.length; i++) {\r\n labelInsideToggleGroup[i].style.color = color;\r\n labelInsideToggleGroup[i].style.border = border;\r\n labelInsideToggleGroup[i].style.background = '';\r\n }\r\n }\r\n\r\n\r\n createOkBtnDynamicStyle() {\r\n const color = this.props.style.optionsStyle.color;\r\n let okIcons = document.querySelectorAll('span.ba-icn-ok');\r\n\r\n for (var i = 0; i < okIcons.length; i++) {\r\n okIcons[i].style.background = color;\r\n }\r\n }\r\n\r\n\r\n createActiveBtnDynamicStyle() {\r\n const color = this.props.style.optionsStyle.activeBackground;\r\n let active = document.querySelectorAll('label.btn.active');\r\n for (var i = 0; i < active.length; i++) {\r\n active[i].style.background = color;\r\n }\r\n }\r\n\r\n\r\n LoadQandAForTenant = () => {\r\n var organizationId = this.props.organizationId;\r\n const { i18n } = this.props;\r\n botService.getQandAForTenant(organizationId.trim()).then(result => {\r\n if (result && result.qandAListModel.length > 0) {\r\n var questionList = [];\r\n var answerList = [];\r\n questionList = result.qandAListModel.map(function (value) { return value['question']; });\r\n answerList = result.qandAListModel.map(function (value) { return value['answer']; });\r\n\r\n this.applyTranslation(questionList, \"en\", i18n.language).then(trans => {\r\n if (trans.length > 0) {\r\n result.qandAListModel.map(function (value, index) { return value.question = trans[index] });\r\n }\r\n this.applyTranslation(answerList, \"en\", i18n.language).then(transAns => {\r\n if (transAns.length > 0) {\r\n result.qandAListModel.map(function (value, index) { return value.answer = transAns[index] });\r\n }\r\n this.setState({ qandaList: result.qandAListModel });\r\n });\r\n });\r\n this.handleQandATypeOnChange('General'); \r\n }\r\n }, error => {\r\n });\r\n }\r\n\r\n\r\n addBodyStyle = () => {\r\n var element = document.body;\r\n element.style.cssText = 'overflow:hidden !important;';\r\n element.style.cssText = 'padding-top:0 !important; overflow:hidden !important; background: transparent !important;';\r\n document.documentElement.style.cssText = \"background: transparent !important;\";\r\n }\r\n\r\n\r\n setTheme = () => {\r\n const { style, theme, isCustomThemeEnable } = this.props;\r\n this.setState({\r\n style: style,\r\n theme: theme,\r\n isCustomThemeEnable: isCustomThemeEnable\r\n });\r\n }\r\n\r\n\r\n render() {\r\n const { t, i18n, theme } = this.props;\r\n const currentStepIndex = this.state.currentStep;\r\n let step = this.showCurrentStep(currentStepIndex);\r\n return <>\r\n \r\n {step}\r\n
\r\n \r\n }\r\n\r\n\r\n showCurrentStep = (index) => {\r\n let currentStep = this.state.stepFlow[index][1];\r\n switch (currentStep) {\r\n case \"QandAList\":\r\n return this.getQandAList(index);\r\n case \"ProblemBox\":\r\n if(localStorage.getItem(\"is_bna_bot_session\") == \"TRUE\" && (localStorage.getItem(\"userType\") == 4)){\r\n return this.addProblemBoxtWizard();\r\n }else{\r\n return this.props.authenticate();\r\n }\r\n \r\n case \"FinalSend\":\r\n return this.addFinalSend();\r\n }\r\n }\r\n\r\n\r\n getQandAList = () => {\r\n let qandaList = this.createQandAList();\r\n const { t } = this.props;\r\n let value = 1;\r\n\r\n return \r\n
\r\n \r\n
\r\n this.props.backToMainMenu()} style={this.state.style.secondaryButtonStyle}>{t('new_ui_button_back')} \r\n
\r\n
\r\n
{t('new_ui_qna_lbl_header')} \r\n \r\n
\r\n
\r\n
\r\n
this.handleQandATypeOnChange(k)}>\r\n \r\n \r\n {qandaList}\r\n
\r\n \r\n \r\n \r\n {qandaList}\r\n
\r\n \r\n \r\n \r\n {qandaList}\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n\r\n
\r\n
\r\n \r\n
\r\n {list.map((a, index) => {\r\n return \r\n \r\n {a.question}\r\n \r\n \r\n {a.answer} \r\n \r\n \r\n })\r\n }\r\n \r\n \r\n {(count > 0) ?
this.more()} style={this.state.style.primaryButtonStyle}>{t('qna_lbl_more_qna')}.. :\r\n ''\r\n //
\r\n //
this.showQuestionView()}>{t('new_ui_qna_lbl_did_find_answer_q')}
\r\n //
\r\n }\r\n
\r\n
\r\n
\r\n this.backToQandAList()} style={this.state.style.primaryButtonStyle}>{t('new_ui_button_back')} \r\n
\r\n
\r\n
{t('new_ui_qna_lbl_type_prob')} \r\n \r\n {(!this.state.isNotificationSended)?\r\n <>\r\n
\r\n
\r\n
\r\n this.backToQandAList()} style={this.state.style.primaryButtonStyle}>{t('new_ui_qna_button_cancle')} \r\n this.sendToPropertyManager()} style={this.state.style.primaryButtonStyle}>{t('new_ui_qna_button_send')} \r\n
\r\n
\r\n {(this.state.sendingNotification) ?
: ''}\r\n :\r\n <>\r\n
{t('qna_lbl_pm_details')}
\r\n
{t('qna_lbl_assigned_pm_name')} - {this.state.assignedPM.name}
\r\n
{t('qna_lbl_assigned_pm_email')} - {this.state.assignedPM.email}
\r\n
{t('qna_lbl_assigned_pm_contact_no')} - {this.state.assignedPM.contact}
\r\n }\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
Sent! \r\n \r\n
{t('new_ui_qna_lbl_type_prob_answer')} \r\n
\r\n
\r\n
\r\n this.props.backToMainMenu()} style={this.state.style.secondaryButtonStyle}>{t('new_ui_qna_lbl_back_to_main_chat')} \r\n
\r\n
\r\n {body}\r\n
\r\n \r\n }\r\n\r\n createBody = () => {\r\n const { theme } = this.state;\r\n const { t } = this.props;\r\n let { rentalDetails, currentPropertyName, isRentalDetailFound, leasePeriod, leaseStartDate,\r\n leaseEndDate, rentalAmount, rentalDueDate, arrearsAmount, arrearsDays, paidToDate, isArreasDetailFound } = this.state;\r\n\r\n return \r\n {(isRentalDetailFound) ?\r\n
\r\n
\r\n
{t('new_ui_lbl_rental_header')}{currentPropertyName} \r\n \r\n\r\n
\r\n {(isRentalDetailFound) ?\r\n
\r\n
\r\n
\r\n
\r\n
{t('rd_lbl_rental_lease_period')}
\r\n
{leasePeriod}
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
{t('new_ui_lbl_rental_lease_st_date')}
\r\n
{leaseStartDate}
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
{t('new_ui_lbl_rental_lease_end_date')}
\r\n
{leaseEndDate}
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
{t('new_ui_lbl_rental_amount')}
\r\n
{rentalAmount}
\r\n
\r\n
\r\n
\r\n \r\n :
No rental detail found.
\r\n }\r\n\r\n {(isArreasDetailFound) ?\r\n
\r\n
\r\n
{t('new_ui_lbl_arrears_amount')}
\r\n
${arrearsAmount}
\r\n
\r\n
\r\n
{t('rd_lbl_arrears_days')}
\r\n
{arrearsDays}
\r\n
\r\n
\r\n
{t('rd_lbl_arrears_paid_to_date')}
\r\n
{paidToDate}
\r\n
\r\n
\r\n : \r\n
{t('rd_lbl_no_arrears_found')}
\r\n }\r\n
\r\n\r\n
\r\n this.props.backToMainMenu()} style={this.state.style.secondaryButtonStyle}>{t('new_ui_pj_btn_back_to_menu')} \r\n
\r\n\r\n
\r\n :
No Data Found.
\r\n }\r\n
\r\n {body}\r\n
\r\n \r\n }\r\n createBody = () => {\r\n let { pendingApprovalListVisible, isJobApproval, isActionResultView, totalJobCount } = this.state;\r\n let jobList = this.createOwnerApprovalList();\r\n let jobActionView = this.createPendingApprovalActionView();\r\n let jobActionResultView = this.createActionResultView();\r\n const { t } = this.props;\r\n return \r\n
\r\n
\r\n
{t('ownerapproval_lbl_header')} \r\n {(pendingApprovalListVisible) ?\r\n
\r\n
\r\n
\r\n
{t('ownerapproval_lbl_jobs')} \r\n {t('ownerapproval_lbl_toapprove')} \r\n \r\n
\r\n
{totalJobCount} \r\n \r\n
\r\n {jobList}\r\n
:\r\n (isJobApproval) ?\r\n
\r\n
{t('ownerapproval_lbl_accept_reject_job')}
\r\n {jobActionView}\r\n
:\r\n (isActionResultView) ?\r\n
\r\n {jobActionResultView}\r\n
:\r\n
\r\n
{t('ownerapproval_lbl_no_jobs')}
\r\n
\r\n }\r\n\r\n
\r\n
\r\n
\r\n {(this.state.jobListLoading) ?
\r\n :
\r\n
\r\n {list.map((a, index) => {\r\n return
\r\n \r\n \r\n
{a.title} [#{a.jobNumber}] \r\n
\r\n
\r\n {a.jobVariations.length > 0 ? t('ownerapproval_lbl_variation_approval') : (a.bids.bidsList.length > 0 ? t('ownerapproval_lbl_quote_approval') : t('ownerapproval_lbl_job_approval'))}\r\n
\r\n
\r\n
{t('ownerapproval_lbl_posted_on')} {\" \"}\r\n \r\n {a.postedOn}\r\n \r\n
\r\n \r\n {a.description}\r\n
\r\n \r\n
\r\n
{a.address}
\r\n
\r\n
\r\n
{a.primaryJobTypeDisplay} : {a.secondaryJobTypeDisplay} | {a.jobUrgencyDisplay}
\r\n
\r\n
\r\n
{this.budgetFormatter(a.budgetId, a.budgetAmount, a.budgetMax)}
\r\n
\r\n {a.bids.bidsList.map((b, index) => {\r\n return
\r\n
\r\n
\r\n
{t('ownerapproval_lbl_quoted_by')} {\" \"}{b.name} \r\n ${b.amount.toFixed(2)} \r\n \r\n
\r\n
this.clickJobQuoteAccept(a, b)}>{t('ownerapproval_lbl_accept')} \r\n {(this.state.jobActionProcessing && this.state.selectedBidId == b.bidId) ?
: ''}\r\n
\r\n
\r\n
\r\n })\r\n }\r\n
\r\n {a.jobVariations.map((v, index) => {\r\n return
\r\n
\r\n
{t('ownerapproval_lbl_variation_by')} {\" \"}{v.postedBy} \r\n
\r\n ${v.amount.toFixed(2)} \r\n
\r\n
\r\n
{t('ownerapproval_lbl_on')} {\" \"}\r\n \r\n {v.createdDate}\r\n \r\n
\r\n
\r\n {v.description}\r\n
\r\n {v.jobVariationAttachments.length > 0 ? (
\r\n \r\n
) : ''\r\n }\r\n\r\n
\r\n })\r\n }\r\n
\r\n this.onJobApproveRejectClick(false, a)}>\r\n {t('ownerapproval_lbl_reject')}{\" \"}\r\n \r\n this.onJobApproveRejectClick(true, a)}>\r\n {t('ownerapproval_lbl_approve')}{\" \"}\r\n \r\n
\r\n ) : (a.bids.bidsList.length > 0 && a.jobVariations.length == 0) ? (\r\n \r\n
\r\n
this.clickJobDeclineAllQuotes(a)}>{t('ownerapproval_lbl_decline_quotes')} \r\n {(this.state.jobActionProcessing && this.state.selectedJobId == a.id) ?
: ''}\r\n
\r\n\r\n
\r\n \r\n })\r\n }\r\n
\r\n
\r\n }\r\n
this.props.backToMainMenu()} style={this.state.style.secondaryButtonStyle}>{t('ownerapproval_lbl_back_to_main_chat')} \r\n
\r\n
\r\n
\r\n \r\n \r\n
{isJobAcceptClick ? t('ownerapproval_lbl_accept') : t('ownerapproval_lbl_reject')} {t('ownerapproval_lbl_job')} {t('ownerapproval_lbl_approval')} : #{selectedJobNumber} \r\n \r\n \r\n {t('ownerapproval_lbl_reason_for')} {isJobAcceptClick ? t('ownerapproval_lbl_approval') : t('ownerapproval_lbl_rejection')} \r\n \r\n
\r\n {isJobAcceptClick ? (\r\n
this.clickJobApproveRejectAction(true)}>\r\n {t('ownerapproval_lbl_approve')}{\" \"}\r\n \r\n {(this.state.jobActionProcessing) ?
: ''}\r\n\r\n
\r\n
this.clickJobApproveRejectAction(false)}>\r\n {t('ownerapproval_lbl_reject')}{\" \"}\r\n \r\n {(this.state.jobActionProcessing) ?
: ''}\r\n\r\n
\r\n \r\n
\r\n
this.backToPendingApprovalList()} style={this.state.style.secondaryButtonStyle}>{t('ownerapproval_lbl_back_to_job_list')} \r\n
this.props.backToMainMenu()} style={this.state.style.secondaryButtonStyle}>{t('ownerapproval_lbl_back_to_main_chat')} \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {isSuccessActionResult ? <>\r\n {isQuoteAcceptClick ? (
\r\n
{t('ownerapproval_lbl_success_accept_quote')} \r\n ) : isDeclineAllQuotesClick ? (
\r\n
{t('ownerapproval_lbl_success_decline_quotes')} \r\n ) : (
\r\n
{t('ownerapproval_lbl_you_have_successfully')} {isJobAcceptClick ? t('ownerapproval_lbl_approved') : t('ownerapproval_lbl_rejected')} {t('ownerapproval_lbl_the_job')} \r\n )\r\n }\r\n : <>\r\n {isQuoteAcceptClick ? (
\r\n
{t('ownerapproval_lbl_quote_accept_failed')} \r\n ) : isDeclineAllQuotesClick ? (
\r\n
{t('ownerapproval_lbl_quotes_decline_failed')} \r\n ) : (
\r\n
{t('ownerapproval_lbl_job')} {isJobAcceptClick ? t('ownerapproval_lbl_approval') : t('ownerapproval_lbl_rejection')} {t('ownerapproval_lbl_failed')} \r\n )\r\n }\r\n \r\n }\r\n
\r\n {selectedJobTitle} [#{selectedJobNumber}] \r\n
\r\n
\r\n
\r\n
\r\n
this.backToPendingApprovalList()} style={this.state.style.secondaryButtonStyle}>{t('ownerapproval_lbl_back_to_job_list')} \r\n
this.props.backToMainMenu()} style={this.state.style.secondaryButtonStyle}>{t('ownerapproval_lbl_back_to_main_chat')} \r\n
Other
;\r\n case 1:\r\n return Under $500
;\r\n case 2:\r\n return Between $500 - $1000
;\r\n case 3:\r\n return Between $1000 - $2000
;\r\n case 4:\r\n return Between $2000 - $5000
;\r\n case 5:\r\n return Over $5000
;\r\n case 7:\r\n return (\r\n \r\n {\" \"}\r\n {\"$ \" + budgetAmount} - {\"$ \" + budgetMax}\r\n
\r\n );\r\n case -999:\r\n return (\r\n \r\n {\" \"}\r\n {budgetAmount == 0\r\n ? \"Not supplied\"\r\n : \"$ \" + budgetAmount.toFixed(2)}\r\n
\r\n );\r\n }\r\n }\r\n\r\n onJobApproveRejectClick = (isApprove, job) => {\r\n this.setState({\r\n isJobApproval: true,\r\n pendingApprovalListVisible: false,\r\n isJobAcceptClick: isApprove,\r\n selectedJobId: job.id,\r\n selectedJobNumber: job.jobNumber,\r\n selectedJobTitle: job.title\r\n });\r\n }\r\n\r\n handleOnChangeActionReason = (event) => {\r\n this.setState({ actionReason: event.currentTarget.value });\r\n }\r\n\r\n clickJobApproveRejectAction = (isApprove) => {\r\n this.setState({ jobActionProcessing: true });\r\n var userId = this.props.ownerId;\r\n var jobId = this.state.selectedJobId;\r\n var note = this.state.actionReason;\r\n botService.ownerApproveRejectJob(userId, jobId, note, isApprove).then(res => {\r\n if (res) {\r\n this.setState({\r\n jobActionProcessing: false,\r\n isJobApproval: false,\r\n isSuccessActionResult: true,\r\n isActionResultView: true\r\n });\r\n }\r\n else {\r\n this.setState({\r\n jobActionProcessing: false,\r\n isJobApproval: false,\r\n isSuccessActionResult: false,\r\n isActionResultView: true\r\n });\r\n }\r\n }, error => {\r\n });\r\n }\r\n\r\n clickJobQuoteAccept = (job, bid) => {\r\n this.setState({ jobActionProcessing: true, isQuoteAcceptClick: true, selectedBidId: bid.bidId, selectedJobNumber: job.jobNumber, selectedJobTitle: job.title });\r\n var userId = this.props.ownerId;\r\n var jobId = job.id;\r\n var quoteId = bid.bidId;\r\n var note = '';\r\n botService.ownerAcceptJobQuote(quoteId, userId, jobId, note).then(res => {\r\n if (res) {\r\n this.setState({\r\n jobActionProcessing: false,\r\n pendingApprovalListVisible: false,\r\n isSuccessActionResult: true,\r\n isActionResultView: true\r\n });\r\n }\r\n else {\r\n this.setState({\r\n jobActionProcessing: false,\r\n pendingApprovalListVisible: false,\r\n isSuccessActionResult: false,\r\n isActionResultView: true\r\n });\r\n }\r\n }, error => {\r\n });\r\n }\r\n\r\n clickJobDeclineAllQuotes = (job) => {\r\n this.setState({ jobActionProcessing: true, isDeclineAllQuotesClick: true, selectedJobId: job.id, selectedJobNumber: job.jobNumber, selectedJobTitle: job.title });\r\n var userId = this.props.ownerId;\r\n var jobId = job.id;\r\n var note = '';\r\n botService.ownerDeclineAllJobQuotes(userId, jobId, note).then(res => {\r\n if (res) {\r\n this.setState({\r\n jobActionProcessing: false,\r\n pendingApprovalListVisible: false,\r\n isSuccessActionResult: true,\r\n isActionResultView: true\r\n });\r\n }\r\n else {\r\n this.setState({\r\n jobActionProcessing: false,\r\n pendingApprovalListVisible: false,\r\n isSuccessActionResult: false,\r\n isActionResultView: true\r\n });\r\n }\r\n }, error => {\r\n });\r\n }\r\n\r\n}\r\n\r\n\r\nexport default connect()(OwnerApprovals_Wizard);","import React, { Component } from 'react';\r\nimport botService from '../../../Services/BotService';\r\nimport { AppConfiguration } from \"read-appsettings-json\";\r\nimport { AXIOS } from '../../../Utilities/HttpRequest/Axios.js';\r\nimport Loader from \"react-loader-spinner\";\r\nimport { ButtonToolbar, ToggleButton, ToggleButtonGroup } from \"react-bootstrap\";\r\nimport '../../Layout/LogMaintenanceBotLayout.css';\r\nimport JobPostWizard from '../../Common/JobPostWizard/JobPostWizard';\r\nimport { connect } from 'react-redux';\r\nimport userService from '../../../Services/UserService';\r\nimport { ChatbotOptionType, MasterDataType, ChatbotLanguageOptionType } from '../../../Constants/Enums';\r\nimport PouchDbService from '../../../Services/PouchDbService';\r\nimport { toast } from 'react-toastify';\r\nimport { Form } from 'react-bootstrap';\r\nimport BotJobPostWizard from './JobPost/BotJobPost_Wizard';\r\nimport QandA_Wizard from './QandA/QandA_Wizard';\r\nimport RentalDetailsWizard from './RentalDetails/RentalDetailsWizard';\r\nimport OwnerApprovals_Wizard from './OwnerApprovals/OwnerApprovals_Wizard';\r\nimport { withTranslation } from 'react-i18next';\r\nimport propertyService from '../../../Services/PropertyService';\r\nimport translateService from '../../../Services/TranslateService';\r\nimport TrackIssueWizard from './TrackIssue/TrackIssueWizard'\r\nclass LogMaintenanceBot extends React.Component {\r\n\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n hasMultipleProperty: false,\r\n properties: [],\r\n userName: '',\r\n stepFlow: [[0, \"mainMenu\"], [1, \"mobileVerification\"], [2, \"confirmOTP\"], [3, \"propertySelect\"], [4, \"selectLogMaintenance\"], [5, \"selectTrackIssue\"], [6, \"selectRentalStatus\"], [7, \"selectQnA\"], [8, \"selectOwnerLogin\"]],\r\n currentStep: 0,\r\n previousStep: 0,\r\n mobileNumberInput: \"\",\r\n emailAddressInput: \"\",\r\n otpDigit1: \"\",\r\n otpDigit2: \"\",\r\n otpDigit3: \"\",\r\n otpDigit4: \"\",\r\n showInvalidMobileError: false,\r\n showInvalidEmailError: false,\r\n showNoAssociatedPropertyError: false,\r\n showCannotProcessError: false,\r\n showInvalidOTPError: false,\r\n isMobileAuthentication: false,\r\n showSwitchAuthentication: false,\r\n showTimer: true,\r\n time: {},\r\n seconds: 120,\r\n enableResendOTP: false,\r\n remainingOTPAttempts: 3,\r\n loading: false,\r\n isUserExist: true,\r\n chatbotKey: \"1234\",\r\n tenantDetail: [],\r\n isBotTyping: false,\r\n isBotStep: true,\r\n isUserStep: false,\r\n mobileNumber: \"\",\r\n emailAddress: \"\",\r\n chatBody: [],\r\n botSteps: this.getBotSteps(),\r\n currentBotStep: 0,\r\n userSteps: this.getUserSteps(),\r\n currentUserStep: 0,\r\n selectedProperty: {},\r\n footerValue: \"\",\r\n verificationCode: \"\",\r\n isCustomThemeEnable: this.props.isCustomThemeEnable,\r\n theme: this.props.theme,\r\n style: this.props.style,\r\n userDetails: {\r\n applicationUserCountryId: '',\r\n applicationUserId: '',\r\n encryptedUserId: ''\r\n },\r\n jobTypes: [],\r\n botErrorMsg: '',\r\n showError: false,\r\n isLogMaintenance: false,\r\n isCheckRental: false,\r\n isQandA: false,\r\n isOwnerLogin: false,\r\n isTrackIssue: false,\r\n optionSelected: false,\r\n country: this.props.country,\r\n currentLang: 'en',\r\n chatbotSetting: this.props.chatbotSetting ? this.props.chatbotSetting : {\r\n hideQandABot: false,\r\n hideCheckRentalStatus: false,\r\n hideKeyCollectionOptions: false,\r\n hideTroubleshootGuide: false,\r\n enableDraftJobFeature: false,\r\n linkedAgencies: []\r\n },\r\n propertyList: [],\r\n fromQandAMessege: false\r\n }\r\n\r\n this.timer = 0;\r\n this.startTimer = this.startTimer.bind(this);\r\n this.countDown = this.countDown.bind(this);\r\n }\r\n chatContainer = React.createRef();\r\n mainViewContainer = React.createRef();\r\n jobPostContainer = React.createRef();\r\n qAndAContainer = React.createRef();\r\n ownerLoginContainer = React.createRef();\r\n trackIssueContainer = React.createRef();\r\n mobileNumberField = React.createRef();\r\n otpDigit1Ref = React.createRef();\r\n otpDigit2Ref = React.createRef();\r\n otpDigit3Ref = React.createRef();\r\n otpDigit4Ref = React.createRef();\r\n\r\n notifyError = (msg) => {\r\n toast.error(msg, {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n }\r\n componentDidMount() {\r\n localStorage.setItem(\"is_bna_bot_session\", \"FALSE\");\r\n this.setTheme();\r\n //this.cretateMsg();\r\n this.addBodyStyle();\r\n // setTimeout(() => {\r\n // this.GetTenantPropertiesByUserId();\r\n // }, 1000);\r\n let timeLeftVar = this.secondsToTime(this.state.seconds);\r\n this.setState({ time: timeLeftVar });\r\n }\r\n\r\n componentDidUpdate() {\r\n if (this.state.isLogMaintenance) {\r\n this.scrollToJobPost();\r\n } else if (this.state.isQandA) {\r\n this.scrollToQandA();\r\n } else if (this.state.isOwnerLogin) {\r\n this.scrollToOwnerLogin();\r\n } else if (this.state.isTrackIssue) {\r\n this.scrollToTrackIssue();\r\n }\r\n }\r\n\r\n addBodyStyle = () => {\r\n var element = document.body;\r\n element.style.cssText = 'overflow:hidden !important;';\r\n element.style.cssText = 'padding-top:0 !important; overflow:hidden !important; background: transparent !important; padding-bottom:0 !important;';\r\n document.documentElement.style.cssText = \"background: transparent !important;\";\r\n\r\n }\r\n setTheme = () => {\r\n const { style, theme, isCustomThemeEnable } = this.props;\r\n this.setState({\r\n style: style,\r\n theme: theme,\r\n isCustomThemeEnable: isCustomThemeEnable\r\n });\r\n }\r\n\r\n scrollToMyRef = () => {\r\n let jobPostHeight = (this.jobPostContainer.current && this.jobPostContainer.current.clientHeight) ? this.jobPostContainer.current.clientHeight : 0;\r\n if (jobPostHeight == 0) {\r\n const scroll =\r\n this.mainViewContainer.current.scrollHeight -\r\n this.mainViewContainer.current.clientHeight;\r\n this.mainViewContainer.current.scrollTo(0, scroll);\r\n }\r\n };\r\n\r\n\r\n applyTranslation(texts, sourceLng, targetLng) {\r\n const requestModel = {\r\n text: texts,\r\n targetCode: (targetLng == \"en-US\" || targetLng == \"en-GB\") ? \"en\" : targetLng,\r\n sourceCode: sourceLng\r\n };\r\n\r\n return translateService.translate(requestModel);\r\n }\r\n GetTenantPropertiesByUserId = () => {\r\n let none = [{ propertyId: 0, propertyName: '--None--', suburbId: '', location: '', address: '', propertyType: 'Residential' }];\r\n\r\n this.setState({ isPropertiesLoading: true });\r\n let properties;\r\n let propertyNames = [];\r\n const { i18n } = this.props;\r\n\r\n propertyService.GetTenantPropertiesByUserId()\r\n .then((res) => {\r\n properties = res.properties;\r\n if (res.properties.length > 0) {\r\n\r\n properties.forEach(x => {\r\n propertyNames.push(x.address ? x.address : \" \");\r\n });\r\n\r\n this.applyTranslation(([propertyNames]), \"en\", i18n.language).then((trans) => {\r\n if (trans.length > 0) {\r\n trans.forEach((x, i) => {\r\n properties[i].address = trans[i];\r\n });\r\n }\r\n\r\n this.setState({\r\n propertyList: properties,\r\n propertyId: properties[0].propertyId\r\n });\r\n this.getPropertyDetailsByPropertyId(properties[0].propertyId);\r\n this.setState({ isPropertiesLoading: false });\r\n });\r\n\r\n\r\n } else {\r\n this.setState({\r\n propertyList: [],\r\n propertyId: 0\r\n });\r\n //this.onChangeJobType(1);\r\n }\r\n });\r\n }\r\n\r\n getPropertyDetailsByPropertyId = (propertyId) => {\r\n const selectedProperty = this.state.propertyList.filter(a => a.propertyId == propertyId);\r\n if (selectedProperty && selectedProperty.length > 0 && selectedProperty[0].propertyId != null) {\r\n this.setState({\r\n propertyId: propertyId,\r\n //locationDetails: {},\r\n formData: {\r\n address: selectedProperty[0].address,\r\n location: selectedProperty[0].location,\r\n propertyId: selectedProperty[0].propertyId,\r\n propertyName: selectedProperty[0].propertyName,\r\n suburbId: selectedProperty[0].suburbId,\r\n propertyType: selectedProperty[0].propertyType\r\n },\r\n locationDetails: selectedProperty[0],\r\n jobForMe: {\r\n propertyType: selectedProperty[0].propertyType,\r\n address: selectedProperty[0].address,\r\n latitude: selectedProperty[0].latitude,\r\n location: selectedProperty[0].location,\r\n longitude: selectedProperty[0].longitude,\r\n placeId: selectedProperty[0].placeId,\r\n suburbId: selectedProperty[0].suburbId,\r\n },\r\n });\r\n //this.getOrganizationSettings(selectedProperty[0].orgnizationId);\r\n } else {\r\n this.setState({\r\n propertyId: null,\r\n locationDetails: {},\r\n formData: {\r\n address: '',\r\n location: '',\r\n propertyId: null,\r\n propertyName: '',\r\n suburbId: null,\r\n propertyType: ''\r\n }\r\n });\r\n }\r\n setTimeout(() => {\r\n if (this.state.isJobForMe == 1) {\r\n this.setState({ keyCollectType: 1 });\r\n }\r\n }, 500);\r\n }\r\n\r\n secondsToTime(secs) {\r\n let hours = Math.floor(secs / (60 * 60));\r\n\r\n let divisor_for_minutes = secs % (60 * 60);\r\n let minutes = Math.floor(divisor_for_minutes / 60);\r\n\r\n let divisor_for_seconds = divisor_for_minutes % 60;\r\n let seconds = Math.ceil(divisor_for_seconds);\r\n\r\n let obj = {\r\n \"h\": hours,\r\n \"m\": minutes,\r\n \"s\": seconds\r\n };\r\n return obj;\r\n }\r\n\r\n countDown() {\r\n let seconds = this.state.seconds - 1;\r\n this.setState({\r\n time: this.secondsToTime(seconds),\r\n seconds: seconds,\r\n });\r\n\r\n if (seconds == 0) {\r\n clearInterval(this.timer);\r\n this.timeLimitReachAction();\r\n }\r\n }\r\n\r\n startTimer() {\r\n this.setState({\r\n seconds: 120\r\n });\r\n\r\n this.timer = 0;\r\n this.timer = setInterval(this.countDown, 1000);\r\n\r\n }\r\n\r\n stopTimer() {\r\n clearInterval(this.timer);\r\n }\r\n\r\n timeLimitReachAction() {\r\n let currentStep = this.state.currentStep;\r\n switch (currentStep) {\r\n case 1:\r\n this.setState({\r\n showSwitchAuthentication: true\r\n });\r\n break;\r\n case 2:\r\n this.setState({\r\n enableResendOTP: true\r\n });\r\n\r\n break;\r\n }\r\n }\r\n\r\n scrollToJobPost = () => {\r\n let jobPostHeight = (this.jobPostContainer.current && this.jobPostContainer.current.clientHeight) ? this.jobPostContainer.current.clientHeight : 0;\r\n if (jobPostHeight > 0) {\r\n let fullHeight = this.mainViewContainer.current.scrollHeight;\r\n let viewHeight = fullHeight - jobPostHeight;\r\n this.mainViewContainer.current.scrollTo(0, viewHeight);\r\n }\r\n }\r\n\r\n scrollToQandA = () => {\r\n let qAndA = (this.qAndAContainer.current && this.qAndAContainer.current.clientHeight) ? this.qAndAContainer.current.clientHeight : 0;\r\n if (qAndA > 0) {\r\n let fullHeight = this.mainViewContainer.current.scrollHeight;\r\n let viewHeight = fullHeight - qAndA;\r\n this.mainViewContainer.current.scrollTo(0, viewHeight);\r\n }\r\n }\r\n\r\n scrollToOwnerLogin = () => {\r\n let ownerLogin = (this.ownerLoginContainer.current && this.ownerLoginContainer.current.clientHeight) ? this.ownerLoginContainer.current.clientHeight : 0;\r\n if (ownerLogin > 0) {\r\n let fullHeight = this.mainViewContainer.current.scrollHeight;\r\n let viewHeight = fullHeight - ownerLogin;\r\n this.mainViewContainer.current.scrollTo(0, viewHeight);\r\n }\r\n }\r\n\r\n scrollToTrackIssue = () => {\r\n let trackIssue = (this.trackIssueContainer.current && this.trackIssueContainer.current.clientHeight) ? this.trackIssueContainer.current.clientHeight : 0;\r\n if (trackIssue > 0) {\r\n let fullHeight = this.mainViewContainer.current.scrollHeight;\r\n let viewHeight = fullHeight - trackIssue;\r\n this.mainViewContainer.current.scrollTo(0, viewHeight);\r\n }\r\n }\r\n\r\n\r\n render() {\r\n const { t, i18n, theme } = this.props;\r\n const currentStepIndex = this.state.currentStep;\r\n let step = this.showCurrentStep(currentStepIndex);\r\n return (\r\n );\r\n //let body = this.createBody();\r\n //let footer = this.createFotter();\r\n //return <>\r\n // {body}\r\n // {footer}\r\n //\r\n }\r\n\r\n showCurrentStep = (index) => {\r\n let currentStep = this.state.stepFlow[index][1];\r\n switch (currentStep) {\r\n case \"mainMenu\":\r\n return this.getMainMenu(index);\r\n case \"mobileVerification\":\r\n return this.getMobileAuthentication(index);\r\n case \"confirmOTP\":\r\n return this.getMobileOTPVerification(index);\r\n case \"propertySelect\":\r\n return this.selectPropertyStep(index);\r\n case \"selectLogMaintenance\":\r\n return this.addJobPostWizard();\r\n case \"selectTrackIssue\":\r\n return this.addTrackIssueWizard();\r\n case \"selectRentalStatus\":\r\n return this.addCheckRentalWizard();\r\n case \"selectQnA\":\r\n return this.addQandAWizard();\r\n case \"selectOwnerLogin\":\r\n return this.addOwnerApprovalWizard();\r\n }\r\n }\r\n\r\n getMainMenu = (index) => {\r\n const { chatBody } = this.state;\r\n const { style } = this.props;\r\n const { t } = this.props;\r\n\r\n return (\r\n \r\n
\r\n
\r\n
{t('new_ui_hdr_welcome')} \r\n
{t('new_ui_hdr_bna')} \r\n
{t('new_ui_lbl_how_can_i_help')}
\r\n
\r\n
\r\n
\r\n
\r\n {(this.state.isMobileAuthentication) ?\r\n
\r\n
\r\n
\r\n
\r\n
{t('new_ui_hdr_mobile_verification')} \r\n {t('new_ui_lbl_mobile_verification')} \r\n \r\n\r\n
\r\n
\r\n {(this.state.showInvalidMobileError) ? \r\n
\r\n
\r\n
{t('cb_step4_message')}
\r\n
\r\n : ''}\r\n {(this.state.showNoAssociatedPropertyError) ? \r\n
\r\n
\r\n
{t('new_ui_lbl_no_property_message')} {this.state.mobileNumberInput}
\r\n
\r\n : ''}\r\n {(this.state.showCannotProcessError) ? \r\n
\r\n
\r\n
{t('cb_step5_message')}
\r\n
\r\n : ''}\r\n
\r\n
\r\n
\r\n
\r\n :
\r\n
\r\n
\r\n
\r\n
{t('new_ui_hdr_mobile_verification')} \r\n {t('new_ui_lbl_email_verification')} \r\n \r\n\r\n
\r\n
\r\n {(this.state.showInvalidEmailError) ? \r\n
\r\n
\r\n
{t('new_ui_error_invalid_email')}
\r\n
\r\n : ''}\r\n {(this.state.showNoAssociatedPropertyError) ? \r\n
\r\n
\r\n
{t('new_ui_lbl_no_property_message')} {this.state.emailAddressInput}.
\r\n
{t('new_ui_error_no_property')}
\r\n
\r\n : ''}\r\n {(this.state.showCannotProcessError) ? \r\n
\r\n
\r\n
{t('cb_step5_message')}
\r\n
\r\n : ''}\r\n
\r\n
\r\n
\r\n
}\r\n
\r\n
\r\n
\r\n this.goBackStep(1)}>{t('btn_back')} \r\n
\r\n
\r\n
{t('new_ui_hdr_mobile_verification')} \r\n
{t('new_ui_lbl_enter_otp')} {(isMobileAuthentication) ? mobileNumber : emailAddress}
\r\n
\r\n\r\n
\r\n
\r\n {(this.state.showInvalidOTPError) ?
{resendPinHeader}
: ''}\r\n {(this.state.showTimer) ?
{this.state.time.m}:{this.state.time.s}
: ''}\r\n
\r\n
\r\n
\r\n
\r\n {chatBody}\r\n
\r\n
\r\n
\r\n {(this.state.showError) ?
{this.state.botErrorMsg}
: ''}\r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n
{message}
\r\n
\r\n
\r\n
\r\n
\r\n
{input}
\r\n
\r\n {(jobTypes.length > 1) ?
this.backToList(event)}\r\n isJobEdit={false}\r\n jobEditid=\"\"\r\n customStyle={style}\r\n isFromBot={true}\r\n isTrackIssue={false}\r\n isCurrentTenant={true}\r\n isCustomThemeEnable={this.state.isCustomThemeEnable}\r\n resetChat={() => this.resetChat()}\r\n scorolToTop={() => this.scrollToJobPost()}\r\n backToMainMenu={() => this.directToMainMenu()}\r\n showChatbotError={(msg) => this.showError(msg)}\r\n chatbotSetting={this.state.chatbotSetting}>\r\n \r\n :\r\n
}\r\n\r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n
\r\n
{t('cb_lbl_resend_pin_header')}
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
{userSelect}
\r\n
\r\n this.directToMainMenu()}\r\n t={this.props.t}\r\n i18n={this.props.i18n}\r\n authenticate = {() => this.rederectToAuthenticate()}\r\n fromQandAMessege ={fromQandAMessege}>\r\n \r\n
);\r\n\r\n }\r\n\r\n rederectToAuthenticate(){\r\n this.setState({\r\n currentStep: 1,\r\n });\r\n }\r\n\r\n addCheckRentalWizard = () => {\r\n const { chatBody, style, theme, isCustomThemeEnable, userDetails } = this.state;\r\n return (\r\n \r\n this.directToMainMenu()}\r\n t={this.props.t}\r\n i18n={this.props.i18n}\r\n propertyName={this.state.formData.propertyName}\r\n propertyId={this.state.propertyId}>\r\n \r\n
);\r\n\r\n }\r\n\r\n addTrackIssueWizard = () => {\r\n const { chatBody, style, theme, isCustomThemeEnable, userDetails,propertyId } = this.state;\r\n return (\r\n \r\n this.backToList(event)}\r\n tenantId={userDetails.applicationUserId}\r\n theme={theme}\r\n style={style}\r\n isCustomThemeEnable={isCustomThemeEnable}\r\n backToMainMenu={() => this.directToMainMenu()}\r\n t={this.props.t}\r\n i18n={this.props.i18n}\r\n propertyId={propertyId}\r\n showChatbotError={(msg) => this.showError(msg)}>\r\n \r\n\r\n {/*
);\r\n\r\n }\r\n\r\n addOwnerApprovalWizard = () => {\r\n const { chatBody, style, theme, isCustomThemeEnable, userDetails } = this.state;\r\n const { organizationId } = this.props;\r\n return (\r\n \r\n this.directToMainMenu()}\r\n scrollToWizardHeight={() => this.scrollToOwnerLogin()}\r\n t={this.props.t}\r\n i18n={this.props.i18n}>\r\n \r\n
);\r\n\r\n }\r\n\r\n\r\n\r\n selectPropertyStep = (index) => {\r\n const { propertyList, propertyId, isJobForMe, jobForMe, formData, isPropertyOwner } = this.state;\r\n const forMeText = this.state.isJobForMeText;\r\n const { t } = this.props;\r\n return (\r\n \r\n
\r\n
\r\n
\r\n
{t('new_ui_pj_lbl_prop_select')} \r\n \r\n\r\n
\r\n {(this.state.isPropertiesLoading) ?
: ''}\r\n {(!this.state.isPropertiesLoading) ?
\r\n 0 ) ? propertyList[0].propertyId : \"\"}\r\n onChange={(value) => { this.handlePropertyChange(value) }}>\r\n {propertyList.map((a, index) => {\r\n return {a.address} \r\n :<>}\r\n
\r\n\r\n
\r\n
\r\n
\r\n this.nextStep()} style={this.state.primaryButtonStyle}>{t('new_ui_pj_btn_continue')} \r\n
\r\n\r\n
\r\n {/*
*/}\r\n
\r\n
\r\n
\r\n
\r\n {/*
{theme.header} */}\r\n
\r\n {(isCustomThemeEnable!='')?\r\n
this.setLanguageSelection(option)}\r\n >:\"\"}\r\n \r\n {(!isLanguageInitialized && !isMenuOptionSelected) ?
\r\n
\r\n : ''\r\n }\r\n
\r\n }\r\n\r\n getChatbotSettings=()=>{\r\n let {orgId}=this.props;\r\n if(orgId){\r\n botService.getChatbotSettings(orgId).then(result => {\r\n if(result.chatbotSettingsModel){\r\n let newTheme ={\r\n header:(result.chatbotSettingsModel.chatbotHeader!=null)?result.chatbotSettingsModel.chatbotHeader:'',\r\n primaryColor : (result.chatbotSettingsModel.chatbotPrimaryColor!=null)?result.chatbotSettingsModel.chatbotPrimaryColor:'', \r\n }\r\n let style={}\r\n if(result.chatbotSettingsModel.chatbotPrimaryColor){\r\n style ={\r\n brand:newTheme.primaryColor,\r\n brandBackground:newTheme.primaryColor+\"33\",\r\n headerBackground:{backgroundColor:newTheme.primaryColor},\r\n primaryButtonStyle:{\r\n backgroundColor:newTheme.primaryColor,\r\n border: \"1px solid \"+newTheme.primaryColor\r\n },\r\n secondaryButtonStyle:{\r\n color:newTheme.primaryColor,\r\n backgroundColor:newTheme.primaryColor+\"33\",\r\n border: \"1px solid \"+newTheme.primaryColor\r\n },\r\n optionsStyle:{\r\n border: \"1px solid \"+newTheme.primaryColor,\r\n color: newTheme.primaryColor,\r\n activeBackground:newTheme.primaryColor+\"33\"\r\n },\r\n isCustomThemeEnable: (result.chatbotSettingsModel.chatbotPrimaryColor!=null || result.chatbotSettingsModel.chatbotPrimaryColor!='')?true:false\r\n } \r\n }\r\n \r\n var setting = {\r\n countryCode:result.chatbotSettingsModel.countryCode,\r\n callingCode:result.chatbotSettingsModel.callingCode,\r\n };\r\n\r\n var chatbotSetting = {\r\n hideQandABot:result.chatbotSettingsModel.hideQandABot,\r\n hideCheckRentalStatus:result.chatbotSettingsModel.hideCheckRentalStatus,\r\n hideKeyCollectionOptions:result.chatbotSettingsModel.hideKeyCollectionOptions,\r\n hideTroubleshootGuide:result.chatbotSettingsModel.hideTroubleshootGuide,\r\n enableAIPoweredTroubleshootGuide:result.chatbotSettingsModel.enableAIPoweredTroubleshootGuide,\r\n enableDraftJobFeature:result.chatbotSettingsModel.enableDraftJobFeature,\r\n defaultKeyCollectionOption:result.chatbotSettingsModel.defaultKeyCollectionOption,\r\n linkedAgencies: (result.chatbotSettingsModel.linkedAgencies != undefined && result.chatbotSettingsModel.linkedAgencies != null) ? result.chatbotSettingsModel.linkedAgencies:[],\r\n };\r\n\r\n this.setState({\r\n isCustomThemeEnable: (result.chatbotSettingsModel.chatbotPrimaryColor!=null || result.chatbotSettingsModel.chatbotPrimaryColor!='')?true:false,\r\n theme : newTheme,\r\n style:style,\r\n countrySetting:setting,\r\n chatbotSetting:chatbotSetting\r\n });\r\n\r\n }else{\r\n this.setState({\r\n isCustomThemeEnable: false,\r\n });\r\n }\r\n }, error => {\r\n console.log(error);\r\n })\r\n }\r\n }\r\n\r\n setLanguageSelection = (option) => {\r\n this.setState({ isMenuOptionSelected: option });\r\n }\r\n\r\n\r\n addBodyStyle=()=>{\r\n var element = document.body;\r\n element.style.cssText = 'overflow:hidden !important;';\r\n element.style.cssText = 'padding-top:0 !important; overflow:hidden !important; background: transparent !important;';\r\n document.documentElement.style.cssText = \"background: transparent !important;\";\r\n }\r\n\r\n handleLanguageChange= (event, props)=>{\r\n const {t,i18n,i18next}=this.props;\r\n i18n.changeLanguage(props.value);\r\n this.setState({lang:props.value});\r\n this.props.passLanguageChange(props.value);\r\n }\r\n\r\n}\r\n\r\nexport default withTranslation()(LogMaintenanceBotLayout);","import React, { Suspense } from 'react';\r\nimport { connect } from \"react-redux\";\r\n//import \"./Styles/style.scss\";\r\nimport LogMaintenanceBotLayout from \"./Components/Layout/LogMaintenanceBotLayout\";\r\nimport botService from './Services/BotService';\r\nimport { withTranslation } from 'react-i18next';\r\n\r\n\r\nclass LogMaintenanceBotApp extends React.Component {\r\n\r\n state = {\r\n themeColor: this.props.themeColor,\r\n theme: {\r\n header: '',\r\n primaryColor: this.props.themeColor\r\n },\r\n headerBackground: { backgroundColor: this.props.themeColor },\r\n orgId: this.props.orgId,\r\n hasMultipleProperty:false,\r\n properties:[],\r\n userName:'' ,\r\n lang: (this.props.i18n.language == \"en-US\" || this.props.i18n.language == \"en-GB\" || this.props.i18n.language == undefined || this.props.i18n.language == null) ? \"en\" : this.props.i18n.language,\r\n isLanguageInitialized: false,\r\n linkedAgencies: [],\r\n isMultipleAgenciesExist: false,\r\n isPrefferedAgencySelected: false\r\n }\r\n\r\n constructor(props) {\r\n super(props);\r\n this.getChatbotSettings();\r\n }\r\n componentDidMount() {\r\n \r\n }\r\n shouldComponentUpdate (nextProps, nextState){\r\n return true;\r\n }\r\n render() {\r\n const { t } = this.props;\r\n var y = this.state;\r\n return (\r\n
\r\n Loading...
}>\r\n {this.state.isMultipleAgenciesExist && !this.state.isPrefferedAgencySelected ? \r\n
\r\n
\r\n
\r\n
{this.state.theme.header} \r\n \r\n
Please Select your Agency \r\n
\r\n
\r\n
\r\n :
this.passLanguageChange(lang)}\r\n lang={this.state.lang}\r\n isLanguageInitialized={this.state.isLanguageInitialized} />\r\n }\r\n \r\n ]*>/g,\"\"),\r\n attachments: imageArray,\r\n isLoading: false\r\n });\r\n }\r\n });\r\n }\r\n render() {\r\n\r\n const { isLoading, troubleShootGuide, attachments } = this.state;\r\n return (\r\n \r\n
\r\n
Troubleshooting guidelines \r\n
\r\n {isLoading ?
\r\n :\r\n
\r\n
'\r\n
\r\n
\r\n {attachments && attachments.length>0?\r\n
\r\n
Attachment(s) \r\n
\r\n \r\n
\r\n
:<>\r\n }\r\n
\r\n\r\n
}\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n Owner Comment\r\n
\r\n
\r\n { this.state.isLoading ?\r\n
: ''\r\n }\r\n
\r\n You have marked the option \"{this.commentString(this.props.commentCode)} \" successfully for the invoice.\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
Attachments \r\n
\r\n {isLoading ?
\r\n :\r\n
\r\n
\r\n \r\n {attachments && attachments.length>0?\r\n
\r\n
Job Attachment(s) \r\n
\r\n \r\n
\r\n
:
\r\n Attachment(s) Not Found\r\n
\r\n }\r\n
\r\n\r\n
}\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
Attachments \r\n \r\n \r\n
\r\n {isLoading ?
\r\n :\r\n \r\n
\r\n \r\n
\r\n \r\n {attachments && attachments.length>0?\r\n
\r\n
Job Attachment(s) \r\n
\r\n \r\n
\r\n
:
\r\n
Attachment(s) Not Found \r\n \r\n }\r\n
\r\n\r\n
}\r\n
\r\n
\r\n
\r\n {this.state.currentStep === 1 && (\r\n
\r\n
\r\n
\r\n Hi {this.props.assetsReviewInfo.recipientTeantName}\r\n \r\n Welcome to your \r\n Asset Upload Portal \r\n \r\n
\r\n
\r\n
\r\n Here, you can conveniently upload photos of assets \r\n \r\n {this.props.assetsReviewInfo.propertyAddress}\r\n \r\n Let's get started! \r\n \r\n Regards{\" \"}\r\n {this.props.assetsReviewInfo.requestedPropertyMangerName}{\" \"}\r\n {this.props.assetsReviewInfo.requestedPropertyMangerEmail}\r\n \r\n \r\n
\r\n
\r\n
Tenant detail \r\n
\r\n
\r\n
\r\n {this.props.assetsReviewInfo.recipientTeantName}\r\n \r\n
{this.props.assetsReviewInfo.recipientEmail} \r\n
\r\n
\r\n
\r\n
\r\n this.handleClick(2)}\r\n >\r\n Get Started\r\n \r\n
\r\n
\r\n
\r\n )}\r\n {this.state.currentStep === 2 && (\r\n
\r\n
\r\n Tips on uploading clear and quality photos of assets.\r\n \r\n
\r\n 1 Your\r\n first photo should be a standard front-facing photo of the asset\r\n you’re uploading. (Ex: Refrigerators, Television, Microwaves….)\r\n \r\n
\r\n
\r\n
\r\n {this.props.invitationId ?
\r\n 2 Your\r\n second photo should be of the compliance plate of the asset you’re\r\n uploading.\r\n :<>}\r\n {this.props.invitationId ?
\r\n
\r\n
:<>}\r\n
\r\n
\r\n this.handleClick(1)}\r\n >\r\n GO BACK\r\n {\" \"}\r\n this.handleClick(3)}\r\n >\r\n NEXT\r\n \r\n
\r\n
\r\n
\r\n )}\r\n {this.state.currentStep === 4 && (\r\n
\r\n
\r\n
Your Asset Uploading process \r\n
\r\n
\r\n
\r\n
Please make sure you have included all the \r\n
\r\n
\r\n
\r\n this.handleClick(3)}\r\n >\r\n GO BACK\r\n {\" \"}\r\n this.handleClick(5)}\r\n >\r\n SEND\r\n \r\n
\r\n
\r\n
\r\n )}\r\n {this.state.currentStep === 6 && (\r\n
\r\n
\r\n
Your Asset Uploading process \r\n
\r\n
\r\n
\r\n
The report has been sent to the Bricks And Agent \r\n
\r\n
\r\n )}\r\n {this.state.currentStep === 7 && (\r\n
\r\n
\r\n
Your Asset Uploading process \r\n
\r\n
\r\n
\r\n
Please make sure you have included all the \r\n
\r\n
\r\n
\r\n this.handleClick(3)}\r\n >\r\n GO BACK\r\n {\" \"}\r\n this.handleClick(8)}\r\n >\r\n SEND\r\n \r\n
\r\n
\r\n
\r\n )}\r\n {this.state.currentStep === 10 && (\r\n
\r\n
\r\n
404 \r\n
\r\n
\r\n
\r\n
Something went wrong! \r\n
\r\n
\r\n )}\r\n
\r\n \r\n \r\n {this.state.invitationId == null ?\r\n
\r\n Asset Details\r\n \r\n : ''}\r\n
\r\n
\r\n {this.state.isValidationError ?\r\n * {this.state.validationErrorMessage} \r\n : ''\r\n }\r\n \r\n
\r\n {this.state.invitationId == null ?\r\n this.handleSubmit()}\r\n >\r\n I'M DONE\r\n \r\n : this.addToList()}>\r\n ADD\r\n \r\n }\r\n
\r\n
\r\n );\r\n }\r\n\r\n removeFromList(fileId, type) {\r\n if (type == 0) {\r\n var attachments = this.state.attachments.filter(function (el) {\r\n return el.fileId !== fileId;\r\n });\r\n this.setState({\r\n attachments: attachments,\r\n });\r\n } else if (type == 1) {\r\n var ffAttachments = this.state.frontFacingAttachments.filter(function (el) {\r\n return el.fileId !== fileId;\r\n });\r\n this.setState({\r\n frontFacingAttachments: ffAttachments,\r\n });\r\n } else if (type == 2) {\r\n var cpAttachments = this.state.compliancePlateAttachments.filter(function (el) {\r\n return el.fileId !== fileId;\r\n });\r\n this.setState({\r\n compliancePlateAttachments: cpAttachments,\r\n });\r\n }\r\n \r\n }\r\n}\r\n\r\nexport default AssetForm;\r\n","import React from 'react';\r\nimport {\r\n Form, Container, Row, Button, Accordion, Card,\r\n Col\r\n} from 'react-bootstrap';\r\nimport \"react-datepicker/dist/react-datepicker.css\";\r\nimport { toast } from \"react-toastify\";\r\nimport ImageViewer from '../../Common/ImageViewer/ImageViewer';\r\nimport * as _ from 'lodash';\r\nimport { Label } from 'semantic-ui-react';\r\nimport AssetForm from './AssetForm';\r\nimport { v4 as uuidv4 } from 'uuid';\r\n\r\nclass PropertyAssets extends React.Component {\r\n state = {\r\n invitationId: this.props.invitationId, \r\n assetList: this.props.assetList,\r\n assetUniqId:\"\",\r\n assetCount: 0,\r\n assetComponentCount: 1,\r\n addComponentDisabled: false,\r\n asset: {\r\n id: uuidv4(),\r\n assetName: '',\r\n brand: '',\r\n model: '',\r\n barcode: '',\r\n dateOfPurchase: new Date(),\r\n note: '',\r\n attachments: [],\r\n frontFacingAttachments: [],\r\n compliancePlateAttachments: [],\r\n openRemoveConfirmation: false,\r\n isUpdated: false,\r\n isOpen: true,\r\n isNew:true\r\n }, \r\n \r\n isValidationError: false,\r\n validationErrorMessage: \"\", \r\n currentStep: this.props.currentStep\r\n }\r\n\r\n constructor(props) {\r\n super(props);\r\n }\r\n\r\n componentDidMount() {\r\n if (this.state.assetList.length == 0) {\r\n this.setState({\r\n assetList: [...this.state.assetList, {\r\n id: uuidv4(),\r\n assetName: '',\r\n brand: '',\r\n model: '',\r\n barcode: '',\r\n dateOfPurchase: new Date(),\r\n note: '',\r\n attachments: [],\r\n frontFacingAttachments: [],\r\n compliancePlateAttachments: [],\r\n openRemoveConfirmation: false,\r\n isUpdated: false,\r\n isOpen: true,\r\n isNew: true\r\n }]\r\n });\r\n }\r\n }\r\n\r\n handleChange = (e) => {\r\n this.setState({ [e.target.name]: e.target.value });\r\n }\r\n\r\n handleDateChange = (date) => {\r\n this.setState({ dateOfPurchase: date });\r\n }\r\n\r\n handleFileChange = (e) => {\r\n this.setState({ attachment: e.target.files[0] });\r\n }\r\n\r\n handleClick = (page) => {\r\n this.props.sendDataToParent(page);\r\n };\r\n\r\n addAssetComponent = (count) => {\r\n if (this.state.assetComponentCount >= 49) {\r\n this.setState({ addComponentDisabled: true });\r\n }\r\n\r\n this.setState({ assetComponentCount: count + 1 });\r\n var asset = {\r\n id: uuidv4(),\r\n assetName: '',\r\n brand: '',\r\n model: '',\r\n barcode: '',\r\n dateOfPurchase: new Date(),\r\n note: '',\r\n attachments: [],\r\n frontFacingAttachments: [],\r\n compliancePlateAttachments: [],\r\n openRemoveConfirmation: false,\r\n isUpdated: false,\r\n isOpen: true,\r\n isNew:true,\r\n };\r\n this.state.assetList.push(asset);\r\n \r\n }\r\n\r\n deleteAssetComponent = (count) => {\r\n if (this.state.assetComponentCount >= 49) {\r\n this.setState({ addComponentDisabled: true });\r\n }\r\n\r\n this.setState({ assetComponentCount: count + 1 });\r\n var asset = {\r\n id: uuidv4(),\r\n assetName: '',\r\n brand: '',\r\n model: '',\r\n barcode: '',\r\n dateOfPurchase: new Date(),\r\n note: '',\r\n attachments: [],\r\n frontFacingAttachments: [],\r\n compliancePlateAttachments: [],\r\n openRemoveConfirmation: false,\r\n isUpdated: false,\r\n isOpen: true\r\n };\r\n this.state.assetList.push(asset);\r\n\r\n }\r\n\r\n addToList = (_state) => {\r\n \r\n const updatedAssetList = this.state.assetList.map(item => {\r\n if (item.id === _state.assetUniqId) { \r\n return {\r\n ...item,\r\n assetName: _state.assetName,\r\n brand: _state.brand,\r\n model: _state.model,\r\n barcode: _state.barcode,\r\n dateOfPurchase: _state.dateOfPurchase,\r\n note: _state.note,\r\n attachments: [..._state.frontFacingAttachments, ..._state.compliancePlateAttachments],\r\n frontFacingAttachments: _state.frontFacingAttachments,\r\n compliancePlateAttachments: _state.compliancePlateAttachments,\r\n isUpdated: true,\r\n isNew: false,\r\n };\r\n }\r\n return item;\r\n });\r\n\r\n this.setState({\r\n assetList: updatedAssetList,\r\n assetCount: this.state.assetCount + 1\r\n });\r\n }\r\n\r\n editAsset = (asset, index) => {\r\n var array = [...this.state.assetList];\r\n array[index] = {\r\n ...array[index],\r\n isUpdated: false,\r\n }\r\n\r\n this.setState({\r\n assetList: array,\r\n assetCount: this.state.assetCount - 1\r\n });\r\n }\r\n\r\n removeAssetConfirmation = (index) => {\r\n var array = [...this.state.assetList];\r\n array[index] = {\r\n ...array[index],\r\n openRemoveConfirmation: true,\r\n }\r\n\r\n this.setState({\r\n assetList: array\r\n });\r\n }\r\n\r\n removeAsset = (index) => {\r\n var array = [...this.state.assetList];\r\n\r\n array.splice(index, 1);\r\n this.setState({\r\n assetList: array,\r\n assetCount: this.state.assetCount - 1,\r\n assetComponentCount: this.state.assetComponentCount - 1,\r\n addComponentDisabled: false\r\n });\r\n }\r\n\r\n removeAssetRow = (index) => {\r\n var array = [...this.state.assetList];\r\n\r\n const updatedAssetList = this.state.assetList.filter(item => item.id !== index);\r\n array.splice(index, 1);\r\n this.setState({\r\n assetList: updatedAssetList,\r\n assetComponentCount: this.state.assetComponentCount - 1,\r\n addComponentDisabled: false\r\n });\r\n }\r\n cancelAssetRemove = (index) => {\r\n var array = [...this.state.assetList];\r\n array[index] = {\r\n ...array[index],\r\n openRemoveConfirmation: false,\r\n }\r\n\r\n this.setState({\r\n assetList: array\r\n });\r\n }\r\n\r\n removeFromList(fileId, index) {\r\n var attachments = this.state.assetList[index].attachments.filter(function (el) {\r\n return el.fileId !== fileId;\r\n });\r\n\r\n }\r\n\r\n handleSubmit = () => {\r\n var updatedArray = _.filter(this.state.assetList, f => f.isUpdated == true);\r\n \r\n if (updatedArray.length > 0) {\r\n this.setState({ assetList: updatedArray, isValidationError: false });\r\n this.props.goToLastStep(this.state, 7);\r\n } else {\r\n this.setState({\r\n isValidationError: true,\r\n validationErrorMessage: \"Add atleast one asset to continue\"\r\n });\r\n }\r\n } \r\n\r\n toggleAccordion = (index, itemIsOpen) => {\r\n //this.setState({ isOpen: !this.state.isOpen });\r\n\r\n var array = [...this.state.assetList];\r\n array[index] = {\r\n ...array[index],\r\n isOpen: !itemIsOpen,\r\n }\r\n\r\n this.setState({\r\n assetList: array,\r\n });\r\n };\r\n \r\n\r\n render() {\r\n return (\r\n <>\r\n \r\n
\r\n
{this.state.assetCount}/50 Assets
\r\n
0 ? '' : 'min-height-40'}`}>\r\n
this.addAssetComponent(this.state.assetComponentCount)} disabled={this.state.addComponentDisabled}> \r\n
\r\n {(this.state.assetList && this.state.assetList.length > 0) &&\r\n this.state.assetList.map((item, index) => (\r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n
Asset {index + 1}
\r\n
\r\n
\r\n {item.isUpdated &&
}\r\n
\r\n
this.toggleAccordion(index, item.isOpen)}\r\n aria-expanded={item.isOpen ? 'true' : 'false'} \r\n className={item.isOpen ? \"rotate\" : \"\"}\r\n as={Button} \r\n variant=\"link\" \r\n style={{ padding: 0, border: 'none', background: 'none' }}\r\n >\r\n \r\n {item.isNew && (\r\n
this.removeAssetRow(item.id)}>\r\n \r\n )}\r\n
\r\n
\r\n \r\n {!item.isUpdated ?\r\n \r\n \r\n
Asset Name
\r\n
{item.assetName}
\r\n
\r\n
Brand
\r\n
{item.brand}
\r\n
\r\n
Model
\r\n
{item.model}
\r\n
\r\n
Barcode
\r\n
{item.barcode}
\r\n
\r\n
Date of Purchase
\r\n
{item.dateOfPurchase.toString()}
\r\n
\r\n
Note
\r\n
{item.note}
\r\n
Attachments
\r\n \r\n {item.attachments ? (\r\n {\r\n this.removeFromList(fileid, index);\r\n }}\r\n attachments={item.attachments}\r\n isFromBot={false}\r\n isFromTenantManageJobPost={false}\r\n isFromAsset_ff_cp={true}\r\n >\r\n ) : (\r\n \"\"\r\n )}\r\n
\r\n \r\n \r\n
\r\n
\r\n
this.editAsset(item, index)}>Edit \r\n
\r\n
\r\n
\r\n
this.removeAssetConfirmation(index)}>Delete \r\n
\r\n
\r\n
Are you sure you want to delete the asset \"{item.assetName}\"? \r\n
\r\n this.cancelAssetRemove(index)}>No \r\n this.removeAsset(index)}>Yes \r\n
\r\n
\r\n }\r\n \r\n \r\n \r\n ))}\r\n \r\n
\r\n this.handleSubmit()}>\r\n I'M DONE\r\n \r\n
\r\n \r\n );\r\n }\r\n \r\n}\r\n\r\n\r\nexport default PropertyAssets;\r\n","import React from 'react';\r\nimport Loader from \"react-loader-spinner\";\r\nimport { Button, ButtonToolbar, ToggleButton, ToggleButtonGroup } from \"react-bootstrap\";\r\nimport { Navbar } from \"react-bootstrap\";\r\nimport ImageViewer from '../../Common/ImageViewer/ImageViewer';\r\nimport externalService from '../../../Services/ExternalService';\r\nimport { connect } from 'react-redux';\r\nimport AssetCommanView from './AssetCommanView';\r\nimport AssetForm from './AssetForm';\r\nimport './Assets.scss';\r\nimport PropertyAssets from './PropertyAssets';\r\n\r\nclass ExternalAssets extends React.Component {\r\n\r\n state = {\r\n assetId: this.props.assetId,\r\n invitationId: this.props.invitationId,\r\n isLoading: false,\r\n assets:{\r\n id: this.props.assetId,\r\n assetName: '',\r\n brand: '',\r\n model: '',\r\n barcode: '',\r\n dateOfPurchase: '',\r\n note: '',\r\n attachments: [],\r\n frontFacingAttachments: [],\r\n compliancePlateAttachments: []\r\n },\r\n assetsReviewInfo:{\r\n propertyAddress :'',\r\n recipientEmail :'',\r\n recipientTeantName :'',\r\n relatedOrganizationLogo :'',\r\n requestedPropertyMangerId :'',\r\n relatedOrganizationId : '',\r\n requestedPropertyMangerEmail :'',\r\n requestedPropertyMangerName :'',\r\n isLinkExpired : false,\r\n submittedUserId:''\r\n },\r\n assetList: [],\r\n currentStep: 1\r\n }\r\n\r\n componentDidMount() {\r\n const { assetId, invitationId, encriptedUserId } = this.props;\r\n this.getAssetsReviewInfo(assetId,encriptedUserId,invitationId);\r\n }\r\n\r\n\r\n getAssetsReviewInfo = (assetId,encriptedUserId,invitationId) => {\r\n this.setState({ isLoading: true });\r\n try {\r\n externalService.getPropertyAssetReviewInfo(assetId, encriptedUserId, invitationId).then(res => {\r\n this.setState({\r\n assetsReviewInfo: res,\r\n isLoading: false\r\n });\r\n\r\n if (!res.IsLinkExpired && assetId != null && assetId != undefined && assetId != '') {\r\n this.getAssets(assetId);\r\n }\r\n });\r\n } catch (error) {\r\n this.setState({\r\n currentStep: 10\r\n });\r\n }\r\n }\r\n\r\n \r\n getAssets = (assetId) => {\r\n this.setState({ isLoading: true });\r\n try {\r\n externalService.getAssetById(assetId).then(res => {\r\n this.setState({\r\n assets: res,\r\n isLoading: false\r\n });\r\n });\r\n } catch (error) {\r\n this.setState({\r\n currentStep: 10\r\n });\r\n }\r\n \r\n }\r\n\r\n goToNextStep = (step) => {\r\n console.log(\"Received data from child:\", step);\r\n this.setState({ currentStep: step })\r\n }\r\n\r\n goToLastStep = (_state,step) => {\r\n console.log(\"Received data from Last child:\", _state);\r\n this.setState({ currentStep: step });\r\n this.setState({ assets:{\r\n id: this.state.assetId,\r\n assetName: _state.assetName,\r\n brand: _state.brand,\r\n model: _state.model,\r\n barcode: _state.barcode,\r\n dateOfPurchase: _state.dateOfPurchase,\r\n note: _state.note,\r\n attachments: _state.attachments,\r\n userId: this.props.encriptedUserId\r\n } \r\n })\r\n }\r\n\r\n submitAssetList = (_state, step) => {\r\n this.setState({\r\n currentStep: step,\r\n assetList: _state.assetList,\r\n invitationId: _state.invitationId\r\n })\r\n\r\n }\r\n\r\n render() {\r\n \r\n const { isLoading, assets, assetsReviewInfo } = this.state;\r\n return (\r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
\r\n {assetsReviewInfo.isLinkExpired && \r\n <>\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
Url has been expired! \r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n }\r\n {(!assetsReviewInfo.isLinkExpired && this.state.currentStep == 1 || this.state.currentStep == 2 || this.state.currentStep == 4 || this.state.currentStep == 6 || this.state.currentStep == 7 || this.state.currentStep == 10) &&\r\n
\r\n } \r\n \r\n {(!assetsReviewInfo.isLinkExpired && this.state.assetId != null && this.state.assetId != undefined && this.state.assetId != '' && this.state.currentStep == 3) &&\r\n
\r\n }\r\n\r\n {(!assetsReviewInfo.isLinkExpired && this.state.invitationId != null && this.state.invitationId != undefined && this.state.invitationId != '' && this.state.currentStep == 3) &&\r\n
\r\n }\r\n
\r\n { this.state.isLoading ? (
\r\n
\r\n
\r\n
\r\n \r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {\r\n this.state.jobState != 1 ?(
\r\n
\r\n
Sorry, the link is expired. Please contact the PM. \r\n
) :(
\r\n \r\n {!this.state.showSuccessMsg ? (\r\n
\r\n
\r\n
This job drafted via SMS {this.timeAgo(this.state.postedOn)} \r\n {this.state.jobTitle} \r\n \r\n \r\n
\r\n{uplorder}\r\n
\r\n ):\r\n (\r\n
\r\n
\r\n
Successfully logged your maintenance issue! \r\n
Reference Number: {this.state.jobNumber} \r\n
This maintenance request was posted to the agency {this.timeAgo(this.state.postedOn)}.
\r\n
\r\n )} \r\n
)\r\n }\r\n \r\n \r\n \r\n \r\n
):(
)\r\n\r\n }
\r\n
\r\n
\r\n
\r\n
\r\n
Upload Photos & Videos {!this.state.isEnableSave && (required) } \r\n {this.state.isEnableSave ?
It is optional but uploading images or videos helps understand the issue better.
:
You can attach photos or videos related to the job here.
}\r\n
\r\n
\r\n
\r\n
{ if(event.length >0)this.setState({ attachments: event ,isEnableSave:true})}}\r\n isJobPost={true}\r\n \r\n isExternal={true}\r\n t={t}>\r\n \r\n {(this.state.attachments) ?\r\n \r\n
\r\n \r\n
\r\n
\r\n this.checkSettings()}>Save \r\n
\r\n {this.state.isDrawerOpen && (
this.save()}\r\n onCloseDisclaimer = {() => this.closeDisclaimer()}\r\n isFromBot={false}\r\n >\r\n\r\n )} \r\n \r\n
\r\n \r\n
\r\n
\r\n
\r\n ,\r\n rootElement\r\n );\r\n }\r\n } else {\r\n ReactDOM.render(\r\n \r\n ,\r\n rootElement\r\n );\r\n }\r\n} else if (window.location.search.indexOf('maintenancebot=') > -1) {\r\n var color = urlParams.get(\"themeColor\");\r\n var orgId = urlParams.get(\"orgId\");\r\n var language = urlParams.get(\"lng\");\r\n ReactDOM.render(\r\n \r\n ,\r\n rootElement\r\n );\r\n} else if (window.location.search.indexOf('troubleshootguide') > -1) {\r\n var id = urlParams.get(\"troubleshootguideId\");\r\n ReactDOM.render(\r\n \r\n ,\r\n rootElement\r\n );}else if (window.location.search.indexOf('attachmentsOfCompletedMR') > -1) {\r\n var id = urlParams.get(\"attachmentsOfCompletedMRId\");\r\n ReactDOM.render(\r\n \r\n ,\r\n rootElement\r\n );\r\n } else if (window.location.search.indexOf('draftedJobId') > -1 && window.location.pathname.indexOf('add-job-attachments')) {\r\n \r\n var id = urlParams.get(\"draftedJobId\");\r\n ReactDOM.render(\r\n \r\n ,\r\n rootElement\r\n );\r\n}\r\n\r\nelse if (window.location.search.indexOf('invoiceprocessor') == true) {\r\n const externalInvoiceId = urlParams.get('invoiceId');\r\n const applicationUserId = urlParams.get('userId');\r\n const code = urlParams.get('commentCode');\r\n window.history.pushState('', null, 'invoiceprocessor');\r\n ReactDOM.render(\r\n \r\n \r\n ,\r\n rootElement\r\n );\r\n \r\n}\r\nelse if (window.location.search.indexOf('jobId') > -1 && window.location.pathname.indexOf(\"view-job-attachments\") > -1) {\r\n const jobId = urlParams.get('jobId');\r\n ReactDOM.render(\r\n \r\n ,\r\n rootElement\r\n );\r\n \r\n}\r\nelse if (window.location.search.indexOf('asset') > -1 || window.location.search.indexOf('invitation') > -1) {\r\n const assetId = urlParams.get('assetId');\r\n const invitationId = urlParams.get('invitationId');\r\n const userId = urlParams.get('userId');\r\n\r\n ReactDOM.render(\r\n \r\n ,\r\n rootElement\r\n );\r\n}\r\nelse {\r\n const userId = localStorage.getItem('userId');\r\n if (urlParams.get('id') == null) {\r\n if (userId === undefined || userId === '' || userId === 'null' || userId === null || (localStorage.getItem(\"exernalUserId\") != null && localStorage.getItem(\"exernalUserId\") != \"\")) {\r\n window.location.href = appSettings.BAndAEndPoint + 'Account/UserLogin';\r\n } else {\r\n localStorage.setItem(\"userId\", userId);\r\n localStorage.setItem(\"userType\", localStorage.getItem(\"userType\"));\r\n localStorage.setItem(\"exernalUserId\", \"\");\r\n\r\n }\r\n } else {\r\n localStorage.setItem(\"userId\", urlParams.get(\"id\"));\r\n localStorage.setItem(\r\n \"userType\",\r\n urlParams.get(\"isTenant\") === \"True\" ? UserType.Tenant : UserType.Owner\r\n );\r\n localStorage.setItem(\"exernalUserId\", \"\");\r\n }\r\n\r\n const isSuper = urlParams.get('isSuperAdminAsOtherUser');\r\n if (urlParams.get('isSuperAdminAsOtherUser') !== null && urlParams.get('isSuperAdminAsOtherUser') === \"true\") {\r\n localStorage.setItem(\"isSuperAdminAsOtherUser\", urlParams.get(\"isSuperAdminAsOtherUser\"));\r\n if (urlParams.get('adminId') !== null) {\r\n localStorage.setItem(\"ImpersonatingUserId\", urlParams.get(\"adminId\"));\r\n }\r\n }\r\n\r\n utilityService.getDescriptedUserId().then(res => {\r\n localStorage.setItem(\"userIdDecripted\", res);\r\n chatService.updateUserActiveStatus(res, true);\r\n });\r\n\r\n window.onbeforeunload = function () {\r\n chatService.updateUserActiveStatus(localStorage.getItem(\"userIdDecripted\"), false);\r\n };\r\n\r\n\r\n ReactDOM.render(\r\n \r\n ,\r\n rootElement\r\n );\r\n}\r\n\r\nregisterServiceWorker();\r\n","import React, { Component } from \"react\";\r\nimport _ from \"lodash\";\r\nimport { Search, Grid, Header } from \"semantic-ui-react\";\r\nimport jobService from \"../../../Services/JobService\";\r\n\r\nvar source = document.createElement(\"div\");\r\n// var service = new window.google.maps.places.AutocompleteService();\r\n// var geocoder = new window.google.maps.Geocoder();\r\n\r\nexport default class GoogleMapLocationsAutoComplete extends Component {\r\n\r\n state = {\r\n isLoading: false,\r\n latitude: 0,\r\n longitude: 0,\r\n placeId: '',\r\n value: '',\r\n results: []\r\n }\r\n\r\n componentWillMount() {\r\n this.resetComponent();\r\n }\r\n\r\n resetComponent = () => {\r\n if(this.props.formData){\r\n this.setState({ isLoading: false, results: [], value: this.props.formData.address });\r\n }else if(this.props.location){\r\n this.setState({ isLoading: false, results: [], value: this.props.location });\r\n } \r\n }\r\n\r\n handleResultSelect = (e, response) => {\r\n this.setState({ value: response.result.description });\r\n new window.google.maps.Geocoder().geocode({ 'address': response.result.description }, (results, status) => {\r\n var place = results[0];\r\n this.setState({ \r\n latitude: results[0].geometry.location.lat(),\r\n longitude: results[0].geometry.location.lng(),\r\n placeId: results[0].place_id\r\n });\r\n\r\n var suburbName = place.address_components.find(function (element) {\r\n return element.types[0] == 'locality';\r\n });\r\n\r\n var postalCode = place.address_components.find(function (element) {\r\n return element.types[0] == 'postal_code';\r\n });\r\n\r\n if (suburbName && postalCode) {\r\n jobService.GetSuburb(suburbName.long_name, postalCode.long_name).then(response => {\r\n this.props.setLocationDetails({\r\n latitude: this.state.latitude,\r\n longitude: this.state.longitude,\r\n placeId: this.state.placeId,\r\n suburbId: (response == null) ? null : response.id,\r\n location: (response == null) ? null : response.label,\r\n address: this.state.value\r\n });\r\n });\r\n } else {\r\n this.props.setLocationDetails({\r\n latitude: this.state.latitude,\r\n longitude: this.state.longitude,\r\n placeId: this.state.placeId,\r\n suburbId: null,\r\n location: null,\r\n address: this.state.value\r\n });\r\n }\r\n \r\n });\r\n \r\n //service.\r\n // this.props.location = response.result;\r\n }\r\n\r\n handleSearchChange = (e, { value }) => {\r\n var vm = this;\r\n this.setState({ isLoading: true, value: value });\r\n var countryArray = \"au\";\r\n\r\n var countryCode = localStorage.getItem(\"countryCode\");\r\n\r\n if(countryCode != \"null\" && countryCode != \"AUS\"){\r\n countryArray = \"nz\";\r\n } \r\n\r\n var request = { input: value, types: ['geocode'], componentRestrictions: { country: [countryArray] } }; \r\n \r\n if (!value.length > 0) {\r\n vm.setState({ isLoading: false, results: [] });\r\n return;\r\n }\r\n // if (this.state.isLoading) {\r\n // return;\r\n // }\r\n new window.google.maps.places.AutocompleteService().getPlacePredictions(request, function (results, status) {\r\n if (status === window.google.maps.places.PlacesServiceStatus.OK) {\r\n vm.setState({ isLoading: false, results: results });\r\n }\r\n });\r\n };\r\n\r\n geolocate = () => {\r\n if (navigator.geolocation) {\r\n navigator.geolocation.getCurrentPosition(function (position) {\r\n var geolocation = {\r\n lat: position.coords.latitude,\r\n lng: position.coords.longitude\r\n };\r\n var circle = new window.google.maps.Circle({\r\n center: geolocation,\r\n radius: position.coords.accuracy\r\n });\r\n window.google.maps.LatLngBounds(circle.getBounds())\r\n // autocomplete.setBounds(circle.getBounds());\r\n });\r\n }\r\n }\r\n\r\n render() {\r\n const { isLoading, value, results } = this.state;\r\n\r\n return (\r\n \r\n \r\n {t != undefined ?
\r\n
{t('hdr_choose_servicetype')}.* \r\n
({t('lbl_chooseoption')})
\r\n
\r\n :
\r\n
Choose the service type you need.* \r\n
(Choose an option)
\r\n
\r\n }\r\n
\r\n \r\n {props.services.map((jbType, index) => {\r\n return \r\n
\r\n )\r\n}\r\n\r\nexport default FrequentlyUsedServices;","import React from \"react\";\r\n\r\n// Plugins\r\nimport { AXIOS } from \"../../../Utilities/HttpRequest/Axios\";\r\n\r\n// Styles\r\nimport \"./JobLocksDrawer.scss\";\r\n\r\nclass JobLocksDrawer extends React.Component {\r\n state = {\r\n showJobLocksDrawer: false\r\n };\r\n\r\n constructor(props) {\r\n super(props);\r\n }\r\n\r\n render() {\r\n let drawer = this.createDrawer();\r\n return {drawer}
;\r\n }\r\n\r\n createDrawer = () => {\r\n const propertyLocks = this.renderPropertyLocks();\r\n const { t, isFromBot } = this.props;\r\n return (\r\n <>\r\n \r\n
\r\n
\r\n \r\n
{isFromBot ? t('jld_lbl_smart_locks') : 'Smart Locks'} \r\n
\r\n
\r\n
{propertyLocks}
\r\n : {isFromBot ? t('jld_info_no_results') : 'No Results Found'}
\r\n }\r\n \r\n );\r\n };\r\n\r\n renderPropertyLocks = () => {\r\n if (this.state.propertyLocks == null) {\r\n return
;\r\n }\r\n\r\n if (this.props.isSelectable) {\r\n const listItems = this.state.propertyLocks.map((lock, index) => {\r\n return \r\n \r\n {lock.lockName} \r\n \r\n
;\r\n });\r\n\r\n return listItems;\r\n } else {\r\n const listItems = this.state.propertyLocks.map((lock, index) => {\r\n return \r\n {lock.lockName}\r\n
;\r\n });\r\n\r\n return listItems;\r\n }\r\n }\r\n\r\n onKeySelectionChange = (event) => {\r\n const changedList = this.state.propertyLocks.map((lock, index) => {\r\n if (event.currentTarget.value == lock.id) {\r\n lock.isAssigned = event.currentTarget.checked;\r\n }\r\n\r\n return lock;\r\n });\r\n\r\n this.setState({ propertyLocks: changedList });\r\n this.props.onPropertyKeySelected(changedList.filter(a => a.isAssigned));\r\n }\r\n\r\n handleInit = () => { };\r\n\r\n toggleJobLocksDrawer = () => {\r\n this.setState({\r\n showJobLocksDrawer: !this.state.showJobLocksDrawer\r\n });\r\n\r\n try {\r\n if (this.props.propertyId) {\r\n this.setState({ isLoading: true })\r\n AXIOS.GET(`tenant-api/access/property/locks?propertyId=${this.props.propertyId}&userId=${localStorage.getItem('userId')}`)\r\n .then(dataJson => {\r\n this.setState({ isLoading: false })\r\n this.setState({ propertyLocks: dataJson.propertyLocks });\r\n });\r\n } else if (this.props.jobId) {\r\n this.setState({ isLoading: true })\r\n AXIOS.GET(`tenant-api/access/job/locks?jobId=${this.props.jobId}&userId=${localStorage.getItem('userId')}`)\r\n .then(dataJson => {\r\n const assignedLocks = dataJson.propertyLocks.filter(a => a.isAssigned);\r\n this.setState({ isLoading: false })\r\n this.setState({ propertyLocks: assignedLocks });\r\n });\r\n }\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n };\r\n}\r\n\r\nexport default JobLocksDrawer;\r\n","export var UserType;\r\n(function(UserType) {\r\n UserType[(UserType[\"None\"] = 0)] = \"None\";\r\n UserType[(UserType[\"Provider\"] = 1)] = \"Provider\";\r\n UserType[(UserType[\"Consumer\"] = 2)] = \"Consumer\";\r\n UserType[(UserType[\"PropertyManager\"] = 3)] = \"PropertyManager\";\r\n UserType[(UserType[\"Tenant\"] = 4)] = \"Tenant\";\r\n UserType[(UserType[\"Owner\"] = 5)] = \"Owner\";\r\n})(UserType || (UserType = {}));\r\n\r\nexport var JobsListTypes;\r\n(function(JobsListTypes) {\r\n JobsListTypes[(JobsListTypes[\"None\"] = 0)] = \"None\";\r\n JobsListTypes[(JobsListTypes[\"MatchingJobs\"] = 1)] = \"MatchingJobs\";\r\n JobsListTypes[(JobsListTypes[\"AvailableJobs\"] = 2)] = \"AvailableJobs\";\r\n JobsListTypes[(JobsListTypes[\"AwardedJobs\"] = 3)] = \"AwardedJobs\";\r\n JobsListTypes[(JobsListTypes[\"UnscheduledJobs\"] = 4)] = \"UnscheduledJobs\";\r\n JobsListTypes[(JobsListTypes[\"InProgressJobs\"] = 5)] = \"InProgressJobs\";\r\n JobsListTypes[(JobsListTypes[\"AssignedJobs\"] = 6)] = \"AssignedJobs\";\r\n JobsListTypes[(JobsListTypes[\"PendingReviewJobs\"] = 7)] = \"PendingReviewJobs\";\r\n JobsListTypes[(JobsListTypes[\"CompletedJobs\"] = 8)] = \"CompletedJobs\";\r\n JobsListTypes[(JobsListTypes[\"ArchivedJobs\"] = 9)] = \"ArchivedJobs\";\r\n JobsListTypes[(JobsListTypes[\"QuotedJobs\"] = 10)] = \"QuotedJobs\";\r\n JobsListTypes[(JobsListTypes[\"PendingApprovalJobs\"] = 11)] =\r\n \"PendingApprovalJobs\";\r\n JobsListTypes[(JobsListTypes[\"PendingOwnerApprovalJobs\"] = 12)] =\r\n \"PendingOwnerApprovalJobs\";\r\n JobsListTypes[(JobsListTypes[\"OwnerApprovedJobs\"] = 13)] =\r\n \"OwnerApprovedJobs\";\r\n JobsListTypes[(JobsListTypes[\"PostedJobs\"] = 14)] = \"PostedJobs\";\r\n JobsListTypes[(JobsListTypes[\"OverdueJobs\"] = 16)] = \"OverdueJobs\";\r\n JobsListTypes[(JobsListTypes[\"QuoteRejectedJobs\"] = 17)] =\r\n \"QuoteRejectedJobs\";\r\n JobsListTypes[(JobsListTypes[\"RecurringJobs\"] = 18)] = \"RecurringJobs\";\r\n JobsListTypes[(JobsListTypes[\"ScheduledJobs\"] = 19)] = \"ScheduledJobs\";\r\n JobsListTypes[(JobsListTypes[\"DraftedJobs\"] = 20)] = \"DraftedJobs\";\r\n JobsListTypes[(JobsListTypes[\"InactiveJobs\"] = 21)] = \"InactiveJobs\";\r\n JobsListTypes[(JobsListTypes[\"RejectedJobs\"] = 22)] = \"RejectedJobs\";\r\n JobsListTypes[(JobsListTypes[\"UpcomingJobs\"] = 23)] = \"UpcomingJobs\";\r\n JobsListTypes[(JobsListTypes[\"RevisionRequestedJobs\"] = 24)] =\r\n \"RevisionRequestedJobs\";\r\n JobsListTypes[(JobsListTypes[\"PendingScheduleApproval\"] = 26)] =\r\n \"PendingScheduleApproval\";\r\n JobsListTypes[(JobsListTypes[\"TodaysJobs\"] = 27)] = \"TodaysJobs\";\r\n JobsListTypes[(JobsListTypes[\"QuoteLimitMetJobs\"] = 28)] =\r\n \"QuoteLimitMetJobs\";\r\n JobsListTypes[(JobsListTypes[\"OwnerRejectedJobs\"] = 30)] =\r\n \"OwnerRejectedJobs\";\r\n JobsListTypes[(JobsListTypes[\"PropertyInspectionJobs\"] = 31)] =\r\n \"PropertyInspectionJobs\";\r\n JobsListTypes[(JobsListTypes[\"PostedJobForThirdParty\"] = 32)] =\r\n \"PostedJobForThirdParty\";\r\n JobsListTypes[(JobsListTypes[\"CeasedJobs\"] = 33)] = \"CeasedJobs\";\r\n JobsListTypes[(JobsListTypes[\"FinanceAcceptedQuotes\"] = 34)] =\r\n \"FinanceAcceptedQuotes\";\r\n JobsListTypes[(JobsListTypes[\"FinanceUnpaidInvoices\"] = 35)] =\r\n \"FinanceUnpaidInvoices\";\r\n JobsListTypes[(JobsListTypes[\"FinancePaidInvoices\"] = 36)] =\r\n \"FinancePaidInvoices\";\r\n JobsListTypes[(JobsListTypes[\"VariationAvailableJobs\"] = 37)] =\r\n \"VariationAvailableJobs\";\r\n JobsListTypes[(JobsListTypes[\"PendingJobs\"] = 38)] = \"PendingJobs\";\r\n JobsListTypes[(JobsListTypes[\"PendingInvoiceJobs\"] = 39)] =\r\n \"PendingInvoiceJobs\";\r\n JobsListTypes[(JobsListTypes[\"PendingPaymentJobs\"] = 40)] =\r\n \"PendingPaymentJobs\";\r\n JobsListTypes[(JobsListTypes[\"InternalPendingReviewJobs\"] = 41)] =\r\n \"InternalPendingReviewJobs\";\r\n})(JobsListTypes || (JobsListTypes = {}));\r\n\r\nexport var WorkflowStates;\r\n(function(WorkflowStates) {\r\n WorkflowStates[(WorkflowStates[\"JobDrafted\"] = 1)] = \"JobDrafted\";\r\n WorkflowStates[(WorkflowStates[\"JobPosted\"] = 2)] = \"JobPosted\";\r\n WorkflowStates[(WorkflowStates[\"JobQuotesAvailable\"] = 3)] =\r\n \"JobQuotesAvailable\";\r\n WorkflowStates[(WorkflowStates[\"JobQuoteAccepted\"] = 4)] = \"JobQuoteAccepted\";\r\n WorkflowStates[(WorkflowStates[\"JobAwaitingForApproval\"] = 5)] =\r\n \"JobAwaitingForApproval\";\r\n WorkflowStates[(WorkflowStates[\"JobAwaitingOwnerApproval\"] = 6)] =\r\n \"JobAwaitingOwnerApproval\";\r\n WorkflowStates[(WorkflowStates[\"JobCompleted\"] = 7)] = \"JobCompleted\";\r\n WorkflowStates[(WorkflowStates[\"JobArchived\"] = 8)] = \"JobArchived\";\r\n WorkflowStates[(WorkflowStates[\"JobApprovedByOwner\"] = 9)] =\r\n \"JobApprovedByOwner\";\r\n WorkflowStates[(WorkflowStates[\"JobApprovedByPM\"] = 10)] = \"JobApprovedByPM\";\r\n WorkflowStates[(WorkflowStates[\"JobRejectedByOwner\"] = 11)] =\r\n \"JobRejectedByOwner\";\r\n WorkflowStates[(WorkflowStates[\"BidCreated\"] = 101)] = \"BidCreated\";\r\n WorkflowStates[(WorkflowStates[\"BidAccepted\"] = 102)] = \"BidAccepted\";\r\n WorkflowStates[(WorkflowStates[\"BidRejected\"] = 103)] = \"BidRejected\";\r\n WorkflowStates[(WorkflowStates[\"JobCancelled\"] = 104)] = \"JobCancelled\";\r\n WorkflowStates[(WorkflowStates[\"BidJobCancelled\"] = 105)] = \"BidJobCancelled\";\r\n WorkflowStates[(WorkflowStates[\"JobRejected\"] = 106)] = \"JobRejected\";\r\n WorkflowStates[(WorkflowStates[\"JobPendingReview\"] = 107)] =\r\n \"JobPendingReview\";\r\n WorkflowStates[(WorkflowStates[\"JobPendingInvoice\"] = 111)] =\r\n \"JobPendingInvoice\";\r\n WorkflowStates[(WorkflowStates[\"VariationCreated\"] = 201)] =\r\n \"VariationCreated\";\r\n WorkflowStates[(WorkflowStates[\"VariationApproved\"] = 202)] =\r\n \"VariationApproved\";\r\n WorkflowStates[(WorkflowStates[\"VariationRejected\"] = 203)] =\r\n \"VariationRejected\";\r\n WorkflowStates[(WorkflowStates[\"JobAwardPendingApproval\"] = 204)] =\r\n \"JobAwardPendingApproval\";\r\n WorkflowStates[(WorkflowStates[\"JobPostedForThirdParty\"] = 205)] =\r\n \"JobPostedForThirdParty\";\r\n WorkflowStates[(WorkflowStates[\"JobCeased\"] = 109)] = \"JobCeased\";\r\n WorkflowStates[(WorkflowStates[\"BidDeclined\"] = 110)] = \"BidDeclined\";\r\n})(WorkflowStates || (WorkflowStates = {}));\r\n\r\nexport var PropertyInspectionStatus;\r\n(function (PropertyInspectionStatus) {\r\n PropertyInspectionStatus[(PropertyInspectionStatus[\"None\"] = 0)] = \"None\";\r\n PropertyInspectionStatus[(PropertyInspectionStatus[\"PendingApproval\"] = 1)] = \"PendingApproval\";\r\n PropertyInspectionStatus[(PropertyInspectionStatus[\"Approved\"] = 2)] = \"Approved\";\r\n PropertyInspectionStatus[(PropertyInspectionStatus[\"Rejected\"] = 3)] = \"Rejected\";\r\n PropertyInspectionStatus[(PropertyInspectionStatus[\"Completed\"] = 4)] = \"Completed\";\r\n PropertyInspectionStatus[(PropertyInspectionStatus[\"Drafted\"] = 5)] = \"Drafted\";\r\n PropertyInspectionStatus[(PropertyInspectionStatus[\"NewDateProposed\"] = 6)] = \"NewDateProposed\";\r\n})(PropertyInspectionStatus || (PropertyInspectionStatus = {}));\r\n\r\nexport var MasterDataType;\r\n(function (MasterDataType) {\r\n MasterDataType[MasterDataType[\"JobTypes\"] = 0] = \"JobTypes\";\r\n})(MasterDataType || (MasterDataType = {}));\r\n\r\nexport var ChatbotOptionType;\r\n(function(ChatbotOptionType) {\r\n ChatbotOptionType[(ChatbotOptionType[\"LogMaintenance\"] = 0)] = \"LogMaintenance\";\r\n ChatbotOptionType[(ChatbotOptionType[\"CheckRental\"] = 1)] = \"CheckRental\";\r\n ChatbotOptionType[(ChatbotOptionType[\"QandA\"] = 2)] = \"QandA\";\r\n ChatbotOptionType[(ChatbotOptionType[\"OwnerLogin\"] = 3)] = \"OwnerLogin\";\r\n ChatbotOptionType[(ChatbotOptionType[\"TrackIssue\"] = 4)] = \"TrackIssue\";\r\n})(ChatbotOptionType || (ChatbotOptionType = {}));\r\n\r\nexport var ChatbotLanguageOptionType;\r\n(function (ChatbotOptionType) {\r\n ChatbotLanguageOptionType[(ChatbotLanguageOptionType[\"English\"] = 0)] = \"English\";\r\n ChatbotLanguageOptionType[(ChatbotLanguageOptionType[\"Hindi\"] = 1)] = \"English\";\r\n ChatbotLanguageOptionType[(ChatbotLanguageOptionType[\"Chinese\"] = 2)] = \"English\";\r\n})(ChatbotLanguageOptionType || (ChatbotLanguageOptionType = {}));","import React from 'react';\r\nimport { connect } from \"react-redux\";\r\nimport { ButtonToolbar, ToggleButton, ToggleButtonGroup } from \"react-bootstrap\";\r\nimport ImageViewer from '../../Common/ImageViewer/ImageViewer';\r\nimport { AXIOS } from \"../../../Utilities/HttpRequest/Axios\";\r\nimport { toast } from 'react-toastify';\r\nimport 'react-toastify/dist/ReactToastify.css';\r\nimport { Form } from 'react-bootstrap';\r\nimport GoogleMapLocationsAutoComplete from '../GoogleMapLocationsAutoComplete/GoogleMapLocationsAutoComplete';\r\nimport settingsService from '../../../Services/settingsService';\r\nimport jobService from '../../../Services/JobService';\r\nimport { Guid } from 'guid-typescript';\r\nimport DatePicker from \"react-datepicker\";\r\nimport { Search, Label, Dropdown } from 'semantic-ui-react'\r\nimport \"react-datepicker/dist/react-datepicker.css\";\r\nimport * as _ from 'lodash';\r\nimport 'semantic-ui-css/semantic.min.css'\r\nimport './JobPostWizard.scss';\r\nimport propertyService from '../../../Services/PropertyService';\r\nimport FrequentlyUsedServices from '../../Drawers/JobPostDrawer/FrequentlyUsedServices/FrequentlyUsedServices';\r\nimport AttachmentsDrawer from '../../Drawers/AttachmentsDrawer/AttachmentsDrawer';\r\nimport Disclaimer from '../../Drawers/JobPostDrawer/Disclaimer/Disclaimer';\r\nimport { AppConfiguration } from 'read-appsettings-json';\r\nimport { trackPromise } from 'react-promise-tracker';\r\nimport { Link } from 'react-router-dom';\r\nimport JobIssueTag from '../JobIssueTag/JobIssueTag';\r\nimport PropertyComponent from '../PropertyComponent/PropertyComponent';\r\nimport { withTranslation } from 'react-i18next';\r\nimport translateService from '../../../Services/TranslateService';\r\nimport TroubleshootGuidModal from \"../../Drawers/TroubleshootGuidModal/TroubleshootGuidModal\";\r\nclass JobPostWizard extends React.Component {\r\n\r\n \r\n constructor(props) {\r\n super(props);\r\n this.title = React.createRef();\r\n this.jobDescription = React.createRef();\r\n this.budgetRef = React.createRef();\r\n this.issueAreaInProperty = React.createRef();\r\n this.isUrgentIssue = React.createRef();\r\n\r\n }\r\n\r\n notifyError = (msg) => {\r\n toast.error(msg, {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n if (this.props.isFromBot) {\r\n this.props.showChatbotError(msg);\r\n }\r\n }\r\n\r\n state = {\r\n userType: localStorage.getItem(\"userType\"),\r\n userId: localStorage.getItem(\"userId\"),\r\n stepFlow: [\r\n [0, \"selectProperty\"],\r\n [1, \"getMaintenaceIssue\"], \r\n [2, \"getAttachments\"],\r\n [3, \"jobPostSummary\"],\r\n [4, \"selectSubmitOption\"],\r\n [5, \"setResponse\"],\r\n [6, \"GotoHomePage\"],\r\n [7, \"GetResolvedResponseByTroubleshootGuide\"],\r\n ],\r\n selectedServiceTypeName: \"\",\r\n\r\n isJobEdit: (this.props.isJobEdit) ? true : false,\r\n jobEditId: (this.props.jobEditId) ? this.props.jobEditId : \"\",\r\n currentStep: 0,\r\n isConsumerJobPost: false,\r\n propertySearchData: [],\r\n formData: {\r\n address: '',\r\n location: '',\r\n propertyId: '',\r\n propertyName: '',\r\n suburbId: '',\r\n propertyType: '',\r\n jobBudget: 0,\r\n jobDescription: '',\r\n jobDescriptionEng: '',\r\n issueAreaInProperty: '',\r\n issueAreaInPropertyEng: '',\r\n },\r\n availableServices: [],\r\n availableServicesDetails: [],\r\n selectedService: { childJobTypes: [] },\r\n selectedServiceType: {\r\n parentJobType: { id: '' }\r\n },\r\n selectedSubServiceType: {},\r\n jobDetails: { attachments: [] },\r\n attachments: [],\r\n jobId: '',\r\n dueDate: '',\r\n formattedDueDate: '',\r\n jobUrgencyList: [\r\n {\r\n value: \"Emergency\",\r\n jobUrgency: -1\r\n },\r\n {\r\n value: \"Urgent\",\r\n jobUrgency: 1\r\n },\r\n {\r\n value: \"Non-Urgent\",\r\n jobUrgency: 2\r\n }\r\n ],\r\n jobUrgency: 2,\r\n propertyList: [],\r\n value: '',\r\n isLoading: false,\r\n filteredResults: [],\r\n propertyId: '',\r\n isPropertiesLoading: false,\r\n parentJobTypes: [],\r\n primaryJobTypes: [],\r\n secondaryJobTypes: [],\r\n frequentlyUsedServices: [],\r\n isShowMoreServices: false,\r\n locationDetails: {\r\n latitude: '',\r\n longitude: '',\r\n placeId: '',\r\n suburbId: '',\r\n location: ''\r\n },\r\n isMandatoryToUploadFiles: false,\r\n isJobForMe: false,\r\n jobBudget: \"\",\r\n jobForMe: {},\r\n selectedTradees: [],\r\n isSelectedOnDemand: false,\r\n selectedQuoteLimit: 0,\r\n inviteToProviders: false,\r\n isJobPosting: false,\r\n isRestrictKeyCollectionForResidentialProperties: false,\r\n showDisclaimerDrawer: false,\r\n jobPostWorkflowStatus: 1,\r\n propertyLocks: [],\r\n isJobForMeText: '',\r\n isSubServiceTypeSelected: false,\r\n isShowAttchmentDrawer: false,\r\n parentId: '',\r\n childJobTypeId: '',\r\n subChildJobTypeId: '',\r\n jobNumber: '',\r\n isPropertyOwner: (localStorage.userType == 5) ? true : false,\r\n isShowInviteTradeDrawer: false,\r\n budgetAmount: 0,\r\n isPropertySelected: false,\r\n title: '',\r\n isLoadingTroubleshootingGuide: false,\r\n troubleShootingGuideDetails: {\r\n troubleshootGuideId: '',\r\n troubleshootGuide: '',\r\n primaryJobTypeId: '',\r\n secondaryJobTypeId: ''\r\n },\r\n primaryButtonStyle: (this.props.customStyle && this.props.customStyle.primaryButtonStyle) ? this.props.customStyle.primaryButtonStyle : {\r\n color: ''\r\n },\r\n secondaryButtonStyle: (this.props.customStyle && this.props.customStyle.secondaryButtonStyle) ? this.props.customStyle.secondaryButtonStyle : {\r\n color: ''\r\n },\r\n optionsStyle: (this.props.customStyle && this.props.customStyle.optionsStyle) ? this.props.customStyle.optionsStyle : {\r\n color: ''\r\n },\r\n isFromBot: (this.props.isFromBot) ? true : false,\r\n isMaintatanceIssueProvided: false,\r\n isJobPostOrTroubleshootGuideSelected: false,\r\n isDraftJob: false,\r\n tradeeCount: 0,\r\n jobTypeTags: [],\r\n isLoadingJobTypeTags: false,\r\n jobAssignTags: [],\r\n selectedComponent: '',\r\n selectedGoogleImage: [],\r\n selectedFeatureComponent: [],\r\n previousStep: 0,\r\n chatbotSetting: this.props.chatbotSetting ? this.props.chatbotSetting : {\r\n hideQandABot: false,\r\n hideCheckRentalStatus: false,\r\n hideKeyCollectionOptions: false,\r\n hideTroubleshootGuide: false,\r\n enableDraftJobFeature: false\r\n },\r\n maintenanceTroubleshootGuideId: null,\r\n propertyType: \"Residential\",\r\n actionValue: 0,\r\n primaryJobTypeId: '',\r\n secondaryJobTypeId: '',\r\n primaryJobTypeName: '',\r\n secondaryJobTypeName: '',\r\n isShowTroubleshootGuid: false,\r\n \r\n }\r\n\r\n componentDidMount() {\r\n setTimeout(() => {\r\n this.GetTenantPropertiesByUserId();\r\n }, 1000);\r\n\r\n this.setState({\r\n jobId: Guid.create().toString(),\r\n jobDetails: {\r\n id: this.state.jobId\r\n }\r\n });\r\n\r\n }\r\n\r\n componentDidUpdate() {\r\n\r\n }\r\n\r\n getOrganizationSettings(organizationId) {\r\n settingsService.getOrganizationSettingsByOrgId(organizationId)\r\n .then((res) => {\r\n this.setState({\r\n isMandatoryToUploadFiles: res.organizationSettingsModel.allowTenantsToImageAttachmentFeatureForTheJobposting,\r\n isRestrictKeyCollectionForResidentialProperties: res.organizationSettingsModel.isRestrictKeyCollectionForResidentialProperties,\r\n allowTenantsToSeeMatchingTrades: res.organizationSettingsModel.allowTenantsToSeeMatchingTrades,\r\n isEnableSuggestingImage: res.organizationSettingsModel.isEnableSuggestingImage,\r\n isEnableIssueTag: res.organizationSettingsModel.isEnableIssueTag,\r\n })\r\n\r\n })\r\n\r\n }\r\n\r\n GetTenantPropertiesByUserId = () => {\r\n let none = [{ propertyId: 0, propertyName: '--None--', suburbId: '', location: '', address: '', propertyType: 'Residential' }];\r\n\r\n this.setState({ isPropertiesLoading: true });\r\n let properties;\r\n let propertyNames = [];\r\n const { i18n } = this.props;\r\n\r\n propertyService.GetTenantPropertiesByUserId()\r\n .then((res) => {\r\n properties = res.properties;\r\n if (res.properties.length > 0) {\r\n\r\n properties.forEach(x => {\r\n propertyNames.push(x.address ? x.address : \" \");\r\n });\r\n \r\n this.setState({\r\n propertyList: properties,\r\n propertyId: properties[0].propertyId,\r\n isCurrentTenant: properties[0].isCurrentTenant\r\n });\r\n if (localStorage.userType != 5) {\r\n this.getPropertyDetailsByPropertyId(properties[0].propertyId);\r\n }\r\n this.setState({ isPropertiesLoading: false });\r\n this.handlePropertyChange(properties[0].propertyId);\r\n } else {\r\n this.setState({\r\n propertyList: [],\r\n propertyId: 0\r\n });\r\n this.onChangeJobType(1);\r\n }\r\n });\r\n }\r\n\r\n\r\n getPropertyDetailsByPropertyId = (propertyId) => {\r\n const selectedProperty = this.state.propertyList.filter(a => a.propertyId == propertyId);\r\n if (selectedProperty && selectedProperty.length > 0 && selectedProperty[0].propertyId != null) {\r\n this.setState({\r\n propertyId: propertyId,\r\n //locationDetails: {},\r\n formData: {\r\n address: selectedProperty[0].address,\r\n location: selectedProperty[0].location,\r\n propertyId: selectedProperty[0].propertyId,\r\n propertyName: selectedProperty[0].propertyName,\r\n suburbId: selectedProperty[0].suburbId,\r\n propertyType: selectedProperty[0].propertyType\r\n },\r\n locationDetails: selectedProperty[0],\r\n jobForMe: {\r\n propertyType: selectedProperty[0].propertyType,\r\n address: selectedProperty[0].address,\r\n latitude: selectedProperty[0].latitude,\r\n location: selectedProperty[0].location,\r\n longitude: selectedProperty[0].longitude,\r\n placeId: selectedProperty[0].placeId,\r\n suburbId: selectedProperty[0].suburbId,\r\n },\r\n });\r\n this.getOrganizationSettings(selectedProperty[0].orgnizationId);\r\n } else {\r\n this.setState({\r\n propertyId: null,\r\n locationDetails: {},\r\n formData: {\r\n address: '',\r\n location: '',\r\n propertyId: null,\r\n propertyName: '',\r\n suburbId: null,\r\n propertyType: ''\r\n }\r\n });\r\n }\r\n setTimeout(() => {\r\n if (this.state.isJobForMe == 1) {\r\n // document.getElementById('check1').checked = true;\r\n this.setState({ keyCollectType: 1 });\r\n }\r\n }, 500);\r\n }\r\n\r\n onChangeJobType = (value) => {\r\n if (value === 1 && localStorage.userType == 4) {\r\n this.setState({ isJobForMeText: You (tenant) will be paying for this job and are responsible for all costs involved.
});\r\n } else {\r\n this.setState({ isJobForMeText: '' });\r\n }\r\n\r\n this.setState({\r\n isJobForMe: (value === 1) ? true : false,\r\n jobForMe: {\r\n propertyType: '',\r\n address: '',\r\n latitude: '',\r\n location: '',\r\n longitude: '',\r\n placeId: '',\r\n suburbId: '',\r\n budget: ''\r\n },\r\n formData: {\r\n propertyId: \"\"\r\n }\r\n });\r\n }\r\n\r\n onChangePropertyTypeForMe = (event) => {\r\n let formdata = {};\r\n if (!event) {\r\n formdata.propertyType = \"Residential\";\r\n this.setState({ formdata: formdata, propertyType: \"Residential\" });\r\n }\r\n let jobforMe = this.state.jobForMe;\r\n jobforMe.propertyType = event;\r\n this.setState({ jobForMe: jobforMe, propertyType: event });\r\n\r\n formdata = this.state.formData;\r\n formdata.propertyType = event;\r\n this.setState({ formdata: formdata, propertyType: event });\r\n }\r\n\r\n onKeyCollectionChange = (event) => {\r\n this.setState({\r\n keyCollectType: event\r\n });\r\n }\r\n\r\n GetKeyCollectionTypeDescription = () => {\r\n switch (this.state.keyCollectType) {\r\n case '1': return \"Collect keys from office to enter the property\"; break;\r\n case '2': return \"Collect from office, inform tenant on date & time\"; break;\r\n case '3': return \"Contact tenant to arrange access & time\"; break;\r\n default: return \"Key collection Option not mentioned\";\r\n }\r\n }\r\n\r\n handlePropertyChange = (props) => {\r\n this.setState({ property: props });\r\n this.getPropertyDetailsByPropertyId(props);\r\n }\r\n setLocationDetails = (event) => {\r\n this.setState({\r\n locationDetails: event,\r\n jobForMe: {\r\n propertyType: '',\r\n address: event.address,\r\n latitude: event.latitude,\r\n location: event.location,\r\n longitude: event.longitude,\r\n placeId: event.placeId,\r\n suburbId: event.suburbId,\r\n },\r\n formData: {\r\n address: event.address\r\n }\r\n });\r\n }\r\n\r\n\r\n handleOnChangeJobDescription = (value) => {\r\n\r\n let formdata = this.state.formData;\r\n const typedDescription = this.jobDescription.current.value;\r\n formdata.jobDescription = typedDescription;\r\n formdata.jobDescriptionEng = typedDescription;\r\n this.setState({\r\n formdata: formdata,\r\n isMaintatanceIssueProvided: true\r\n });\r\n\r\n }\r\n\r\n handleDueDateChange = (date) => {\r\n this.setState({\r\n dueDate: date,\r\n });\r\n }\r\n\r\n handleJobUrgencyOnChange = (event, props) => {\r\n this.setState({ jobUrgency: props.value });\r\n }\r\n\r\n GetJobUrgency = () => {\r\n return this.state.jobUrgency == -1 ? \"Emergency\" : this.state.jobUrgency == 1 ? \"Urgent\" : \"not-Urgent\";\r\n }\r\n\r\n closeDisclaimer = () => {\r\n this.setState({\r\n showDisclaimerDrawer: false,\r\n });\r\n }\r\n\r\n getTroubleShoutingGuide(index) {\r\n const { i18n } = this.props;\r\n this.setState({\r\n isLoadingTroubleshootingGuide: true\r\n });\r\n jobService.GetTroubleShootingGuide(this.state.formData.propertyId, this.state.formData.jobDescriptionEng).then(res => {\r\n if (res.responseCode == 12 && res.troubleshootGuide != null) { \r\n this.setState({\r\n troubleShootingGuideDetails: res,\r\n maintenanceTroubleshootGuideId: res.troubleshootGuideId,\r\n isLoadingTroubleshootingGuide: false,\r\n isShowTroubleshootGuid: true \r\n \r\n });\r\n \r\n \r\n } else {\r\n this.setState({\r\n troubleShootingGuideDetails: res,\r\n isLoadingTroubleshootingGuide: false,\r\n currentStep: (index + 1),\r\n isShowTroubleshootGuid: false \r\n });\r\n \r\n }\r\n this.SetSelectedServiceType();\r\n })\r\n }\r\n\r\n render() {\r\n const currentStepIndex = this.state.currentStep;\r\n let step = this.showCurrentStep(currentStepIndex);\r\n \r\n return (\r\n );\r\n }\r\n\r\n closeTroubleshootGuid= (index) =>{\r\n this.setState({\r\n isShowTroubleshootGuid: false \r\n });\r\n }\r\n\r\n showCurrentStep = (index) => {\r\n let currentStep = this.state.stepFlow[index][1];\r\n switch (currentStep) {\r\n case \"selectProperty\":\r\n return this.selectPropertyStep(index);\r\n case \"getMaintenaceIssue\":\r\n return this.getMaintenaceIssue(index);\r\n case \"selectKeyCollectionType\":\r\n if (this.state.chatbotSetting.hideKeyCollectionOptions && this.state.isFromBot) {\r\n this.setState({\r\n keyCollectType: this.state.chatbotSetting.defaultKeyCollectionOption,\r\n currentStep: index + 1\r\n }, () => {\r\n return this.nextStep(index);\r\n })\r\n }\r\n else {\r\n return this.selectKeyCollectionType(index);\r\n }\r\n case \"getAttachments\":\r\n return this.getAttachments(index);\r\n\r\n case \"selectSubmitOption\":\r\n return this.selectSubmitOption(index);\r\n case \"setResponse\":\r\n return this.setResponse(index);\r\n case \"setTroubleShooteResponse\":\r\n return this.setTroubleShooteResponse();\r\n case \"jobPostSummary\":\r\n return this.jobPostSummary(index);\r\n case \"GotoHomePage\":\r\n return this.GoToHomePage(index);\r\n case \"GetResolvedResponseByTroubleshootGuide\":\r\n return this.GetResolvedResponseByTroubleshootGuide(index);\r\n default:\r\n return this.nextStep(index);\r\n }\r\n }\r\n\r\n selectPropertyStep = (index) => {\r\n const { propertyList, propertyId, isJobForMe, jobForMe, formData, isPropertyOwner } = this.state;\r\n const forMeText = this.state.isJobForMeText;\r\n const { t } = this.props;\r\n return (\r\n \r\n
\r\n
\r\n
\r\n
Job posting for \r\n \r\n
\r\n { this.onChangeJobType(value) }}>\r\n {this.state.isCurrentTenant && localStorage.userType == 4 ?\r\n
\r\n \r\n
\r\n
\r\n\r\n {(!isJobForMe && propertyList && propertyList.length > 0) ?\r\n
\r\n
\r\n
{this.state.isFromBot ? t('pj_lbl_prop_selection_q') : 'Please Select One of Your Properties'} \r\n \r\n\r\n
\r\n
\r\n { this.handlePropertyChange(value) }}>\r\n {propertyList.map((a, index) => {\r\n return
\r\n \r\n
\r\n\r\n
: ''}\r\n
\r\n What is your Address* \r\n {(propertyId == 0 || isJobForMe || isPropertyOwner) ?\r\n this.setLocationDetails(event)} formData={this.state.formData}> :\r\n
\r\n\r\n
\r\n What is your Location* \r\n {propertyId == 0 || isJobForMe || isPropertyOwner ?
\r\n {(isJobForMe || isPropertyOwner) ?\r\n
\r\n
\r\n
Property Type \r\n
(Choose an option)*
\r\n
\r\n
\r\n this.onChangePropertyTypeForMe(value)}>\r\n \r\n \r\n
: ''}\r\n
\r\n
\r\n
this.nextStep(index)} style={this.state.primaryButtonStyle}>NEXT \r\n
\r\n\r\n
\r\n
\r\n
\r\n
What is the issue ? \r\n
Describe your issue with more details
\r\n
\r\n\r\n
\r\n Job Description \r\n \r\n\r\n
\r\n
\r\n Priority \r\n { return { key: index, text: a.value, value: a.jobUrgency }; })}\r\n placeholder='Choose job Priority'\r\n onChange={this.handleJobUrgencyOnChange}\r\n />\r\n
\r\n {(this.jobUrgency == 1) ?\r\n
\r\n \r\n This considered as an urgent, your prpoperty manager will verify this before they create the job.\r\n \r\n
\r\n : ''}\r\n
\r\n\r\n
\r\n
\r\n
Step 1 of 3 \r\n
\r\n
\r\n
\r\n
\r\n
this.previousStep(index)} style={this.state.secondaryButtonStyle}>BACK \r\n
this.nextStep(index)} style={this.state.primaryButtonStyle}>NEXT \r\n
\r\n
\r\n
\r\n
\r\n
\r\n {(isJobForMe) ? '' :\r\n
\r\n
\r\n
Key collection option for trade \r\n \r\n
\r\n\r\n {(this.state.isRestrictKeyCollectionForResidentialProperties && this.state.formData.propertyType == 'Residential') ?\r\n
\r\n this.onKeyCollectionChange(value)} defaultValue={3}>\r\n \r\n \r\n :\r\n
\r\n \r\n this.onKeyCollectionChange(value)} defaultValue={this.state.keyCollectType}>\r\n \r\n \r\n
\r\n }\r\n
\r\n
\r\n }\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
Upload Photos & Videos \r\n
Please attach photos & videos that describe your issue
\r\n
\r\n
\r\n
\r\n
{ this.setState({ attachments: event }) }}\r\n isJobPost={true}\r\n isFromBot={this.state.isFromBot}\r\n t={t}>\r\n \r\n {(this.state.attachments) ?\r\n \r\n
\r\n
\r\n {this.selectKeyCollectionType(index)}\r\n
\r\n
\r\n
\r\n
step 2 of 3 \r\n
\r\n
\r\n
\r\n
\r\n
this.previousStep(index)} style={this.state.secondaryButtonStyle}>BACK \r\n
this.nextStep(index)} style={this.state.primaryButtonStyle}>NEXT \r\n
\r\n
\r\n
\r\n
\r\n\r\n
\r\n
\r\n
\r\n
\r\n
{this.state.isFromBot ? t('pj_lbl_select_submit_options') : 'Please select submit option.'} \r\n {/*
({this.state.isFromBot ? t('pj_lbl_choose_an_option') : 'choose an option'})
*/}\r\n
\r\n
\r\n { this.onSubmitJob(value) }} value={this.state.actionValue}>\r\n {this.state.isFromBot ? t('pj_button_job_post') : 'Job Post'} \r\n {this.state.isFromBot ? !this.state.chatbotSetting.enableDraftJobFeature &&\r\n {t('pj_button_job_draft')} \r\n :\r\n {this.state.isFromBot ? t('pj_button_job_draft') : 'Job Draft'} \r\n }\r\n \r\n \r\n
\r\n this.previousStep(index)} style={this.state.secondaryButtonStyle}>{this.state.isFromBot ? t('btn_back') : 'BACK'} \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {(this.state.isDraftJob) ?\r\n
{t('pj_lbl_job_draft_response')} \r\n :
\r\n
{t('lbl_jobpost_success')} \r\n
Reference Number : {this.state.jobNumber}
\r\n
\r\n }\r\n
\r\n
\r\n {(this.state.isFromBot) ? this.props.resetChat()} className=\"btn light-blue-button\" style={this.state.primaryButtonStyle} >{t('btn_done')} : Back to home }\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n
\r\n
\r\n
You have successfully resolved the issue \r\n \r\n
\r\n {(this.state.isFromBot) ? this.props.resetChat()} className=\"btn light-blue-button\" style={this.state.primaryButtonStyle} >{t('btn_done')} : Back to home }\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
Please check all the information below is correct \r\n \r\n
\r\n
\r\n
Property \r\n
{this.state.formData.address}
\r\n
\r\n
\r\n
Service \r\n
{this.state.secondaryJobTypeName}
\r\n
\r\n
\r\n
Job Title \r\n
{this.state.primaryJobTypeName}
\r\n
\r\n
\r\n
Urgency \r\n
{this.GetJobUrgency()}
\r\n
\r\n
\r\n
Description \r\n
{this.state.formData.jobDescriptionEng}
\r\n
\r\n
\r\n
Key Collection \r\n
{this.GetKeyCollectionTypeDescription()}
\r\n
\r\n
\r\n
Attachments \r\n {(this.state.attachments) ?\r\n \r\n
\r\n
\r\n
\r\n
Step 3 of 3 \r\n
\r\n
\r\n
\r\n
\r\n
this.previousStep(index)} style={this.state.secondaryButtonStyle}>BACK \r\n
this.nextStep(index)} style={this.state.primaryButtonStyle}>NEXT \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {(jobNotes.length === 0 || jobNotes == null) ? \"Notes not available\" : \r\n (jobNotes.map((note, index) => {\r\n return (\r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
{note.createdUserName} \r\n
{note.createdUserType}
\r\n
\r\n
\r\n
\r\n Posted on {note.createdOn} \r\n
\r\n
\r\n
\r\n
\r\n \r\n {note.type}\r\n \r\n
\r\n
\r\n {(note.attachments && note.attachments.length > 0) ? (\r\n
\r\n
Attachment(s) \r\n \r\n \r\n ) : (\r\n \"\"\r\n )}\r\n
\r\n
\r\n );\r\n }))}\r\n
\r\n
\r\n );\r\n }\r\n\r\n handleChange = (event, name) => {\r\n if (this.state.hasOwnProperty(name)) {\r\n this.setState({ [name]: event });\r\n }\r\n }\r\n\r\n createBody = () => {\r\n var yesterday = Datetime.moment().subtract(1, 'day');\r\n var validDate = function (current) {\r\n return current.isAfter(yesterday);\r\n };\r\n return (\r\n \r\n
\r\n
\r\n {(this.props.jobDetails.scheduleEventId === null) ?\r\n
\r\n Title \r\n
\r\n : ''\r\n }\r\n {(this.props.jobDetails.scheduleEventId === null) ?\r\n
\r\n Description \r\n
\r\n : ''\r\n }\r\n
\r\n
Start
\r\n
\r\n
\r\n { this.handleChange(event, 'fromDate') }} />\r\n
\r\n
\r\n { this.handleChange(event, 'fromTime') }} />\r\n
\r\n
\r\n
\r\n
\r\n
End
\r\n
\r\n
\r\n { this.handleChange(event, 'toDate') }} />\r\n
\r\n
\r\n { this.handleChange(event, 'toTime') }} />\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
{(this.props.jobDetails.scheduleEventId == null) ? 'Schedule Job' : 'Re-Schedule Job'} \r\n \r\n this.props.toggleSheduleJobDrawer()}>\r\n
\r\n \r\n );\r\n };\r\n\r\n createFooter = () => {\r\n return (\r\n <>\r\n \r\n this.onScheduleAJob()}>\r\n \r\n this.props.toggleSheduleJobDrawer()}>\r\n {\" \"}\r\n Cancel{\" \"}\r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n}\r\n\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n return {\r\n isRefresh: state.MyJobs.isRefreshGrid,\r\n userType: state.User.userType,\r\n dateFormat: state.User.dateFormat\r\n };\r\n};\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n refreshGrid: isRefresh => {\r\n dispatch({ type: \"REFRESH_GRID\", isRefresh: isRefresh });\r\n }\r\n };\r\n};\r\nexport default connect(\r\n mapStateToProps,\r\n mapDispatchToProps\r\n)(ScheduleJobDrawer);","import { AXIOS } from '../Utilities/HttpRequest/Axios';\r\n\r\n\r\nconst GetFrequentlyUsedJobTypes = () => {\r\n return AXIOS.GET(`tenant-api/get-grequently-used-job-types?userId=${localStorage.getItem('userId')}`);\r\n}\r\n\r\nconst GetSubJobTypes = (jobRef) => {\r\n return AXIOS.GET(`tenant-api/job-sub-types?parentRef=${jobRef}`);\r\n}\r\n\r\nconst GetSuburb = (suburbName, postCode) => {\r\n return AXIOS.GET(`tenant-api/get-suburb?suburbName=${suburbName}&postCode=${postCode}&userId=${localStorage.getItem('userIdDecripted')}`);\r\n}\r\n\r\nconst CancelJob = (jobId) => {\r\n return AXIOS.GET(`tenant-api/cancel-job?jobId=${jobId}&userId=${localStorage.getItem('userIdDecripted')}`);\r\n}\r\n\r\nconst GetMarketplace = (suburbId, secondaryJobTypeId) => {\r\n return AXIOS.GET(`tenant-api/marketplace?userId=${localStorage.getItem('userIdDecripted')}&suburbId=${suburbId}&secondaryJobType=${secondaryJobTypeId}`);\r\n}\r\n\r\nconst GetJobTradeeCount = (jobTypeId, suburbId) => {\r\n return AXIOS.GET(`tenant-api/getJobTradeeCount?jobTypeId=${jobTypeId}&suburbId=${suburbId}`);\r\n}\r\n\r\nconst GetJobDetailsForExternalUsers = (jobId,userId) => {\r\n return AXIOS.GET(`tenant-api/get-job-details-for-external-users?jobId=${jobId}&userId=${userId}`);\r\n}\r\n\r\nconst GetJobRelatedTimelineForExternalUsers = (jobId) => {\r\n return AXIOS.GET(`tenant-api/get-timeline-for-external-users?jobId=${jobId}&filterType=1`);\r\n}\r\nconst GetOwnerApprovalStatus = (jobId,userId) => {\r\n return AXIOS.GET(`tenant-api/owner-approval-status?jobId=${jobId}&userId=${userId}`);\r\n}\r\nconst OwnerAttendingToTheJob = (jobId, userId, callbackUrl) => {\r\n return AXIOS.GET(`tenant-api/OwnerAttendingToTheJob?jobId=${jobId}&ownerId=${userId}&callbackUrl=${callbackUrl}`);\r\n}\r\nconst GetTroubleShootingGuide = (propertyId,jobDescription) => {\r\n return AXIOS.GET(`tenant-api/troubleshooting-guide?propertyId=${propertyId}&jobDescription=${jobDescription}`);\r\n}\r\nexport const GetPredictiveJobAverageCost = (jobId) => {\r\n return AXIOS.GET(`tenant-api/job/predictiveAverageCost?jobId=${jobId}&userId=${localStorage.getItem('userId')}`);\r\n}\r\nconst saveTroubleShootingResult = (troubleShootingResultData) => {\r\n return AXIOS.POST(`tenant-api/resolved-by-tenant`, troubleShootingResultData);\r\n}\r\nconst GetAIPoweredTroubleShootingGuide = (propertyId,jobDescription) => {\r\n return AXIOS.GET(`tenant-api/openAI-troubleshooting-guide?propertyId=${propertyId}&jobDescription=${jobDescription}`);\r\n}\r\nconst GetJobTypeTags = (jobTypeId) => {\r\n return AXIOS.GET(`tenant-api/issue-tags-forjob-type?jobTypeId=${jobTypeId}`);\r\n}\r\nconst GetPropertyComponent = (propertyId) => {\r\n return AXIOS.GET(`tenant-api/pam/property-component?propertyId=${propertyId}`);\r\n}\r\nconst CreatePropertyComponent = (propertyId) => {\r\n return AXIOS.GET(`tenant-api/pam/create-property-component?propertyId=${propertyId}`);\r\n}\r\nconst GetGoogleImages = (issue,count,url) => {\r\n if(url && url!==\"\"){\r\n return AXIOS.GET(`tenant-api/get-related-images-by-url?issue=${issue}&url=${url}&count=${count}`);\r\n }else{\r\n return AXIOS.GET(`tenant-api/get-image-suggetions?issue=${issue}&count=${count}`);\r\n }\r\n \r\n}\r\nconst GetAllJobTypes = (countryId, organizationId) => {\r\n return AXIOS.GET(`tenant-api/jobtypesByOrganization?countryId=${countryId}&organizationId=${organizationId}`);\r\n}\r\nconst GetAllChildJobTypes = (parentJobTypeId, organizationId) => {\r\n return AXIOS.GET(`tenant-api/childJobTypesByOrganization?parentJobTypeId=${parentJobTypeId}&organizationId=${organizationId}`);\r\n}\r\nconst GetAllTrades = (isIncludePendingInvitationTrades, isTenantManagedJob,jobId,jobTypeId,propertyId,removeSuburbFilter,suburbId,tradeSearchtext,pageSize,pageIndex) => {\r\n return AXIOS.GET(`tenant-api/jobTradees?userId=${localStorage.getItem('userId')}\r\n &isIncludePendingInvitationTrades=${isIncludePendingInvitationTrades}&isTenantManagedJob=${isTenantManagedJob}\r\n &jobId=${jobId}&jobTypeId=${jobTypeId}&propertyId=${propertyId}&removeSuburbFilter=${removeSuburbFilter}&suburbId=${suburbId}&tradeSearchtext=${tradeSearchtext}&pageSize=${pageSize}&pageIndex=${pageIndex}`);\r\n}\r\nconst GetPropertyDetailsWithHoldAmount = () => {\r\n return AXIOS.GET(`tenant-api/properties?propertyUserId=${localStorage.getItem('userId')}`);\r\n}\r\nconst GetVariationHistory = (jobId) => {\r\n return AXIOS.GET(`tenant-api/job-variation-history?jobId=${jobId}`);\r\n}\r\nconst GetRecurringJobList = (jobId) => {\r\n return AXIOS.GET(`tenant-api/get-recurring-joblist?parentJobId=${jobId}`);\r\n}\r\nconst GetJobNotesByJobId = (jobId, userId) =>{\r\n return AXIOS.GET(`tenant-api/job-notes?jobId=${jobId}&userId=${userId}`);\r\n}\r\nconst jobService = {\r\n OwnerAttendingToTheJob,\r\n GetJobRelatedTimelineForExternalUsers,\r\n GetJobTradeeCount,\r\n GetMarketplace,\r\n GetSuburb,\r\n GetFrequentlyUsedJobTypes,\r\n GetSubJobTypes,\r\n GetAllJobTypes,\r\n CancelJob,\r\n GetJobDetailsForExternalUsers,\r\n GetOwnerApprovalStatus,\r\n GetTroubleShootingGuide,\r\n saveTroubleShootingResult,\r\n GetPredictiveJobAverageCost,\r\n GetAIPoweredTroubleShootingGuide,\r\n GetJobTypeTags,\r\n GetPropertyComponent,\r\n CreatePropertyComponent,\r\n GetGoogleImages,\r\n GetAllChildJobTypes,\r\n GetAllTrades,\r\n GetPropertyDetailsWithHoldAmount,\r\n GetVariationHistory,\r\n GetRecurringJobList,\r\n GetJobNotesByJobId\r\n}\r\n\r\nexport default jobService;","import React from \"react\";\r\nimport Drawer from \"../../../Common/Drawer/Drawer\";\r\nimport StarRatingComponent from \"react-star-rating-component\";\r\nimport userService from \"../../../../Services/UserService\";\r\nimport Loader from \"react-loader-spinner\";\r\nimport moment from 'moment';\r\nimport { Tab, Tabs } from \"react-bootstrap\";\r\n\r\nexport default class ProviderMiniProfileDrawer extends React.Component {\r\n state = {\r\n showProfileDrawer: false,\r\n profileDetails: {},\r\n isPmView: false,\r\n isSpView: false,\r\n isUserView: false,\r\n isDataLoaded: false,\r\n profileImageUrl: \"/images/default-profile.png\",\r\n isSelectedTradee: false,\r\n page: 1,\r\n total: 0,\r\n feedbackList: [],\r\n filteredFeedback: [],\r\n filterUserType: 0,\r\n isShowAreas: false,\r\n isLoadingFeedback: false,\r\n consumerTypePropertyId: ''\r\n };\r\n\r\n constructor(props) {\r\n super(props);\r\n }\r\n\r\n componentDidMount() {\r\n if (this.props.userId != null) {\r\n this.setState({ showProfileDrawer: true, isSelectedTradee: this.props.isSelected })\r\n this.getProfile(this.props.userId);\r\n }\r\n }\r\n\r\n render() {\r\n\r\n let drawer = this.createDrawer();\r\n return {drawer}
;\r\n\r\n }\r\n\r\n toggleProfileDrawer = isClose => {\r\n this.setState(state => ({\r\n showProfileDrawer: !this.state.showProfileDrawer\r\n }));\r\n\r\n if (isClose) {\r\n this.props.onCloseProviderDrawer();\r\n }\r\n\r\n };\r\n\r\n filterByUserType = (event) => {\r\n if (document.getElementById('filterUserType') != null) {\r\n let val = document.getElementById('filterUserType').value;\r\n let result = (val == 0) ? this.state.feedbackList : this.state.feedbackList.filter(a => a.feedBackUserType == val);\r\n let pageCount = document.getElementById('filterPageSize').value;\r\n result = (pageCount == -999) ? result : result.slice(0, pageCount);\r\n this.setState({\r\n filteredFeedback: result\r\n })\r\n }\r\n }\r\n\r\n userTypeFormatter(cell) {\r\n switch (cell) {\r\n case 3:\r\n return Property Manager Tenant Consumer {new Date(cell).toLocaleDateString()} ;\r\n }\r\n\r\n getFeedbackTable() {\r\n\r\n return (\r\n \r\n \r\n \r\n {this.state.filteredFeedback.map((element, index) => {\r\n return (\r\n \r\n \r\n \r\n \r\n {this.userTypeFormatter(element.feedBackUserType)}\r\n
\r\n \r\n {element.user}
\r\n \r\n
\r\n \r\n \r\n {element.avarageRating}
\r\n \r\n \r\n \r\n )\r\n })}\r\n \r\n
\r\n \r\n );\r\n }\r\n\r\n createDrawer = () => {\r\n const header = this.createProfileHeader();\r\n const body = this.createProfileBody();\r\n\r\n return (\r\n \r\n );\r\n };\r\n\r\n\r\n createProfileHeader = () => {\r\n return (\r\n <>\r\n \r\n Profile View\r\n \r\n \r\n this.toggleProfileDrawer(true)}\r\n >\r\n
\r\n \r\n );\r\n };\r\n\r\n createProfileBody = () => {\r\n\r\n const { providerProfile } = this.state.profileDetails;\r\n if (this.state.isDataLoaded) {\r\n return (\r\n <>\r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n
\r\n\r\n
\r\n
\r\n\r\n
\r\n
\r\n
\r\n\r\n
\r\n
\r\n\r\n
\r\n
\r\n
\r\n {providerProfile.displayName} \r\n
\r\n
\r\n {providerProfile.email}\r\n
\r\n
\r\n {(providerProfile.mobileNumber) ? providerProfile.mobileNumber : \"\"}\r\n {(providerProfile.officePhone) ? \" / \" + providerProfile.officePhone : \"\"}\r\n
\r\n\r\n
\r\n
Services \r\n
\r\n
\r\n {this.state.profileDetails.providerProfile.primaryServices.map((service, index) => {\r\n return {service.title} \r\n })}\r\n
\r\n
\r\n
Areas Covered \r\n
\r\n
\r\n {this.state.profileDetails.providerProfile.preferredStates.map(element => {\r\n return {element.label} \r\n })}\r\n
\r\n
\r\n\r\n
\r\n
\r\n
\r\n
Hourly rate \r\n
${providerProfile.hourlyRate}
\r\n
\r\n
\r\n
\r\n
\r\n
Callout fee \r\n
${providerProfile.calloutFee}
\r\n
\r\n
\r\n
\r\n
\r\n
Jobs completed \r\n
{providerProfile.completedJobsCount}
\r\n
\r\n
\r\n\r\n
\r\n\r\n
\r\n {(providerProfile.hasABNBadge) ?\r\n
\r\n
\r\n
\r\n ABN\r\n
\r\n
: ''}\r\n {(providerProfile.hasCm3CertifiedBadge) ?\r\n
\r\n
\r\n
\r\n CM3\r\n
\r\n
: ''}\r\n
\r\n\r\n
\r\n
\r\n ABN \r\n {(providerProfile.abn) ? providerProfile.abn : \"N/A\"} \r\n
\r\n
\r\n Phone Number \r\n {(providerProfile.mobileNumber) ? providerProfile.mobileNumber : \"\"}\r\n {(providerProfile.officePhone) ? \" / \" + providerProfile.officePhone : \"\"} \r\n
\r\n
\r\n Business Name \r\n {(providerProfile.businessName) ? providerProfile.businessName : \"N/A\"} \r\n
\r\n
\r\n\r\n
\r\n
Licensed Trades \r\n {this.getLicensedTrades()}\r\n\r\n Insurance \r\n {this.getInsurance()}\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n
Feedback Received ({this.state.feedbackList.length}) \r\n
\r\n
\r\n
\r\n Filter By User Type \r\n this.filterByUserType(event)} id=\"filterUserType\">\r\n All \r\n Property Managers \r\n Property Tenants \r\n Consumers \r\n \r\n
\r\n
\r\n
\r\n
\r\n Per page \r\n this.filterByUserType(event)} id=\"filterPageSize\">\r\n 5 \r\n 10 \r\n 15 \r\n 20 \r\n All \r\n \r\n
\r\n
\r\n
\r\n
\r\n {(this.state.isLoadingFeedback) ?\r\n
\r\n : this.getFeedbackTable()}\r\n
\r\n
\r\n \r\n\r\n \r\n
\r\n
\r\n
\r\n {(providerProfile.tradeeLeaveCalendars && providerProfile.tradeeLeaveCalendars.length > 0) ?\r\n
\r\n {providerProfile.tradeeLeaveCalendars.map((service, index) => {\r\n return
On Leave from {moment(new Date(service.startDateTime)).format('DD/MM/YYYY').toString()} until {moment(new Date(service.startDateTime)).format('DD/MM/YYYY').toString()} ({service.numberOfDays} Days)
\r\n })}\r\n
\r\n : ''}\r\n
\r\n
\r\n
\r\n
\r\n
\r\n SP Name : \r\n {providerProfile.displayName}\r\n
\r\n
\r\n ABN : \r\n {providerProfile.abn}\r\n
\r\n
\r\n Business Name : \r\n {providerProfile.businessName}\r\n
\r\n
\r\n Email : \r\n {providerProfile.email}\r\n
\r\n
\r\n Mobile No : \r\n {providerProfile.mobileNumber}\r\n
\r\n {(providerProfile.officePhone != null) ?\r\n
\r\n Office No : \r\n {providerProfile.officePhone}\r\n
: ''}\r\n
\r\n \r\n Ready to Work \r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n Rating : \r\n {providerProfile.overallRating}\r\n
\r\n
\r\n Country in Operation : \r\n {providerProfile.workingCountry}\r\n
\r\n
\r\n
Skills : \r\n
\r\n
\r\n {this.state.profileDetails.providerProfile.primaryServices.map((service, index) => {\r\n return {service.title} \r\n })}\r\n
\r\n\r\n
\r\n
\r\n
\r\n\r\n
\r\n
\r\n
${providerProfile.hourlyRate}
\r\n
\r\n Per hour \r\n rate \r\n
\r\n
\r\n
\r\n
{providerProfile.completedJobsCount}
\r\n
\r\n Completed \r\n Jobs \r\n
\r\n
\r\n
\r\n
${providerProfile.calloutFee}
\r\n
\r\n Callout \r\n Fee \r\n
\r\n
\r\n
\r\n
\r\n {(providerProfile.hasABNBadge) ?\r\n
\r\n
\r\n
\r\n ABN\r\n
\r\n
: ''}\r\n {(providerProfile.hasCm3CertifiedBadge) ?\r\n
\r\n
\r\n
\r\n CM3\r\n
\r\n
: ''}\r\n
\r\n
\r\n
\r\n
\r\n
Feedback Received ({this.state.feedbackList.length}) \r\n
\r\n
\r\n Filter By User Type \r\n this.filterByUserType(event)} id=\"filterUserType\">\r\n All \r\n Property Managers \r\n Property Tenants \r\n Consumers \r\n \r\n
\r\n
\r\n
\r\n
\r\n Per page \r\n this.filterByUserType(event)} id=\"filterPageSize\">\r\n 5 \r\n 10 \r\n 15 \r\n 20 \r\n All \r\n \r\n
\r\n
\r\n
\r\n
\r\n {(this.state.isLoadingFeedback) ?\r\n
\r\n : this.getFeedbackTable()}\r\n
\r\n
\r\n
\r\n
\r\n \r\n {providerProfile.providerLicenses.map((element, index) => {\r\n return (\r\n \r\n {element.mainJobTypeName} \r\n {element.licenceNumber} \r\n \r\n )\r\n })}\r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n
Applicable to All job Types \r\n \r\n
\r\n
\r\n \r\n \r\n Public Liability \r\n $ {providerProfile.publicLiabilityDisplay} \r\n \r\n \r\n Professional indemnity \r\n $ {providerProfile.professionalIndemnityDisplay} \r\n \r\n \r\n
\r\n
\r\n \r\n {service.title}\r\n \r\n
\r\n );\r\n }\r\n );\r\n return skills;\r\n };\r\n\r\n getProfile = userId => {\r\n try {\r\n let filters = {\r\n userId: userId,\r\n includeAttachments: false,\r\n includeBidRatings: false,\r\n includeNearbySuburbs: true,\r\n includeTradeeAttachments: false,\r\n isDetailedView: false,\r\n includeBadges: true,\r\n isTimeline: false,\r\n inCludePrefferedJobTypes: true,\r\n numberOfSuburbsNeeded: 10,\r\n ischat: false,\r\n consumerTypePropertyId: this.props.consumerTypePropertyId\r\n };\r\n let isLoadedSpProfile = false;\r\n let isLoadedSpFeedback = false;\r\n this.setState({\r\n isLoadingFeedback: true,\r\n isLoadingData: true\r\n });\r\n userService.getProviderProfile(btoa(JSON.stringify(filters))).then(dataJson => {\r\n isLoadedSpProfile = true;\r\n this.setState({\r\n profileDetails: dataJson,\r\n isDataLoaded: true,\r\n isLoadingData: false\r\n });\r\n\r\n if (dataJson.providerProfile.userId !== null) {\r\n this.setState({\r\n isPmView: false,\r\n isSpView: true,\r\n isUserView: false\r\n });\r\n if (\r\n dataJson.providerProfile.profileImageUrl != null &&\r\n dataJson.providerProfile.profileImageUrl.trim() != \"\"\r\n ) {\r\n this.setState({\r\n profileImageUrl: dataJson.providerProfile.profileImageUrl\r\n });\r\n }\r\n } else if (dataJson.propertyManagerProfile.userId !== null) {\r\n this.setState({\r\n isPmView: true,\r\n isSpView: false,\r\n isUserView: false\r\n });\r\n\r\n if (\r\n dataJson.propertyManagerProfile.profileImageUrl !== null ||\r\n dataJson.propertyManagerProfile.profileImageUrl.trim() != \"\"\r\n ) {\r\n this.setState({\r\n profileImageUrl: dataJson.propertyManagerProfile.profileImageUrl\r\n });\r\n }\r\n } else if (dataJson.userProfile.userId !== null) {\r\n this.setState({\r\n isPmView: false,\r\n isSpView: false,\r\n isUserView: true\r\n });\r\n if (\r\n dataJson.userProfile.profileImageUrl !== null ||\r\n dataJson.userProfile.profileImageUrl.trim() != \"\"\r\n ) {\r\n this.setState({\r\n profileImageUrl: dataJson.userProfile.profileImageUrl\r\n });\r\n }\r\n } else {\r\n this.setState({\r\n isDataLoaded: false\r\n });\r\n }\r\n\r\n userService.GetProviderBidFeedbacks(this.props.userId).then(res => {\r\n isLoadedSpFeedback = true\r\n this.setState({\r\n feedbackList: res,\r\n isLoadingFeedback: false,\r\n total: res.length\r\n });\r\n if (res.length > 0) {\r\n this.filterByUserType('1')\r\n }\r\n\r\n })\r\n })\r\n\r\n\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n };\r\n\r\n}\r\n","import React, { Component } from \"react\";\r\nimport { Button, Modal } from 'semantic-ui-react'\r\n\r\nclass TroubleshootGuidModal extends Component {\r\n constructor(props) {\r\n super(props);\r\n }\r\n\r\n render() {\r\n return \r\n
\r\n this.props.closeModal(this.props.index)}> \r\n \r\n \r\n
\r\n
\r\n
Please check the steps below to see if they help you to solve your issue \r\n
You can proceed to submit your job after tying the below steps
\r\n
\r\n
\r\n
\r\n
\r\n \r\n {/* this.props.closeModal(this.props.index)}>close */}\r\n \r\n this.props.continueJobPosting(this.props.index)}>Issue Not Fixed \r\n this.props.saveTroubleShootResult(true)}>Issue is Fixed \r\n
\r\n \r\n\r\n \r\n
{drawer}
;\r\n }\r\n\r\n createDrawer = () => {\r\n let drawerClassName = \"ba-drawer drawer-\" + this.props.size;\r\n let headerIcons = (this.props.drawerIcons) ? this.props.drawerIcons : ''\r\n return (\r\n \r\n \r\n
\r\n {headerIcons}\r\n
{this.props.header}
\r\n
{this.props.body}
\r\n
{this.props.footer}
\r\n
\r\n
\r\n \r\n {\r\n props => (\r\n \r\n \r\n )\r\n }\r\n \r\n \r\n \r\n );\r\n }\r\n\r\n componentDidMount() {\r\n }\r\n\r\n CaptionElement = () => {\r\n if(this.props.caption){\r\n return (\r\n \r\n {this.props.caption}\r\n \r\n )\r\n }\r\n return <>\r\n }\r\n\r\n getPagination() {\r\n return {\r\n page: this.props.page,\r\n sizePerPage: this.props.sizePerPage,\r\n totalSize: this.props.totalSize,\r\n filter:this.props.filter\r\n }\r\n }\r\n\r\n handleTableChange = (type, { page, sizePerPage, filters, sortField, sortOrder, cellEdit }) => {\r\n //this.setState({ loading: true });\r\n //console.log('this.state.loading: ', this.state.loading);\r\n this.props.onTableChange(type, { page, sizePerPage, filters, sortField, sortOrder, cellEdit });\r\n //this.setState({ loading: false });\r\n //console.log('this.state.loading: ', this.state.loading);\r\n }\r\n\r\n getOverlay = () => (\r\n \r\n Some content or children or something.
\r\n \r\n );\r\n}\r\n\r\n/// Set property types\r\nBootstrapTable.propTypes = {\r\n data: PropTypes.array.isRequired,\r\n page: PropTypes.number.isRequired,\r\n totalSize: PropTypes.number.isRequired,\r\n sizePerPage: PropTypes.number.isRequired,\r\n \r\n //onTableChange: PropTypes.func.isRequired\r\n};\r\n\r\n\r\n\r\n// const NoDataIndication = () => (\r\n// \r\n//
\r\n//
\r\n//
\r\n//
\r\n//
\r\n//
\r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n } else if (isInspectionAttachmentWithComments) {\r\n return (\r\n <>\r\n \r\n \r\n \r\n \r\n \r\n
\r\n
\r\n
Comments : \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n )\r\n } else {\r\n return (\r\n <>\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n\r\n }\r\n\r\n}\r\n\r\n\r\nexport default FilesViewer;","import * as React from \"react\";\r\nimport Viewer from \"react-viewer\";\r\nimport FileViewer from \"./FilesViewer\";\r\nconst ImageViewer = (props) => {\r\n const [visible, setVisible] = React.useState(false);\r\n const [imgUrl, setImgUrl] = React.useState(\"\");\r\n const [downloadImgUrl, setDownloadImgUrl] = React.useState(\"\");\r\n const [fileType, setFileType] = React.useState(\"\");\r\n const [filePath, setFilePath] = React.useState(\"\");\r\n const [modalShow, setModalShow] = React.useState(false);\r\n const [isCommentsAvailable, setCommentsAvailable] = React.useState(false);\r\n const [attachmentComment, setAttachmentComment] = React.useState(\"\");\r\n return ( \r\n <>\r\n {props.attachments && props.attachments.length > 0 ? (\r\n \r\n {(props.isExternal) ? '' : props.isEsignature ? (\r\n
\r\n e-Signature\r\n
\r\n ) : props.isInvoice ? (\r\n // AN-61716 : d-none applied according to the ticket\r\n
\r\n Invoice Attachments\r\n
\r\n ) : props.isAfter ? (\r\n
\r\n Result Attachments\r\n
\r\n ) : props.isFromAsset ? (\r\n
\r\n
\r\n ) : props.isFromAsset_ff_cp ? (\r\n
\r\n Front Facing Photo and Compliance Plate Photo\r\n
\r\n ): props.isVariation ? <> \r\n
\r\n Variation Attachments\r\n
\r\n : props.isInspectionReport? '' : (\r\n
\r\n {props.isFromBot ? 'Job attachments' : props.isFromTenantManageJobPost ? 'Job attachments': props.attachments[0].type == 3 ? 'Job attachments':'Quote attachments'}\r\n
\r\n )}\r\n\r\n {props.attachments.map((uploadedFile) => {\r\n var defaultFileSrc = \"/Images/attachment.png\";\r\n\r\n if (uploadedFile.extension === \".csv\") {\r\n defaultFileSrc = \"/Images/attached-file-csv.svg\";\r\n } else if (uploadedFile.extension === \".pdf\") {\r\n defaultFileSrc = \"/Images/attached-file-pdf.svg\";\r\n } else if (uploadedFile.extension === \".mov\") {\r\n defaultFileSrc = \"/Images/attached-file-mov.svg\";\r\n } else if (uploadedFile.extension === \".mp4\") {\r\n defaultFileSrc = \"/Images/attached-file-mp4.svg\";\r\n } else if (uploadedFile.extension === \".tiff\") {\r\n defaultFileSrc = \"/Images/attached-file-tiff.svg\";\r\n } else if (uploadedFile.extension === \".msg\") {\r\n defaultFileSrc = \"/Images/attached-file-msg.svg\";\r\n } else if (uploadedFile.extension === \".eml\") {\r\n defaultFileSrc = \"/Images/attached-file-eml.svg\";\r\n } else{\r\n defaultFileSrc = \"/Images/attachment.png\";\r\n }\r\n \r\n return (\r\n \r\n
\r\n {props.isFromAsset && \r\n
{ props.RemoveFromList(uploadedFile.fileId)}}>
}\r\n
\r\n
\r\n
\r\n
{\r\n e.target.onerror = null;\r\n e.target.src = defaultFileSrc;\r\n }}\r\n onClick={(e) => {\r\n if(uploadedFile.fileType==1 && !uploadedFile.isCommentsAvailable && uploadedFile.extension != '.tiff'){\r\n setDownloadImgUrl(uploadedFile.fileUrl);\r\n setImgUrl(e.target.src);\r\n setVisible(true);\r\n } else {\r\n \r\n if (uploadedFile.isCommentsAvailable) {\r\n setFileType(uploadedFile.extension.split('.')[1]);\r\n setFilePath(uploadedFile.fileUrl);\r\n setCommentsAvailable(true);\r\n setAttachmentComment(uploadedFile.attachmentComments);\r\n setModalShow(true);\r\n }\r\n else {\r\n setCommentsAvailable(false);\r\n setAttachmentComment(\"\");\r\n window.open(uploadedFile.fileUrl);\r\n }\r\n }\r\n }}\r\n />\r\n \r\n
\r\n {uploadedFile.isCommentsAvailable ?
\r\n : ''}\r\n
\r\n
\r\n
\r\n {props.isInspectionReport?
{uploadedFile.lastModified}
\r\n :''}\r\n
\r\n
\r\n
\r\n );\r\n })}\r\n\r\n
{\r\n setVisible(false);\r\n }}\r\n images={[{ src: imgUrl, alt: \"\", downloadUrl: downloadImgUrl }]}\r\n />\r\n setModalShow(false)} \r\n fileType = {fileType}\r\n filePath={filePath}\r\n isCommentsAvailable={isCommentsAvailable}\r\n attachmentComment={attachmentComment}\r\n />\r\n \r\n {/* Reject \r\n \r\n {drawer}\r\n \r\n );\r\n }\r\n\r\n createDrawer = () => {\r\n const header = this.createJobRejectHeader();\r\n const body = this.createJobRejectBody();\r\n const footer = this.createJobRejectFooter();\r\n\r\n return (\r\n \r\n );\r\n };\r\n\r\n createJobRejectHeader = () => {\r\n return (\r\n <>\r\n Reject Job \r\n \r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n createJobRejectBody = () => {\r\n return (\r\n \r\n
\r\n
\r\n
\r\n Note* \r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n {\" \"}\r\n Mark as Completed\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n {\" \"}\r\n CANCEL{\" \"}\r\n \r\n \r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n onClickJobReject = () => {\r\n if(this.description.current.value == '' || this.description.current.value == undefined || this.description.current.value == null) {\r\n toast.error(\"Please enter job rejecting reason.\",{\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n return;\r\n }\r\n this.toggleJobRejectButton();\r\n if (localStorage.getItem('userType') != '5' && this.props.jobDetails.workflowStatusId == 107) {\r\n AXIOS.GET(\r\n `tenant-api/job-review-reject?userId=${localStorage.getItem(\r\n \"userId\"\r\n )}&jobId=${this.props.jobDetails.id}¬e=${\r\n this.description.current.value\r\n }`\r\n ).then(response => {\r\n if (response) {\r\n toast.success(\"Job Review Rejected.\",{\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.toggleJobRejectDrawer();\r\n this.props.toggleDrawer(true);\r\n } else {\r\n toast.error(\"Error occured. Please try again.\",{\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n }\r\n this.toggleJobRejectButton();\r\n });\r\n }\r\n else {\r\n AXIOS.GET(\r\n `tenant-api/job-reject-owner?userId=${localStorage.getItem(\r\n \"userId\"\r\n )}&jobId=${this.props.jobDetails.id}¬e=${\r\n this.description.current.value\r\n }`\r\n ).then(response => {\r\n if (response) {\r\n toast.success(\"Job Rejected.\",{\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.toggleJobRejectDrawer();\r\n // this.props.getJobDetails(this.props.jobDetails.id);\r\n this.props.toggleDrawer(true);\r\n //this.props.refreshGrid(true);\r\n } else {\r\n toast.error(\"Error occured. Please try again.\",{\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n }\r\n this.toggleJobRejectButton();\r\n });\r\n }\r\n \r\n };\r\n\r\n toggleJobRejectDrawer = () => {\r\n this.setState(state => ({\r\n showJobRejectDrawer: !this.state.showJobRejectDrawer\r\n }));\r\n };\r\n\r\n toggleJobRejectButton = () => {\r\n this.setState(state => ({\r\n disableJobRejectButton: !this.state.disableJobRejectButton\r\n }));\r\n };\r\n\r\n}\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n return {\r\n isRefresh: state.MyJobs.isRefreshGrid\r\n };\r\n};\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n refreshGrid: isRefresh => {\r\n dispatch({ type: \"REFRESH_GRID\", isRefresh: isRefresh });\r\n }\r\n };\r\n};\r\n\r\nexport default connect(\r\n mapStateToProps,\r\n mapDispatchToProps\r\n)(RejectDrawer);\r\n","import { Button, ButtonToolbar, ToggleButton, ToggleButtonGroup } from \"react-bootstrap\";\r\nimport Loader from \"react-loader-spinner\";\r\nimport jobService from '../../../Services/JobService';\r\nimport React from 'react';\r\nimport translateService from '../../../Services/TranslateService';\r\nimport './JobIssueTag.scss';\r\n\r\nclass JobIssueTag extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n isLoadingJobTypeTags: false,\r\n jobTypeTags: [],\r\n jobAssignTags: [],\r\n isJobTypeTagsNotFound: false\r\n\r\n };\r\n this.state.jobAssignTags = this.props.data != undefined ? this.props.data.jobAssignTags:[];\r\n };\r\n\r\n\r\n\r\n componentWillMount() {\r\n this.getJobTypeTagsData();\r\n }\r\n\r\n render() {\r\n const { jobTypeTags, isLoadingJobTypeTags, isJobTypeTagsNotFound } = this.state;\r\n const { t } = this.props.data;\r\n return (\r\n <>\r\n {!isJobTypeTagsNotFound ? \r\n
\r\n {!isLoadingJobTypeTags &&
\r\n
{t != undefined ? t('lbl_header_of_tags') : \"Choose tags that best describe your issue.\"} \r\n
({t != undefined ? t('lbl_chooseoption') : \"choose an option\"})
\r\n
}\r\n {!isLoadingJobTypeTags &&
\r\n \r\n\r\n this.handleJobTypeTagOnChange(value)}\r\n >\r\n {jobTypeTags.map((a, index) => {\r\n return \r\n\r\n \r\n
}\r\n {isLoadingJobTypeTags &&
}\r\n {isJobTypeTagsNotFound &&
{t != undefined ? t('lbl_tags_not_found') : \"Tags not found for selected job type\"} }\r\n
\r\n {!isLoadingJobTypeTags &&
\r\n this.props.data.previousStep(this.props.data.index)} style={this.props.data.secondaryButtonStyle}>{t != undefined ? t('btn_back') : \"BACK\"} \r\n this.props.data.nextStep({ data: this.state.jobAssignTags, index: this.props.data.index, t: t })} style={this.props.data.primaryButtonStyle}>{t != undefined ? t('btn_next') : \"NEXT\"} \r\n
\r\n }\r\n
\r\n
\r\n {!isLoadingPropertyComponent &&
\r\n
{t != undefined ? t('lbl_property_componet') : \"Choose components for your issue.\"} \r\n
({t != undefined ? t('lbl_chooseoption') : \"choose an option\"})
\r\n
}\r\n {!isLoadingPropertyComponent &&
\r\n \r\n\r\n this.handlePropertyComponentOnChange(value)}\r\n >\r\n {propertyComponents.map((a, index) => {\r\n return \r\n\r\n \r\n
}\r\n {isComponentSelected &&
\r\n
Features for the {selectedComponentName} \r\n\r\n \r\n this.handlePropertyFeatureComponentOnChange(value)} >\r\n {componentFeatures.map((a, index) => {\r\n return \r\n \r\n\r\n }\r\n {isLoadingPropertyComponent &&
}\r\n {isPropertyComponentNotFound &&
{t != undefined ? t('btn_generate_component') : \"Genarate components\"}
}\r\n
\r\n {!isLoadingPropertyComponent &&
\r\n this.next(t)} style={this.props.data.primaryButtonStyle}>{t != undefined ? t('btn_next') : \"NEXT\"} \r\n this.props.data.previousStep(this.props.data.index)} style={this.props.data.secondaryButtonStyle}>{t != undefined ? t('btn_back') : \"BACK\"} \r\n
\r\n }\r\n
\r\n
{ e.target.onerror = null; e.target.src = \"/Images/attachment.png\" }}\r\n onClick={(e) => { setDownloadImgUrl(props.attachments.fileUrl); setImgUrl(e.target.src); setVisible(true); }} />\r\n\r\n { setVisible(false); }}\r\n images={[{ src: imgUrl, alt: '', downloadUrl: downloadImgUrl }]}\r\n />\r\n Emergency
;\r\n case 1:\r\n case \"Urgently\":\r\n return Urgently
;\r\n case 2:\r\n case \"Within a few days\":\r\n return Within a few days
;\r\n case 3:\r\n case \"Within a week\":\r\n return Within a week
;\r\n case 999:\r\n case \"By this date\":\r\n return By this date
;\r\n default:\r\n return {urgencyType === 0 ? \"\" : urgencyType}
;\r\n }\r\n }\r\n\r\n propertyTypeName(propertyType) {\r\n switch (propertyType) {\r\n case 0:\r\n return \"Residential\";\r\n case 1:\r\n return \"Commercial\";\r\n case 2:\r\n return \"Unknown\";\r\n case 3:\r\n return \"Strata\";\r\n }\r\n }\r\n\r\n budgetFormatter(budgetId, budgetAmount, budgetMax) {\r\n \r\n switch (budgetId) {\r\n case 0:\r\n \r\n return Other
;\r\n case 1:\r\n \r\n return Under $500
;\r\n case 2:\r\n \r\n return Between $500 - $1000
;\r\n case 3:\r\n \r\n return Between $1000 - $2000
;\r\n case 4:\r\n return Between $2000 - $5000
\r\n case 5:\r\n \r\n return Over $5000
;\r\n case 7:\r\n return {'$ ' + budgetAmount} - {'$ ' + budgetMax}
;\r\n case -999:\r\n return {budgetAmount == 0 ? 'Not supplied' : '$ ' + budgetAmount}
;\r\n case 6:\r\n return Under ${budgetAmount}
;\r\n }\r\n }\r\n\r\n //for getting average job cost\r\n getPredictiveAverageCost = (jobId) => {\r\n try {\r\n jobService.GetPredictiveJobAverageCost(jobId)\r\n .then(data => {\r\n this.setState({ averageCostModel: data });\r\n this.setState({ isAverageCostModelLoaded: true });\r\n });\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n if (this.props.showAverageCostWhenOwnerApproval) {\r\n this.getPredictiveAverageCost(this.props.jobDetails.id);\r\n }\r\n }\r\n \r\n render() {\r\n let isTenant = localStorage.getItem(\"userType\") == 4 ? true : false;\r\n const jobData = this.props.jobDetails;\r\n return (\r\n \r\n
\r\n {this.urgencyFormatter(jobData.jobUrgencyDisplay)}\r\n Posted on:\r\n \r\n {jobData.postedOn}\r\n \r\n \r\n \r\n \r\n #{jobData.jobNumber} \r\n
\r\n
{jobData.title} \r\n
\r\n
\r\n
\r\n {jobData.primaryJobTypeDisplay}: \r\n {jobData.secondaryJobTypeDisplay} \r\n {(jobData.jobTypeDisplay !== jobData.primaryJobTypeDisplay && jobData.jobTypeDisplay !== jobData.secondaryJobTypeDisplay)? : {jobData.jobTypeDisplay} : ''}\r\n
\r\n\r\n
\r\n {(this.props.showAverageCostWhenOwnerApproval && this.state.isAverageCostModelLoaded) ?\r\n
\r\n
The suggested average cost range for the job is +/-${this.state.averageCostModel.jobAverageCost}
\r\n
\r\n :\r\n ''\r\n }\r\n
\r\n
\r\n
Status
\r\n
\r\n {(jobData.statusDisplay == 'Job Approval Pending' && this.props.isMyJobs) ? 'Job Completed' : jobData.statusDisplay}\r\n
\r\n
\r\n
\r\n
Estimate
\r\n {this.budgetFormatter(jobData.budgetId, jobData.budgetAmount, jobData.budgetMax)}\r\n
\r\n
\r\n
Property
\r\n
{jobData.propertyName}
\r\n
\r\n
\r\n
Property Type
\r\n
{this.propertyTypeName(jobData.propertyTypeId)}
\r\n
\r\n
\r\n
Suburb
\r\n
{jobData.suburbDisplay}
\r\n
\r\n
\r\n
Address
\r\n
{jobData.address}
\r\n
\r\n
\r\n
Quote Limit
\r\n
{jobData.quoteLimit}
\r\n
\r\n {(jobData.scheduleEventId != null)? \r\n
\r\n
Scheduled date
\r\n
{moment(jobData.scheduleFromDate).format(this.props.dateFormat.toUpperCase()+' HH:mm')} to {moment(jobData.scheduleToDate).format(this.props.dateFormat.toUpperCase()+' HH:mm')}
\r\n
: ''\r\n }\r\n {this.getPMNotes(jobData.ownerApprovalComment)}\r\n
\r\n
Note
\r\n
\r\n {this.getPropertyKeyMessage(\r\n jobData.propertyKeyCollectType,\r\n jobData.propertyTypeId\r\n )}\r\n
\r\n
\r\n {(jobData.serviceConsumer && jobData.serviceConsumer != null && !jobData.isHideTenantDetailsToOwner)? \r\n <>\r\n
\r\n
Tenant name
\r\n
{jobData.serviceConsumer.businessName}
\r\n
\r\n {isTenant ? <>\r\n
\r\n
Tenant email address
\r\n
{jobData.serviceConsumer.email}
\r\n
\r\n {jobData.serviceConsumer.mobile == '' ? '' : <>\r\n
\r\n
Tenant mobile number
\r\n
{jobData.serviceConsumer.mobile}
\r\n
\r\n }\r\n : ''}\r\n \r\n : ''\r\n }\r\n
\r\n {\r\n (jobData.propertyKeyCollectType != null\r\n && (jobData.propertyKeyCollectType == 1 || jobData.propertyKeyCollectType == 2)) ?\r\n
\r\n : ''\r\n }\r\n {(jobData.statusDisplay == 'Job Completed' || (jobData.statusDisplay == 'Job Approval Pending' && this.props.isMyJobs) || this.state.isTenantManageJob) ? '' :\r\n
{\r\n this.props.getJobDetails(jobData.id);\r\n }}\r\n >\r\n }\r\n\r\n {(jobData.hasOwnProperty(\"attachments\") && jobData.attachments) ?\r\n <>\r\n !a.isAfter && a.type == 27)} isAfter={false} isInvoice={true}> \r\n a.isAfter && a.type == 27)} isAfter={true} isInvoice={true}> \r\n : ''\r\n }\r\n\r\n {(jobData.hasOwnProperty(\"attachments\") && jobData.attachments) ?\r\n <>\r\n !a.isAfter && a.type != 27)} isAfter={false}> \r\n a.isAfter && a.type != 27)} isAfter={true}> \r\n : ''\r\n }\r\n {this.getSignatureAttachments(jobData.signatureAttachments)}\r\n \r\n
\r\n
\r\n
\r\n
\r\n
{this.props.jobDetails.jobCompleteSigneeName }
\r\n
On \r\n {signatureAttachments.lastUpdatedDateTime}\r\n \r\n
\r\n
\r\n\r\n \r\n
\r\n
\r\n
\r\n
Overall Rating \r\n
\r\n
\r\n {props.bidFeedbackList.bidFeedbackProviderViewModel.map((feedBackUser, index) => {\r\n return <>\r\n
\r\n {(feedBackUser.feedBackUserType == 3 && props.showFeedbackOverView) ?
\r\n Property Manger \r\n
: ''}\r\n {(feedBackUser.feedBackUserType == 4 && props.showFeedbackOverView) ?
\r\n Tenant \r\n
: ''}\r\n {(feedBackUser.feedBackUserType == 2 && props.showFeedbackOverView) ?
\r\n Consumer \r\n
: ''}\r\n\r\n
\r\n {(props.showFeedbackOverView) ?
\r\n
\r\n
{feedBackUser.user}
\r\n
{feedBackUser.feedback}
\r\n
\r\n
: ''}\r\n
\r\n
\r\n
\r\n {props.bidFeedbackList.bidRatings.map((bidRating, index) => {\r\n return <>\r\n \r\n {(bidRating.ratedUser == feedBackUser.userId) ? \r\n {bidRating.ratingsCriteria} \r\n : ''}\r\n {(bidRating.ratedUser == feedBackUser.userId) ? \r\n : ''}\r\n \r\n \r\n })}\r\n
\r\n
\r\n
\r\n \r\n })}\r\n
\r\n
\r\n
\r\n
\r\n
\r\n No feedback to show\r\n
: ''}\r\n\r\n\r\n \r\n )\r\n};\r\n\r\nexport default FeedbackViewer;","import React from \"react\";\r\nimport moment from 'moment';\r\nimport Drawer from \"../../../Common/Drawer/Drawer\";\r\nimport { trackPromise } from \"react-promise-tracker\";\r\nimport { AXIOS } from \"../../../../Utilities/HttpRequest/Axios\";\r\nimport \"./Quotes.scss\";\r\nimport \"react-bootstrap-table/dist/react-bootstrap-table-all.min.css\";\r\nimport \"react-bootstrap-table-next/dist/react-bootstrap-table2.min.css\";\r\nimport \"filepond/dist/filepond.min.css\";\r\nimport \"filepond-plugin-image-preview/dist/filepond-plugin-image-preview.css\";\r\nimport Moment from \"react-moment\";\r\nimport ImageViewer from '../../../Common/ImageViewer/ImageViewer';\r\nimport StarRatingComponent from \"react-star-rating-component\";\r\nimport FeedbackViewer from \"../../../Common/FeedbackViewer/FeedbackViewer\";\r\nimport userService from \"../../../../Services/UserService\";\r\nimport bidService from \"../../../../Services/BidService\";\r\nimport { toast } from 'react-toastify';\r\n\r\nclass Quotes extends React.Component {\r\n state = {\r\n showProfileDrawer: false,\r\n profileDetails: {},\r\n isPmView: false,\r\n isSpView: false,\r\n isUserView: false,\r\n isDataLoaded: false,\r\n profileImageUrl: \"/images/default-profile.png\",\r\n skillsLoad: false,\r\n isShowNearbySuburbs: false,\r\n showLicensesTradee: false,\r\n jobTypeArray: [],\r\n showInsurancesTradee: false,\r\n itemSelected: 0,\r\n feedBackUserTypeCount: 0,\r\n feedbackResult: [],\r\n dateFormat: \"dd/MM/yyyy\",\r\n ActivateIndex: [],\r\n ExpandedIndex:[],\r\n isShowMore: false,\r\n show: 5,\r\n bidFeedbackList:[]\r\n };\r\n constructor(props) {\r\n super(props);\r\n }\r\n\r\n render() { \r\n const quotesList = this.getQuotesList();\r\n return \r\n {(this.props.jobDetails.workflowStatusId == 6) ?
Note: Please select the best quote for the job, if not decline all to request better quotes.
: ''}\r\n {quotesList}\r\n
Note: {notes}
;\r\n }\r\n };\r\n\r\n getProfile = userId => {\r\n try {\r\n let filters = {\r\n userId: userId,\r\n includeAttachments: true,\r\n includeBidRatings: true,\r\n includeNearbySuburbs: true,\r\n includeTradeeAttachments: true,\r\n isDetailedView: true,\r\n includeBadges: true,\r\n isTimeline: true,\r\n inCludePrefferedJobTypes: true,\r\n numberOfSuburbsNeeded: 10,\r\n ischat: false\r\n };\r\n trackPromise(\r\n AXIOS.GET(\r\n `tenant-api/profile?filters=${btoa(JSON.stringify(filters))}`\r\n ).then(dataJson => {\r\n this.setState({\r\n profileDetails: dataJson,\r\n isDataLoaded: true\r\n });\r\n\r\n if (dataJson.providerProfile.userId !== null) {\r\n this.setState({\r\n isPmView: false,\r\n isSpView: true,\r\n isUserView: false\r\n });\r\n if (dataJson.providerProfile.profileImageUrl != null &&\r\n dataJson.providerProfile.profileImageUrl.trim() != \"\"\r\n ) {\r\n this.setState({\r\n profileImageUrl: dataJson.providerProfile.profileImageUrl\r\n });\r\n }\r\n if (dataJson.providerProfile.feedbacks != null\r\n && dataJson.providerProfile.feedbacks.length > 0) {\r\n this.setState({\r\n feedbackResult: dataJson.providerProfile.feedbacks\r\n });\r\n }\r\n if (dataJson.providerProfile.providerLicenses != null\r\n && dataJson.providerProfile.providerLicenses.length > 0) {\r\n this.convertLicensedTrades(dataJson.providerProfile.providerLicenses);\r\n }\r\n\r\n } else if (dataJson.propertyManagerProfile.userId !== null) {\r\n this.setState({\r\n isPmView: true,\r\n isSpView: false,\r\n isUserView: false\r\n });\r\n\r\n if (\r\n dataJson.propertyManagerProfile.profileImageUrl !== null ||\r\n dataJson.propertyManagerProfile.profileImageUrl.trim() != \"\"\r\n ) {\r\n this.setState({\r\n profileImageUrl: dataJson.propertyManagerProfile.profileImageUrl\r\n });\r\n }\r\n } else if (dataJson.userProfile.userId !== null) {\r\n this.setState({\r\n isPmView: false,\r\n isSpView: false,\r\n isUserView: true\r\n });\r\n if (\r\n dataJson.userProfile.profileImageUrl !== null ||\r\n dataJson.userProfile.profileImageUrl.trim() != \"\"\r\n ) {\r\n this.setState({\r\n profileImageUrl: dataJson.userProfile.profileImageUrl\r\n });\r\n }\r\n\r\n\r\n } else {\r\n this.setState({\r\n isDataLoaded: false\r\n });\r\n }\r\n })\r\n );\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n };\r\n\r\n getFeedbackData = (bidId) => {\r\n try {\r\n \r\n trackPromise(\r\n userService.getFeedbackListByBidId(bidId)\r\n .then(data => {\r\n this.setState({\r\n bidFeedbackList: data\r\n });\r\n })\r\n );\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n };\r\n\r\n convertLicensedTrades(data) {\r\n if (!data)\r\n return;\r\n this.setState({\r\n jobTypeArray: new Array()\r\n });\r\n\r\n for (var j = 0; j < data.length; j++) {\r\n for (var i = 0; i < data[j].selectedMainJobTypes.length; i++) {\r\n var jobType = data[j].selectedMainJobTypes[i];\r\n var index = this.state.jobTypeArray.findIndex((item) => item.selectedJobTypeId === jobType.selectedJobTypeId);\r\n if ((index) < 0) {\r\n jobType.licenceNumber = data[j].licenceNumber;\r\n\r\n this.setState(prevState => ({\r\n jobTypeArray: [...prevState.jobTypeArray, jobType]\r\n }))\r\n\r\n\r\n }\r\n else {\r\n var currentJobType = this.state.jobTypeArray.splice(index, 1);\r\n var licenseNos = currentJobType[0].licenceNumber + \", \" + data[j].licenceNumber;\r\n jobType.licenceNumber = licenseNos;\r\n this.setState(prevState => ({\r\n jobTypeArray: [...prevState.jobTypeArray, jobType]\r\n }))\r\n }\r\n }\r\n }\r\n }\r\n\r\n toggleProfileDrawer = userId => {\r\n if (!this.state.showProfileDrawer && userId != null) {\r\n this.getProfile(userId);\r\n }\r\n this.setState(state => ({\r\n showProfileDrawer: !this.state.showProfileDrawer\r\n }));\r\n };\r\n\r\n createDrawer = () => {\r\n const header = this.createProfileHeader();\r\n const body = this.createProfileBody();\r\n const footer = this.createProfileFooter();\r\n\r\n return (\r\n \r\n );\r\n };\r\n\r\n createProfileHeader = () => {\r\n return (\r\n <>\r\n Profile \r\n \r\n this.toggleProfileDrawer(null)}\r\n >\r\n
\r\n \r\n );\r\n };\r\n\r\n createProfileBody = () => {\r\n if (this.state.isDataLoaded) {\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 this.state.profileDetails.providerProfile\r\n .displayName\r\n }{\" \"}\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {this.getSPDetails()}\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {(this.state.profileDetails) ?
\r\n Country in Operation: \r\n {this.state.profileDetails.providerProfile.workingCountry} \r\n
: ''}\r\n\r\n {(this.state.profileDetails) ?
\r\n
Area Covered \r\n
\r\n
\r\n {this.state.profileDetails.providerProfile.preferredStates.map((val, index) => {\r\n return <>{val.label}\r\n \r\n \r\n })}\r\n\r\n
\r\n\r\n {(this.state.isShowNearbySuburbs) ?
\r\n
\r\n {this.state.profileDetails.profileDetails.nearbySuburbs.map((val, index) => {\r\n return <> {val.label} \r\n \r\n })}\r\n\r\n
\r\n
: ''}\r\n {(this.state.profileDetails.nearbySuburbs && this.state.profileDetails.nearbySuburbs.length > 0) ?
: ''}\r\n
\r\n
: ''}\r\n\r\n {(this.state.profileDetails) ?
\r\n {(this.state.profileDetails.providerProfile.providerLicenses && this.state.profileDetails.providerProfile.providerLicenses.length > 0) ?\r\n
this.showLicenses()}>Licensed Trades\r\n {(this.state.showLicensesTradee) ? : ''}\r\n {(this.state.showLicensesTradee) ?
\r\n
\r\n {this.state.jobTypeArray.map((value, index) => {\r\n return <>\r\n \r\n {value.selectedJobType} \r\n {value.licenceNumber} \r\n \r\n \r\n })}\r\n
\r\n
: ''}\r\n\r\n {(this.state.profileDetails.providerProfile.providerInsurances && this.state.profileDetails.providerProfile.providerInsurances.length > 0) ?\r\n
this.showInsurances()}> Insurance\r\n {(this.state.showInsurancesTradee) ? : ''}\r\n {(this.state.showInsurancesTradee) ?
\r\n {this.state.profileDetails.providerProfile.providerInsurances.map((value, index) => {\r\n return <>\r\n
\r\n {(value.insuranceExpiredStatus == 3) ?
\r\n
\r\n {(value.isApplicableToAllTradeType) ?
\r\n
Applicable to All job Types \r\n : ''}\r\n {(!value.isApplicableToAllTradeType) ?
\r\n {value.selectedMainJobTypes.map((val, index) => {\r\n return <>\r\n
\r\n
{val.selectedJobType} \r\n \r\n \r\n })}\r\n
: ''}\r\n\r\n
\r\n
\r\n
\r\n
Public Liability
\r\n
$ {value.publicLiabilityDisplay} \r\n
\r\n
\r\n
\r\n
Professional indemnity
\r\n
${value.professionalIndemnityDisplay} \r\n
\r\n
\r\n
\r\n\r\n
: ''}\r\n
\r\n \r\n })}\r\n
: ''}\r\n
: ''\r\n }\r\n
\r\n
\r\n {(this.state.profileDetails.providerProfile && this.state.profileDetails.providerProfile.feedbacks) ?
\r\n
\r\n
Feedback Received ({this.state.profileDetails.providerProfile.feedbacks.length}) \r\n
\r\n
\r\n Filter By User Type \r\n this.onOptionsSelected(event.target.value)} className=\"ml-2 form-control\">\r\n All \r\n Property Managers \r\n Property Tenants \r\n Consumers \r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n {this.state.feedbackResult.slice(0, this.state.show).map((value, index) => {\r\n return <>\r\n \r\n \r\n \r\n \r\n {moment(value.dateTime).format(this.state.dateFormat.toUpperCase())} \r\n
\r\n \r\n \r\n \r\n {(value.feedBackUserType == 3) ? (Property Manager) : ''}\r\n {(value.feedBackUserType == 4) ? (Tenant) : ''}\r\n {(value.feedBackUserType == 2) ? (Consumer) : ''}\r\n
\r\n \r\n \r\n {value.user}
\r\n \r\n \r\n \r\n \r\n {(Math.round(value.avarageRating * 100) / 100).toFixed(1)}
\r\n \r\n \r\n this.toogleItems(index)}\r\n id=\"bt\">\r\n \r\n\r\n \r\n \r\n {(this.state.ActivateIndex.includes(index)) ?\r\n \r\n \r\n {(this.state.ActivateIndex.includes(index) || value.feedback.length <= 60) ? \r\n {value.feedback} \r\n
: ''}\r\n {(!this.state.ActivateIndex.includes(index) && value.feedback.length > 60) ?\r\n {(!this.state.ExpandedIndex.includes(index)) ?
\r\n {value.feedback} \r\n this.toogleExpandItems(index)}> \r\n
: ''}\r\n {(this.state.ExpandedIndex.includes(index))?
\r\n this.toogleExpandItems(index)}> Show Less \r\n
: ''}\r\n
\r\n : ''}\r\n \r\n \r\n })}\r\n
\r\n
\r\n
: ''}\r\n
\r\n this.increaseShow()} > Load More \r\n
\r\n
\r\n
\r\n
\r\n
\r\n\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n ABN \r\n \r\n {\" \"}\r\n : {this.state.profileDetails.providerProfile.abn}\r\n \r\n \r\n {this.getSPBusinessName()}\r\n \r\n Office No \r\n \r\n {\" \"}\r\n :{\" \"}\r\n {\r\n this.state.profileDetails.providerProfile\r\n .officePhone\r\n }\r\n \r\n \r\n\r\n \r\n
\r\n
\r\n
\r\n
\r\n
Skills \r\n {this.getSPSkillsSummary()}\r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n Ready to Work \r\n Ready to Work \r\n \r\n \r\n\r\n
\r\n
\r\n
\r\n {(Math.round(this.state.profileDetails.providerProfile.overallRating * 100) / 100).toFixed(1)}
\r\n\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {(this.state.profileDetails.providerProfile.hourlyRate) ?
\r\n
\r\n {this.state.profileDetails.providerProfile.hourlyRate}\r\n
\r\n
\r\n Per hour \r\n rate \r\n
\r\n
: ''}\r\n
\r\n
\r\n {this.state.profileDetails.providerProfile.completedJobCount}\r\n
\r\n
\r\n Completed \r\n jobs \r\n
\r\n
\r\n
\r\n
\r\n {this.state.profileDetails.providerProfile.calloutFee}\r\n
\r\n
\r\n Callout \r\n fee \r\n
\r\n
\r\n
\r\n
\r\n {(this.state.profileDetails.providerProfile.hasLicenseBadge) ?\r\n
: ''}\r\n {(this.state.profileDetails.providerProfile.hasInsuranceBadge) ?\r\n
: ''}\r\n {(this.state.profileDetails.providerProfile.hasABNBadge) ?\r\n
\r\n
\r\n
ABN
\r\n
: ''}\r\n {(this.state.profileDetails.providerProfile.hasJobFiftyPlusBadge) ?\r\n
\r\n
\r\n
You are
\r\n
: ''}\r\n {(this.state.profileDetails.providerProfile.hasCompletedMoreThanFiftyJobs) ?\r\n
\r\n
\r\n
Job 50+
\r\n
: ''}\r\n {(this.state.profileDetails.providerProfile.hasCm3CertifiedBadge) ?\r\n
\r\n
\r\n
CM3
\r\n
: ''}\r\n
\r\n
\r\n Business Name \r\n \r\n {\" \"}\r\n : {this.state.profileDetails.providerProfile.businessName}\r\n \r\n \r\n \r\n );\r\n }\r\n };\r\n\r\n getSPAllSkillsSummary = () => {\r\n const skills = this.state.profileDetails.providerProfile.primaryServices.map(\r\n (service, index) => {\r\n return (\r\n <>\r\n \r\n {service.title}\r\n \r\n \r\n );\r\n }\r\n );\r\n return skills;\r\n };\r\n\r\n getSPSkillsSummary = () => {\r\n if (this.state.profileDetails.providerProfile.primaryServices !== null) {\r\n return (\r\n <>\r\n {this.getSPAllSkillsSummary()}
\r\n \r\n );\r\n }\r\n else {\r\n return (\r\n <>\r\n {(this.state.profileDetails.providerProfile.preferredJobTypesGrouped !== null) ? \r\n
\r\n {this.state.profileDetails.providerProfile.preferredJobTypesGrouped.map((value, index) => {\r\n return <>\r\n
\r\n
{value[0].parentLabel} \r\n {(this.state.skillsLoad) ?\r\n
\r\n {value.map((val, index) => {\r\n return <>{val.label}\r\n \r\n \r\n })}\r\n\r\n
: ''}\r\n
\r\n \r\n })}\r\n
\r\n
this.toogleItemsInSkills()} id=\"bt\" >\r\n \r\n
\r\n this.toggleProfileDrawer(null)}\r\n >\r\n {\" \"}\r\n Cancel{\" \"}\r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n getQuotesList = () => {\r\n const quotes = this.props.bids.map((bid, index) => {\r\n let drawer = this.createDrawer();\r\n return (\r\n <>\r\n \r\n
\r\n
\r\n
\r\n
this.toggleProfileDrawer(bid.providerId)}\r\n src={bid.providerProfile.profileImageUrl}\r\n alt=\"bid.providerProfile.email\"\r\n className=\"profile-pic\"\r\n onError={e => {\r\n e.target.onerror = null;\r\n e.target.src = \"/Images/default-profile.png\";\r\n }}\r\n />\r\n \r\n
\r\n
{bid.name} \r\n
email: {bid.email}
\r\n
tel: {bid.phone}
\r\n
\r\n
\r\n
\r\n {this.getQuoteAmount(bid)}\r\n
\r\n
\r\n\r\n
\r\n
\r\n {this.getSPNotes(bid.notes)}\r\n
{bid.feedback}
\r\n
\r\n {(bid.availabilityStart && bid.availabilityEnd) ?\r\n
\r\n
Schedule
\r\n
{bid.availabilityStart} to {bid.availabilityEnd}
\r\n
\r\n : ''}\r\n {(bid.estimatedTimeDisplay) ?\r\n
\r\n
Estimated Time
\r\n
{bid.estimatedTimeDisplay}
\r\n
\r\n : ''}\r\n
\r\n
\r\n \r\n
\r\n {(bid.hasOwnProperty(\"attachments\")) ?\r\n
\r\n
\r\n {/* {(!this.isApprovedOrDeclined()) ? <>\r\n
\r\n {this.onClickApproveBid(bid)}}>Accept \r\n
\r\n : ''} */}\r\n \r\n
\r\n
\r\n );\r\n }\r\n }\r\n\r\n getQuoteAmount(bid) {\r\n if (bid.placeBidType) {\r\n if (bid.placeBidType === 1 || bid.placeBidType === 3) {\r\n return (\r\n \r\n
Quoted Amount
\r\n
${bid.amount.toFixed(2)}
\r\n
\r\n
\r\n
\r\n \r\n Min Max \r\n \r\n ${bid.amount}
${bid.amountMax}
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n Call out fee Hourly rate \r\n \r\n ${bid.callOutFee.toFixed(2)}
${bid.hourlyRate.toFixed(2)}
\r\n
\r\n
\r\n
{drawer}
;\r\n }\r\n\r\n componentDidMount() {\r\n this.getJobDetailsByJobId(this.props.jobId);\r\n this.getQoutesByJobId(this.props.jobId);\r\n this.getJobNotesByJobId(this.props.jobId);\r\n this.getOrganizationSettings(localStorage.getItem('orgId'));\r\n }\r\n\r\n getOrganizationSettings(organizationId) {\r\n settingsService.getOrganizationSettingsByOrgId(organizationId)\r\n .then((res) => {\r\n this.setState({\r\n showAverageCostWhenOwnerApproval: res.organizationSettingsModel.showAverageCostWhenOwnerApproval,\r\n isOrganizationSettingsLoaded: true\r\n })\r\n })\r\n }\r\n\r\n createDrawer = () => {\r\n if (this.props.drawerOpen) {\r\n let header = this.createHeader();\r\n let body = this.createBody();\r\n let footer = this.state.isTenantManageJob?<>:this.createFooter();\r\n return (\r\n \r\n );\r\n }\r\n };\r\n\r\n createHeader = () => {\r\n const { isJobDetailsLoading, isJobNotesLoading, isJobQuotesLoading } = this.state;\r\n return (\r\n <>\r\n \r\n Job Details \r\n {(isJobDetailsLoading || isJobNotesLoading || isJobQuotesLoading) ? \r\n \r\n {/* Edit this.props.toggleDrawer(false)}>\r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n\r\n createBody = () => {\r\n const { jobDetails, jobNotes, isJobDetailsLoading, isJobQuotesLoading, isJobNotesLoading, isJobQuotesOwnerApprovalPending } = this.state;\r\n return ( \r\n <>\r\n \r\n {(!isJobDetailsLoading && this.state.isOrganizationSettingsLoaded) ?\r\n
\r\n \r\n { this.getJobDetailsByJobId(event) }}\r\n showAverageCostWhenOwnerApproval={this.state.showAverageCostWhenOwnerApproval}\r\n isTenantManageJob={this.state.isTenantManageJob}>\r\n \r\n \r\n {(this.state.quotes && this.state.quotes.length > 0 && (localStorage.getItem('userType') == '5' || (jobDetails && jobDetails.propertyId == null))) ?\r\n \r\n \r\n
\r\n this.onApproveBid(event)}> \r\n
\r\n
: ''\r\n }\r\n \r\n \r\n : <>}\r\n \r\n {(this.state.jobDetails.acceptedBid != null && this.state.jobDetails.acceptedBid.isSharedSchedule && this.state.jobDetails.workflowStatusId === 4) ? \r\n : ''} \r\n {buttons}\r\n {feedbackButton}\r\n {(this.state.jobDetails.workflowStatusId === 4 && this.state.jobDetails.scheduleEventId != null && this.state.jobDetails.scheduleEventStatus !== 2 && this.state.jobDetails.scheduleEventStatus !== 4 && this.state.jobDetails.scheduleEventStatus !== 1) ?\r\n this.onAcceptSchedule()}>\r\n : ''}\r\n {(this.state.jobDetails.workflowStatusId === 4 && this.state.jobDetails.scheduleEventId != null && this.state.jobDetails.scheduleEventStatus !== 2 && this.state.jobDetails.scheduleEventStatus !== 4 && this.state.jobDetails.scheduleEventStatus !== 1) ?\r\n this.onRejectSchedule()}>\r\n : ''}\r\n \r\n {(this.state.jobDetails.workflowStatusId === 4 && this.state.jobDetails.scheduleEventId != null && this.state.jobDetails.acceptedBid != null && !this.state.jobDetails.acceptedBid.isSharedSchedule) ?\r\n \r\n this.toggleSheduleJobDrawer()}>\r\n \r\n {(this.state.showScheduleJob) ?\r\n this.toggleSheduleJobDrawer()}\r\n getJobDetails={(event) => { this.getJobDetailsByJobId(event) }}\r\n CloseJobDetailsDrawer={(event) => this.props.toggleDrawer(event)}>\r\n : ''\r\n }\r\n : ''\r\n }\r\n {(wordId == 1) ?\r\n this.onSubmitJob()} className=\"d-block\"> \r\n : ''\r\n } \r\n \r\n {(this.state.jobDetails.isOwnerApprovalPendingForVariation &&\r\n this.state.jobDetails.jobVariations &&\r\n this.state.jobDetails.jobVariations.length > 0 &&\r\n this.state.jobDetails.jobVariations[0].serviceStatus == 0 ) ?\r\n this.props.toggleDrawer(event)}\r\n jobDetails={this.state.jobDetails}\r\n getJobDetails={(event) => this.getJobDetailsByJobId(event)}>\r\n : ''\r\n }\r\n \r\n {(this.state.jobDetails.workflowStatusId == 107 && localStorage.getItem('userType') != '5' && this.state.jobDetails.isTenantPendingReviewRejected == 0) ?\r\n this.props.toggleDrawer(event)}\r\n jobDetails={this.state.jobDetails}\r\n getJobDetails={(event) => this.getJobDetailsByJobId(event)}>\r\n : ''\r\n }\r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n onDeclineAllQuotes = () => {\r\n bidService.declineAllBidsByOwner(this.state.jobDetails.id, \"\").then(res => {\r\n toast.success('All bids decline by owner', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.getQoutesByJobId(this.state.jobDetails.id);\r\n this.getJobDetailsByJobId(this.state.jobDetails.id)\r\n });\r\n }\r\n\r\n onApproveBid = () => {\r\n this.getQoutesByJobId(this.state.jobDetails.id);\r\n this.getJobDetailsByJobId(this.state.jobDetails.id)\r\n }\r\n\r\n toggleSheduleJobDrawer = () => {\r\n this.setState({\r\n showScheduleJob: !this.state.showScheduleJob\r\n });\r\n }\r\n\r\n onSubmitJob = () => {\r\n const draftedJob = this.state.jobDetails;\r\n draftedJob.workflowStatusId = 2\r\n draftedJob.serviceConsumerId = localStorage.getItem('userId');\r\n draftedJob.isUpdatingJobStaus = true;\r\n draftedJob.tradees = draftedJob.tradees == null ? [] : draftedJob.tradees;\r\n this.setState({ isPostingData: true });\r\n try {\r\n trackPromise(\r\n\r\n AXIOS.POST(`tenant-api/job-post`, draftedJob, {\r\n 'headers': { 'ClientSecret': AppConfiguration.Setting().ClientSecret }\r\n })\r\n .then(dataJson => {\r\n this.setState({ isPostingData: false });\r\n if (dataJson == 'Request Unauthorized' || dataJson == 'Job creation failed') {\r\n toast.error('Fail to post the job. Please try again.',{\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n } else {\r\n toast.success('Job is posted successfully.',{\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.props.toggleDrawer(true);\r\n let { history } = this.props;\r\n history.push({ pathname: '/' });\r\n }\r\n })\r\n\r\n )\r\n\r\n } catch (error) {\r\n\r\n }\r\n }\r\n\r\n getJobDetailsByJobId = jobId => {\r\n const userId = localStorage.getItem(\"userId\");\r\n this.setState({isJobDetailsLoading: true})\r\n if (jobId) {\r\n try {\r\n AXIOS.GET(`tenant-api/job?jobId=${jobId}&userId=${userId}`).then(\r\n data => {\r\n this.setState({\r\n isJobDetailsLoading: false,\r\n jobDetails: data, \r\n isJobQuotesOwnerApprovalPending: data.isJobQuotesOwnerApprovalPending,\r\n attachments: (!data.attachments) ? [] : data.attachments.map(a => {\r\n return {\r\n source:\r\n \"https://ancillary-dev-images-compressed.azureedge.net/\" +\r\n a.fileId +\r\n a.extension,\r\n options: {\r\n type: \"local\"\r\n }\r\n };\r\n })\r\n });\r\n }\r\n )\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n }\r\n };\r\n\r\n //Api call to get Job-notes\r\n getJobNotesByJobId = jobId => {\r\n const userId = localStorage.getItem(\"userId\");\r\n this.setState({isJobNotesLoading: true})\r\n if (jobId) {\r\n try {\r\n AXIOS.GET(\r\n `tenant-api/job-notes?jobId=${jobId}&userId=${userId}`\r\n ).then(data => {\r\n this.setState({\r\n jobNotes: data,\r\n isJobNotesLoading: false\r\n });\r\n })\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n }\r\n };\r\n\r\n //get Qoutes/Bids Details\r\n getQoutesByJobId = jobId => {\r\n const userId = localStorage.getItem(\"userId\");\r\n this.setState({isJobQuotesLoading: true})\r\n if (jobId) {\r\n try {\r\n bidService.getQoutesByJobId(jobId, userId)\r\n .then(data => {\r\n this.setState({\r\n quotes: data.bidsList,\r\n isJobQuotesLoading: false\r\n });\r\n })\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n }\r\n };\r\n\r\n getFeedbackButton = () => {\r\n if (\r\n localStorage.getItem('userType') == '4' && \r\n this.state.jobDetails.acceptedBid != null &&\r\n (this.state.jobDetails.workflowStatusId ===\r\n WorkflowStates.JobPendingReview ||\r\n this.state.jobDetails.workflowStatusId ===\r\n WorkflowStates.JobCompleted ||\r\n this.state.jobDetails.workflowStatusId == 107) &&\r\n this.state.jobDetails.thirdPartyTradeeEmail == null &&\r\n this.state.jobDetails.isTenantPendingReviewRejected == 0 &&\r\n (this.state.jobDetails.propertyId == null ||\r\n this.state.jobDetails.workflowStatusId == 107\r\n && this.state.jobDetails.propertyId != null)\r\n ) {\r\n return (\r\n this.props.toggleDrawer(event)}\r\n jobDetails={this.state.jobDetails}\r\n getJobDetails={(event) => this.getJobDetailsByJobId(event)}\r\n showAverageCostWhenOwnerApproval={this.state.showAverageCostWhenOwnerApproval}\r\n >\r\n this.props.toggleDrawer(event)}\r\n jobDetails={this.state.jobDetails}\r\n getJobDetails={(event) => this.getJobDetailsByJobId(event)}\r\n >\r\n \r\n );\r\n } else {\r\n let isReplyed = this.state.quotes.filter(a => a.quoteApprovalStatusId == 1 || a.quoteApprovalStatusId == 2).length > 0\r\n if(isReplyed){\r\n return '';\r\n } \r\n }\r\n }\r\n };\r\n\r\n onAcceptSchedule = () => {\r\n \r\n let obj = {};\r\n\r\n obj.JobId = this.state.jobDetails.id;\r\n \r\n obj.id = this.state.jobDetails.scheduleEventId;\r\n \r\n obj.type = 0;\r\n obj.status = 2;\r\n obj.bidId = this.state.jobDetails.acceptedBid.bidId;\r\n obj.userId = localStorage.getItem('userIdDecripted');\r\n \r\n \r\n try {\r\n AXIOS.POST(`tenant-api/save-schedule-job?userId=${localStorage.getItem('userId')}`, obj).then(response => {\r\n if (response) {\r\n toast.success('Job Schedule Accepted', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.getJobDetailsByJobId(this.state.jobDetails.id);\r\n }\r\n else {\r\n toast.error('Job Schedule Acceptance Failed', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n }\r\n });\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n \r\n\r\n };\r\n\r\n onRejectSchedule = () => {\r\n\r\n let obj = {};\r\n\r\n obj.JobId = this.state.jobDetails.id;\r\n\r\n obj.id = this.state.jobDetails.scheduleEventId;\r\n\r\n obj.type = 0;\r\n obj.status = 3;\r\n obj.bidId = this.state.jobDetails.acceptedBid.bidId;\r\n obj.userId = localStorage.getItem('userIdDecripted');\r\n \r\n\r\n try {\r\n AXIOS.POST(`tenant-api/save-schedule-job?userId=${localStorage.getItem('userId')}`, obj).then(response => {\r\n if (response) {\r\n toast.success('Job Schedule Rejected', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.getJobDetailsByJobId(this.state.jobDetails.id);\r\n }\r\n else {\r\n toast.error('Job Schedule Rejection Failed', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n }\r\n });\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n\r\n\r\n };\r\n\r\n}\r\n\r\nexport default JobDetailsDrawer;\r\n","import React, { useState } from \"react\";\r\nimport { connect } from \"react-redux\";\r\nimport Drawer from \"../../Common/Drawer/Drawer\";\r\nimport StarRatingComponent from \"react-star-rating-component\";\r\n\r\nimport { AXIOS } from \"../../../Utilities/HttpRequest/Axios\";\r\nimport { ToastContainer, toast } from \"react-toastify\";\r\nimport { WorkflowStates, UserType } from \"../../../Constants/Enums\";\r\nimport { AppConfiguration } from \"read-appsettings-json\";\r\nimport \"./FeedbackDrawer.scss\";\r\nimport { trackPromise } from \"react-promise-tracker\";\r\n\r\nclass FeedbackDrawer extends React.Component {\r\n state = {\r\n showFeedbackDrawer: false,\r\n attendanceRating: 0,\r\n communicationRating: 0,\r\n cleanlinessRating: 0,\r\n qualityRating: 0\r\n };\r\n\r\n isFeedbackProvided = false;\r\n userFeedbackNote = '';\r\n\r\n constructor(props) {\r\n super(props);\r\n this.feedback = React.createRef();\r\n }\r\n\r\n componentDidMount() {\r\n this.isFeedbackProvided = false;\r\n }\r\n\r\n render() {\r\n let drawer = this.createDrawer();\r\n const feedbackButton = \"Feedback\";\r\n return (\r\n <>\r\n \r\n {feedbackButton} \r\n \r\n {drawer}\r\n \r\n );\r\n }\r\n\r\n createDrawer = () => {\r\n const header = this.createFeedbackHeader();\r\n const body = this.createFeedbackBody();\r\n const footer = this.createFeedbackFooter();\r\n\r\n return (\r\n \r\n );\r\n };\r\n\r\n createFeedbackHeader = () => {\r\n return (\r\n <>\r\n Provide Feedback \r\n \r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n createFeedbackBody = () => {\r\n const isTenant =\r\n localStorage.getItem(\"userType\") == UserType.Tenant ;\r\n const jobData = this.props.jobDetails;\r\n\r\n let {\r\n attendanceRating,\r\n communicationRating,\r\n cleanlinessRating,\r\n qualityRating\r\n } = this.state;\r\n\r\n if (jobData.bidFeedBackList && jobData.bidFeedBackList.length > 0) {\r\n const userFeedback = jobData.bidFeedBackList.filter(\r\n feedback => feedback.userId === localStorage.getItem(\"userIdDecripted\")\r\n );\r\n if (userFeedback && userFeedback.length > 0) {\r\n const feedbackGivenByUser = userFeedback[0];\r\n\r\n this.isFeedbackProvided = true;\r\n this.userFeedbackNote = feedbackGivenByUser.feedback;\r\n attendanceRating = feedbackGivenByUser.bidRatings.filter(\r\n rating => rating.ratingsCriteriaId === 1\r\n )[0].rating;\r\n\r\n communicationRating = feedbackGivenByUser.bidRatings.filter(\r\n rating => rating.ratingsCriteriaId === 2\r\n )[0].rating;\r\n\r\n cleanlinessRating = feedbackGivenByUser.bidRatings.filter(\r\n rating => rating.ratingsCriteriaId === 3\r\n )[0].rating;\r\n\r\n qualityRating = feedbackGivenByUser.bidRatings.filter(\r\n rating => rating.ratingsCriteriaId === 4\r\n )[0].rating;\r\n }\r\n }\r\n\r\n\r\n return (\r\n \r\n
{jobData.title} \r\n
{jobData.description}
\r\n
\r\n {(!isTenant ) ?\r\n
\r\n
Estimate
\r\n
\r\n {jobData && jobData.acceptedBid && jobData.acceptedBid.amount && jobData.acceptedBid.amount > 0 ? `$ ${jobData.acceptedBid.amount}` : \"Not Supplied\"}\r\n
\r\n
\r\n : ''}\r\n
\r\n
Provider
\r\n
\r\n {jobData.acceptedBid ? `${jobData.acceptedBid.name}` : ``}\r\n
\r\n
\r\n
\r\n
Provider Note
\r\n
\r\n
\r\n
\r\n
\r\n\r\n
\r\n\r\n
Overall Rating \r\n
\r\n\r\n
\r\n
Attendance time
\r\n
\r\n
\r\n
\r\n
\r\n
Communications
\r\n
\r\n
\r\n
\r\n
\r\n
Cleanliness
\r\n
\r\n
\r\n
\r\n
\r\n
Quality of Workmanship
\r\n
\r\n
\r\n
\r\n
\r\n {!this.isFeedbackProvided &&\r\n
\r\n
\r\n
\r\n Feedback \r\n \r\n
\r\n
\r\n
}\r\n {this.isFeedbackProvided &&\r\n
\r\n
\r\n
\r\n Feedback \r\n \r\n
\r\n
\r\n
\r\n }\r\n {this.props.jobDetails.propertyManagerAgencyPlaceId != '' || this.props.jobDetails.providerAgencyPlaceId != '' ?\r\n
\r\n
\r\n
\r\n this.onClickAddReview(this.props.jobDetails.providerAgencyPlaceId)}>\r\n Add review to Service Provider's Agency \r\n \r\n this.onClickAddReview(this.props.jobDetails.propertyManagerAgencyPlaceId)}>\r\n Add review to Property Manager's Agency \r\n \r\n
\r\n
\r\n
: ''\r\n }\r\n
\r\n
\r\n
\r\n
\r\n \r\n {\" \"}\r\n Mark as Completed\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n {\" \"}\r\n CANCEL{\" \"}\r\n \r\n\r\n {!this.isFeedbackProvided && \r\n }\r\n
\r\n \r\n );\r\n };\r\n\r\n onUpdateFeedback = () => {\r\n try {\r\n if (!this.state.attendanceRating || !this.state.communicationRating || !this.state.cleanlinessRating || !this.state.qualityRating) {\r\n toast.error(\"Great if you could rate all options!\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n return;\r\n }\r\n this.props.showJobDetailsDrawer(!this.props.open, true);\r\n let bidFeedback = {\r\n userId: localStorage.getItem(\"userId\"),\r\n jobId: this.props.jobDetails.id,\r\n feedback: this.feedback.current.value,\r\n bidRatings: [\r\n { rating: this.state.attendanceRating, ratingsCriteriaId: 1 },\r\n { rating: this.state.communicationRating, ratingsCriteriaId: 2 },\r\n { rating: this.state.cleanlinessRating, ratingsCriteriaId: 3 },\r\n { rating: this.state.qualityRating, ratingsCriteriaId: 4 }\r\n ],\r\n FeedBackUserType: UserType.Owner,\r\n FeedbackRatings: 0\r\n };\r\n trackPromise(\r\n AXIOS.POST(`tenant-api/save-feedback`, bidFeedback).then(response => {\r\n if (response.success === true) {\r\n this.isFeedbackProvided = true;\r\n this.userFeedbackNote = this.feedback.current.value;\r\n toast.success(\"Feedback Updated.\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.props.getJobDetails(this.props.jobDetails.id);\r\n this.toggleFeedbackDrawer();\r\n } else {\r\n toast.error(\"Error occured. Please try again.\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n }\r\n }));\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n };\r\n\r\n toggleFeedbackDrawer = () => {\r\n this.setState(state => ({\r\n showFeedbackDrawer: !this.state.showFeedbackDrawer\r\n }));\r\n };\r\n}\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n return {\r\n open: state.MyJobs.isOpen\r\n };\r\n};\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n showJobDetailsDrawer: (isShowDrawer, isRefresh) => {\r\n dispatch({\r\n type: \"SHOW_JOB_DETAILS_DRAWER\",\r\n isOpen: isShowDrawer,\r\n refreshMyJobs: isRefresh\r\n });\r\n }\r\n };\r\n};\r\n\r\nexport default connect(\r\n mapStateToProps,\r\n mapDispatchToProps\r\n)(FeedbackDrawer);\r\n","import React, { useState } from \"react\";\r\nimport Drawer from \"../../Common/Drawer/Drawer\";\r\nimport { connect } from \"react-redux\";\r\nimport { AXIOS } from \"../../../Utilities/HttpRequest/Axios\";\r\nimport { toast } from \"react-toastify\";\r\nimport { Dropdown } from 'semantic-ui-react';\r\nimport { ButtonToolbar, ToggleButtonGroup, ToggleButton } from 'react-bootstrap';\r\nimport { trackPromise } from \"react-promise-tracker\";\r\nimport jobService from \"../../../Services/JobService\";\r\n\r\n// Styles\r\nimport \"./JobApproveDrawer.scss\";\r\n\r\nclass JobApproveDrawer extends React.Component {\r\n notifyError = (msg) => toast.error(msg, {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n state = {\r\n showJobApproveDrawer: false,\r\n jobApproveOption: '0',\r\n showQuoteLimitSelection: false,\r\n showSuggestedTrade: false,\r\n selectedQuoteLimit: 0,\r\n selectedTrade: '',\r\n quoteLimit: [\r\n { key: 1, text: '1', value: 1 },\r\n { key: 2, text: '2', value: 2 },\r\n { key: 3, text: '3', value: 3 },\r\n { key: 4, text: '4', value: 4 },\r\n { key: 5, text: '5', value: 5 },\r\n { key: 6, text: '6', value: 6 },\r\n { key: 7, text: '7', value: 7 },\r\n { key: 8, text: '8', value: 8 },\r\n { key: 9, text: '9', value: 9 },\r\n { key: 10, text: '10', value: 10 },\r\n { key: 11, text: 'Unlimited', value: 11 }],\r\n suggestedTradeList: [],\r\n averageCostModel: {\r\n jobAverageCost: 0.00,\r\n jobCount: 0,\r\n confidenceLevel: 1\r\n },\r\n isAverageCostModelLoaded: false\r\n };\r\n constructor(props) {\r\n super(props);\r\n this.description = React.createRef();\r\n }\r\n //for getting average job cost\r\n getPredictiveAverageCost = (jobId) => {\r\n try {\r\n jobService.GetPredictiveJobAverageCost(jobId)\r\n .then(data => {\r\n this.setState({ averageCostModel: data });\r\n this.setState({ isAverageCostModelLoaded: true });\r\n });\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n this.description = React.createRef();\r\n this.approvedAmount = React.createRef();\r\n this.isEmptySuggestedTradeList = false;\r\n if (this.props.showAverageCostWhenOwnerApproval) {\r\n this.getPredictiveAverageCost(this.props.jobDetails.id);\r\n }\r\n }\r\n\r\n render() {\r\n let drawer = this.createDrawer();\r\n\r\n return (\r\n <>\r\n \r\n Approve \r\n \r\n {drawer}\r\n \r\n );\r\n }\r\n\r\n createDrawer = () => {\r\n const header = this.createJobApproveHeader();\r\n const body = this.createJobApproveBody();\r\n const footer = this.createJobApproveFooter();\r\n\r\n return (\r\n \r\n );\r\n };\r\n\r\n createJobApproveHeader = () => {\r\n return (\r\n <>\r\n \r\n Approve Job\r\n \r\n \r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n createJobApproveBody = () => {\r\n let quoteLimitSelection = this.createQuoteLimitSelection();\r\n let suggestedTradeSelection = this.createSuggestedTradeSelection();\r\n\r\n return (\r\n \r\n {(this.props.showAverageCostWhenOwnerApproval && this.state.isAverageCostModelLoaded) ?\r\n
\r\n
\r\n
The suggested average cost range for the job is +/-${this.state.averageCostModel.jobAverageCost}
\r\n
\r\n
\r\n :\r\n ''\r\n }\r\n <>\r\n
\r\n
\r\n
\r\n \r\n \r\n Please get some quotes \r\n Delegate to Property Manager \r\n \r\n \r\n
\r\n
\r\n
\r\n \r\n {quoteLimitSelection}\r\n {suggestedTradeSelection}\r\n
\r\n
\r\n
\r\n Note\r\n * \r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n {\" \"}\r\n Mark as Completed\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n Quote Limit \r\n
\r\n
\r\n
\r\n
\r\n There are no suggested trades, you may delegate the job to your property manager \r\n
\r\n
\r\n
\r\n
\r\n Select a trade \r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n {\" \"}\r\n Cancel{\" \"}\r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n validateApproval = () => {\r\n let v = true;\r\n if (this.state.jobApproveOption === '0' && this.props.jobDetails.isEnableOwnerApprovalPercentage == false) {\r\n toast.error('Please select approval option.', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n }); v = v && false;\r\n }\r\n\r\n if (this.state.jobApproveOption === '1' && this.state.selectedTrade === '') {\r\n toast.error('Please select a trade.', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n }); v = v && false;\r\n }\r\n\r\n if (this.state.jobApproveOption === '2' && this.state.selectedQuoteLimit === 0) {\r\n toast.error('Please select a Quote Limit.', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n }); v = v && false;\r\n }\r\n\r\n if (this.description.current.value == null || this.description.current.value.trim() === '') {\r\n toast.error(\"Please enter job approving note.\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n }); v = v && false;\r\n }\r\n\r\n return v;\r\n }\r\n\r\n onClickJobApprove = () => {\r\n try {\r\n\r\n if (this.validateApproval()) {\r\n let jobApprovalRequest = {};\r\n jobApprovalRequest.userId = localStorage.getItem(\"userId\");\r\n jobApprovalRequest.jobId = this.props.jobDetails.id;\r\n jobApprovalRequest.note = this.description.current.value;\r\n jobApprovalRequest.jobApproveOption = parseFloat(this.state.jobApproveOption);\r\n jobApprovalRequest.quoteLimit = this.state.selectedQuoteLimit;\r\n jobApprovalRequest.tradeId = this.state.selectedTrade;\r\n jobApprovalRequest.IsOwnerApproved = true;\r\n\r\n\r\n trackPromise(\r\n AXIOS.POST(`tenant-api/job-approve-owner`, jobApprovalRequest)\r\n .then(response => {\r\n if (response) {\r\n toast.success(\"Job Approved.\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.toggleJobApproveDrawer();\r\n this.props.toggleDrawer(true);\r\n } else {\r\n toast.error(\"Error occured. Please try again.\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n }\r\n }));\r\n }\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n };\r\n\r\n toggleJobApproveDrawer = () => {\r\n this.setState(state => ({\r\n showJobApproveDrawer: !this.state.showJobApproveDrawer\r\n }));\r\n };\r\n\r\n handleJobApproveOptionOnChange = (value) => {\r\n this.setState({ jobApproveOption: value });\r\n\r\n if (value === \"1\") {\r\n try {\r\n AXIOS.GET(\r\n `tenant-api/suggested-trades?jobId=${this.props.jobDetails.id}`\r\n ).then(response => {\r\n if (response) {\r\n if (response.length <= 0) {\r\n this.isEmptySuggestedTradeList = true;\r\n }\r\n this.setState({ suggestedTradeList: response.map((a, index) => { return { key: index, text: a.businessName, value: a.userId }; }) });\r\n this.setState({ showQuoteLimitSelection: false, showSuggestedTrade: true });\r\n } else {\r\n toast.error(\"Error occured. Please try again.\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n }\r\n });\r\n } catch (error) {\r\n console.log(error);\r\n }\r\n }\r\n else if (value === \"2\") {\r\n this.setState({ showQuoteLimitSelection: true, showSuggestedTrade: false });\r\n }\r\n else if (value === \"3\") {\r\n this.setState({ showQuoteLimitSelection: false, showSuggestedTrade: false });\r\n }\r\n }\r\n\r\n onQuoteLimitSelection = (value) => {\r\n\r\n }\r\n\r\n getConfidenceLevelClass(confidenceLevel) {\r\n switch (confidenceLevel) {\r\n case 1:\r\n return \"confident-lbl confident-low\";\r\n case 2:\r\n return \"confident-lbl confident-medium\";\r\n case 3:\r\n return \"confident-lbl confident-high\";\r\n }\r\n }\r\n}\r\n\r\n\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n return {\r\n isRefresh: state.MyJobs.isRefreshGrid\r\n };\r\n};\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n refreshGrid: isRefresh => {\r\n dispatch({ type: \"REFRESH_GRID\", isRefresh: isRefresh });\r\n }\r\n };\r\n};\r\n\r\nexport default connect(\r\n mapStateToProps,\r\n mapDispatchToProps\r\n)(JobApproveDrawer);\r\n","import { AXIOS } from '../Utilities/HttpRequest/Axios.js';\r\nimport * as _ from 'lodash';\r\nimport { AppConfiguration } from 'read-appsettings-json';\r\nconst pamApi = AppConfiguration.Setting().PamApiEndPoint;\r\nconst SendVerificationCode = (mobileNumber) => {\r\n return AXIOS.GET(`tenant-api/get-messenger-phone-number-verification-code?mobileNumber=%2B${mobileNumber}`);\r\n}\r\n\r\nconst SendVerificationCodeViaEmail = (email) => {\r\n return AXIOS.GET(`tenant-api/get-email-verification-code?userEmail=${email}`);\r\n}\r\n\r\nconst SendVerificationCodeForOwner = (mobileNumber) => {\r\n return AXIOS.GET(`tenant-api/get-messenger-phone-number-verification-code-owner?mobileNumber=%2B${mobileNumber}`);\r\n}\r\n\r\nconst CheckUserExist = (mobileNumber)=>{\r\n return AXIOS.GET(`tenant-api/search-tenancy?userMobile=${mobileNumber}`);\r\n}\r\n\r\nconst CheckUserExistByEmail = (email) => {\r\n return AXIOS.GET(`tenant-api/search-tenancy?userEmail=${email}`);\r\n}\r\n\r\nconst CheckOwnerExist = (mobileNumber) => {\r\n return AXIOS.GET(`tenant-api/search-owners?userMobile=${mobileNumber}`);\r\n}\r\n\r\nconst getChatbotSettings = (orgid)=>{\r\n return AXIOS.GET(`tenant-api/chatbot-settings?orgId=${orgid}`);\r\n}\r\n\r\nconst getQandAForTenant = (organizationId)=>{\r\n return AXIOS.GET(`tenant-api/q-and-a-by-organization?organizationId=${organizationId}`);\r\n}\r\n\r\nconst getPendingOwnerApprovalList = (userId) => {\r\n return AXIOS.GET(`tenant-api/chatbot/jobs?userId=${userId}`);\r\n}\r\n\r\nconst ownerApproveRejectJob = (userId, jobId, note, isApprove) => {\r\n return AXIOS.GET(`tenant-api/chat-bot/job-action-owner?userId=${userId}&jobId=${jobId}¬e=${note}&isApproved=${isApprove}`);\r\n}\r\n\r\nconst ownerAcceptJobQuote = (bidId, userId, jobId, note) => {\r\n return AXIOS.GET(`tenant-api/bid/approve-bid?bidId=${bidId}&userId=${userId}&jobId=${jobId}¬e=${note}`);\r\n}\r\n\r\nconst ownerDeclineAllJobQuotes = (userId, jobId, note) => {\r\n return AXIOS.GET(`tenant-api/bid/decline-all-quotes-by-owner?userId=${userId}&jobId=${jobId}¬e=${note}`);\r\n}\r\n\r\nconst getAssignedPm = (tenantId)=>{\r\n return AXIOS.GET(`tenant-api/pam/assigned-pm?tenantId=${tenantId}`);\r\n}\r\n\r\nconst postNewQandA = (tenantId,question)=>{\r\n return AXIOS.GET(`tenant-api/pam/tenant-post-new-qanda?tenantId=${tenantId}&question=${question}`);\r\n}\r\n\r\nconst getRentalDetails = (tenantId)=>{\r\n return AXIOS.GET(`tenant-api/pam/tenant-get-rental-details?tenantId=${tenantId}`);\r\n}\r\nconst getArrearsDetails = (tenantId)=>{\r\n return AXIOS.GET(`tenant-api/pam/tenant-get-arrears-details?tenantId=${tenantId}`);\r\n}\r\nconst getScheduleJobs = (filters)=>{\r\n return AXIOS.GET(`tenant-api/tenant-jobs?filters=${filters}`);\r\n}\r\nconst botService = {\r\n SendVerificationCode,\r\n SendVerificationCodeViaEmail,\r\n SendVerificationCodeForOwner,\r\n CheckUserExist,\r\n CheckUserExistByEmail,\r\n CheckOwnerExist,\r\n getChatbotSettings,\r\n getQandAForTenant,\r\n getPendingOwnerApprovalList,\r\n ownerApproveRejectJob,\r\n ownerAcceptJobQuote,\r\n ownerDeclineAllJobQuotes,\r\n getAssignedPm,\r\n postNewQandA,\r\n getRentalDetails,\r\n getArrearsDetails,\r\n getScheduleJobs\r\n}\r\n\r\nexport default botService;","import { AXIOS } from '../Utilities/HttpRequest/Axios';\r\nimport { AppConfiguration } from \"read-appsettings-json\";\r\n\r\nexport const getUserSettings = () => {\r\n return AXIOS.GET(`tenant-api/user-settings?userId=${localStorage.getItem('userIdDecripted')}`);\r\n}\r\nexport const revokeDevice = (channelType) => {\r\n return AXIOS.GET(`tenant-api/settings/revoke-device?userId=${localStorage.getItem('userIdDecripted')}&channelType=${channelType}`);\r\n}\r\nexport const activateDevice = (channelType) => {\r\n return AXIOS.GET(`tenant-api/settings/activate-device?userId=${localStorage.getItem('userIdDecripted')}&channelType=${channelType}`);\r\n}\r\nexport const updateTwoFactorAuthentication = (model) => {\r\n return AXIOS.POST(`tenant-api/settings/update-two-factor-authentication`, model);\r\n}\r\nexport const updateCommunicationPreferences = (model) => {\r\n return AXIOS.POST(`tenant-api/settings/update-communication-preferences`, model);\r\n}\r\nexport const updateQuoteSettings = (model) => {\r\n return AXIOS.POST(`tenant-api/settings/update-quote-settings`, model);\r\n}\r\nexport const generateMobileValidationToken = (model) => {\r\n return AXIOS.POST(`tenant-api/settings/generate-phone-number-validation-token`, model);\r\n}\r\nexport const confirmMobileValidationToken = (model) => {\r\n return AXIOS.POST(`tenant-api/settings/confirm-phone-number-validation-token`, model);\r\n}\r\nexport const getOrganizationSettings = () => {\r\n return AXIOS.GET(`tenant-api/Organization-settings?userId=${localStorage.getItem('userIdDecripted')}`);\r\n}\r\n\r\nexport const getGeneralSettings = (userId) => {\r\n return AXIOS.GET(`tenant-api/General-settings?userId=${userId}`);\r\n}\r\n\r\nexport const getOrganizationSettingsByOrgId = (organizationId) => {\r\n return AXIOS.GET(`tenant-api/Organization-settings-for-property?organizationId=${organizationId}`);\r\n}\r\n\r\nexport const getOmniOrgThemeSettings = (userId) => {\r\n return AXIOS.GET(`tenant-api/Organization-omni-theme-settings?userId=${userId}`);\r\n}\r\n\r\nexport const getCardDetailsByUserId = (userId) => {\r\n return AXIOS.GET(`tenant-api/tenant-card-details?userId=${userId}`);\r\n}\r\n\r\nexport const addCardDetails = (model) => {\r\n return AXIOS.POST(`tenant-api/add-card-details`, model);\r\n}\r\nexport const deleteCardDetails = (model) => {\r\n return AXIOS.DELETE(`tenant-api/delete-card-details`, model);\r\n}\r\nexport const setDefaultCardDetails = (model) => {\r\n return AXIOS.PUT(`tenant-api/default-card-details`, model);\r\n}\r\nconst settingsService = {\r\n getUserSettings,\r\n revokeDevice,\r\n activateDevice,\r\n updateTwoFactorAuthentication,\r\n updateCommunicationPreferences,\r\n updateQuoteSettings,\r\n generateMobileValidationToken,\r\n confirmMobileValidationToken,\r\n getOrganizationSettings,\r\n getGeneralSettings,\r\n getOrganizationSettingsByOrgId,\r\n getOmniOrgThemeSettings,\r\n getCardDetailsByUserId,\r\n addCardDetails,\r\n deleteCardDetails,\r\n setDefaultCardDetails,\r\n \r\n}\r\n\r\nexport default settingsService;","import React, { useState } from \"react\";\r\nimport { trackPromise } from \"react-promise-tracker\";\r\nimport Drawer from \"../../Common/Drawer/Drawer\";\r\nimport { connect } from \"react-redux\";\r\nimport { AXIOS } from \"../../../Utilities/HttpRequest/Axios\";\r\nimport { toast } from \"react-toastify\";\r\nimport ImageViewer from '../../Common/ImageViewer/ImageViewer';\r\n\r\n\r\nclass JobVariationDrawer extends React.Component {\r\n state = {\r\n showJobVariationDrawer: false\r\n };\r\n\r\n variationAmout = '';\r\n\r\n constructor(props) {\r\n super(props);\r\n this.description = React.createRef();\r\n }\r\n\r\n render() {\r\n let drawer = this.createDrawer();\r\n\r\n return (\r\n <>\r\n \r\n Variation \r\n \r\n {drawer}\r\n \r\n );\r\n }\r\n\r\n createDrawer = () => {\r\n const header = this.createJobVariationHeader();\r\n const body = this.createJobVariationBody();\r\n const footer = this.createJobVariationFooter();\r\n\r\n return (\r\n \r\n );\r\n };\r\n\r\n createJobVariationHeader = () => {\r\n return (\r\n <>\r\n Job Variation \r\n \r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n createJobVariationBody = () => {\r\n if (this.props.jobDetails.jobVariations && this.props.jobDetails.jobVariations.length > 0) {\r\n this.variationAmout = this.props.jobDetails.jobVariations[0].amount;\r\n }\r\n\r\n return (\r\n \r\n
\r\n
\r\n
\r\n
Variation Amount{\" \"}
\r\n
{\" \"}${this.variationAmout.toFixed(2)} \r\n
\r\n
\r\n
\r\n
\r\n {(this.props.jobDetails.jobVariations && this.props.jobDetails.jobVariations.length > 0 && this.props.jobDetails.jobVariations[0].jobVariationAttachments) ?\r\n <>\r\n
\r\n
\r\n
\r\n
\r\n Note \r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n {\" \"}\r\n Cancel{\" \"}\r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n onClickJobVariationApprove = () => {\r\n if (this.description.current.value == '' || this.description.current.value == undefined || this.description.current.value == null) {\r\n toast.error(\"Please enter job approving note.\", { position: toast.POSITION.BOTTOM_RIGHT });\r\n }\r\n else {\r\n let jobVariationApproveRequest = {};\r\n jobVariationApproveRequest.userId = localStorage.getItem(\"userId\");\r\n jobVariationApproveRequest.jobId = this.props.jobDetails.id;\r\n jobVariationApproveRequest.note = this.description.current.value;\r\n\r\n trackPromise(\r\n AXIOS.POST(`tenant-api/job-variation-approve-owner`, jobVariationApproveRequest).\r\n then(response => {\r\n if (response) {\r\n toast.success(\"Job Variation Approved.\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.toggleJobVariationDrawer();\r\n this.props.toggleDrawer(true);\r\n } else {\r\n toast.error(\"Error occured. Please try again.\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n }\r\n }));\r\n }\r\n };\r\n\r\n onClickJobVariationReject = () => {\r\n if (this.description.current.value == '' || this.description.current.value == undefined || this.description.current.value == null) {\r\n toast.error(\"Please enter job rejection note.\", { position: toast.POSITION.BOTTOM_RIGHT });\r\n }\r\n else {\r\n let jobVariationRejectRequest = {};\r\n jobVariationRejectRequest.userId = localStorage.getItem(\"userId\");\r\n jobVariationRejectRequest.jobId = this.props.jobDetails.id;\r\n jobVariationRejectRequest.note = this.description.current.value;\r\n\r\n trackPromise(\r\n AXIOS.POST(`tenant-api/job-variation-reject-owner`, jobVariationRejectRequest).\r\n then(response => {\r\n if (response) {\r\n toast.success(\"Job Variation Rejected.\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.toggleJobVariationDrawer();\r\n this.props.toggleDrawer(true);\r\n } else {\r\n toast.error(\"Error occured. Please try again.\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n }\r\n }));\r\n }\r\n };\r\n\r\n toggleJobVariationDrawer = () => {\r\n this.setState(state => ({\r\n showJobVariationDrawer: !this.state.showJobVariationDrawer\r\n }));\r\n };\r\n}\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n return {\r\n isRefresh: state.MyJobs.isRefreshGrid\r\n };\r\n};\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n refreshGrid: isRefresh => {\r\n dispatch({ type: \"REFRESH_GRID\", isRefresh: isRefresh });\r\n }\r\n };\r\n};\r\n\r\nexport default connect(\r\n mapStateToProps,\r\n mapDispatchToProps\r\n)(JobVariationDrawer);\r\n","import { AXIOS } from '../Utilities/HttpRequest/Axios';\r\nimport { AppConfiguration } from \"read-appsettings-json\";\r\n\r\nexport const getUserDetails = () => {\r\n return AXIOS.GET(`tenant-api/tenant-profile?userId=${localStorage.getItem('userId')}`);\r\n}\r\n\r\nexport const getExternalUserDetails = (userId) => {\r\n return AXIOS.GET(`tenant-api/external-tenant-profile?userId=${userId}`);\r\n}\r\n\r\nexport const saveTenantProfile = (formValues) => {\r\n return AXIOS.POST(\r\n `tenant-api/save-profile`, formValues, {\r\n 'headers': { 'ClientSecret': AppConfiguration.Setting().ClientSecret }\r\n });\r\n}\r\n\r\nexport const getChatUsersList = () => {\r\n return AXIOS.GET(`chat/global?userId=${localStorage.getItem('userId')}&pageNumber=1&pageSize=100`);\r\n}\r\n\r\nexport const getUserRoles = () => {\r\n return AXIOS.GET(`tenant-api/get-user-roles?userId=${localStorage.getItem('userId')}`);\r\n}\r\n\r\nexport const getProviderProfile = (filter) => {\r\n return AXIOS.GET(`tenant-api/profile?filters=${filter}`);\r\n}\r\n\r\nexport const GetProviderBidFeedbacks = (providerId) => {\r\n return AXIOS.GET(`tenant-api/get-provider-bid-feedback?userId=${providerId}&feedbackCount=0`);\r\n}\r\n\r\nconst getFeedbackListByBidId = (bidId) => {\r\n return AXIOS.GET(`tenant-api/bid/feedbackRatingList?bidId=${bidId}`);\r\n}\r\n\r\nconst GetActiveMasterDataFileVersion = (fileType) => {\r\n return AXIOS.GET(`tenant-api/get-active-masterdata-file-version?fileType=${fileType}`);\r\n}\r\n\r\nexport const getCommonOrganizationSettings = (orgId) => {\r\n return AXIOS.GET(`tenant-api/GetCommonOrganizationSettings?orgId=${orgId}`);\r\n}\r\n\r\nconst userService = {\r\n GetActiveMasterDataFileVersion,\r\n GetProviderBidFeedbacks,\r\n getProviderProfile,\r\n getUserDetails,\r\n getExternalUserDetails,\r\n saveTenantProfile,\r\n getChatUsersList,\r\n getUserRoles,\r\n getFeedbackListByBidId,\r\n getCommonOrganizationSettings\r\n\r\n}\r\n\r\nexport default userService;","import { AXIOS } from '../Utilities/HttpRequest/Axios';\r\nimport { AppConfiguration } from \"read-appsettings-json\";\r\n\r\nconst GetPropertyByUserId = () => {\r\n return AXIOS.GET(`tenant-api/property/tenant-property?userId=${localStorage.getItem('userId')}`);\r\n}\r\n\r\nconst GetTenantPropertiesByUserId = () => {\r\n return AXIOS.GET(`tenant-api/property/tenant-properties?userId=${localStorage.getItem('userId')}&isTenant=${(localStorage.getItem(\"userType\") == 4)}`);\r\n}\r\n\r\nconst GetAssignedPropertyManagersForProperty = (propertyId) => {\r\n return AXIOS.GET(`tenant-api/property-managers-for-property?userId=${localStorage.getItem('userIdDecripted')}&propertyId=${propertyId}`);\r\n}\r\n\r\nconst GetDisclaimerByPropertyId = (propertyId) => {\r\n return AXIOS.GET(`tenant-api/property/job-post-disclaimer-by-propertyId?propertyId=${propertyId}`);\r\n}\r\n\r\n\r\nconst propertyService = {\r\n GetPropertyByUserId,\r\n GetTenantPropertiesByUserId,\r\n GetAssignedPropertyManagersForProperty,\r\n GetDisclaimerByPropertyId\r\n}\r\n\r\nexport default propertyService;","import React, { useState } from \"react\";\r\nimport { connect } from \"react-redux\";\r\nimport { AXIOS } from \"../../../Utilities/HttpRequest/Axios\";\r\nimport ImageViewer from \"../../Common/ImageViewer/ImageViewer\";\r\n\r\n// Styles\r\n//import \"../OwnerApproval/JobApproveDrawer.scss\";\r\n\r\nclass JobNotes extends React.Component {\r\n\r\n state = {\r\n jobDetails: {},\r\n jobNotes: [],\r\n userId: \"\"\r\n };\r\n constructor(props) {\r\n super(props);\r\n\r\n this.getJobNotesByJobId = this.getJobNotesByJobId.bind(this);\r\n }\r\n\r\n\r\n componentDidMount() {\r\n this.setState({ jobDetails: this.props.jobDetails, userId: this.props.userId });\r\n this.getJobNotesByJobId();\r\n }\r\n\r\n render() {\r\n\r\n return (\r\n <>\r\n {this.createJobNotesBody()}\r\n \r\n );\r\n }\r\n\r\n createJobNotesBody = () => {\r\n const jobNotes = this.state.jobNotes;\r\n return (\r\n \r\n
\r\n {(jobNotes.length !== 0 &&\r\n jobNotes.map((note, index) => {\r\n return (\r\n
\r\n \r\n
\r\n
\r\n
\r\n
{note.createdUserName}
\r\n
Posted on {note.createdOn}
\r\n
\r\n
\r\n
{note.createdUserType}
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n {note.type}\r\n \r\n
\r\n
\r\n
\r\n\r\n { note && note.attachments && note.attachments.length > 0 ? \r\n
\r\n :\"\"}\r\n\r\n \r\n \r\n
\r\n
1) ? '' : 'hidden'} />\r\n \r\n );\r\n })) ||\r\n (jobNotes.length === 0 &&
Notes not available
)}\r\n
\r\n
{drawer}
;\r\n\r\n }\r\n\r\n toggleDrawer = isClose => {\r\n this.setState(state => ({\r\n showDrawer: !this.state.showDrawer\r\n }));\r\n if (isClose) {\r\n this.props.onClose(false);\r\n }\r\n\r\n };\r\n\r\n createDrawer = () => {\r\n const header = this.createProfileHeader();\r\n const body = this.createProfileBody();\r\n const footer = this.createFooter();\r\n return (\r\n \r\n );\r\n };\r\n\r\n\r\n createProfileHeader = () => {\r\n return (\r\n <>\r\n \r\n Confirmation\r\n \r\n \r\n this.toggleDrawer(true)}\r\n >\r\n
\r\n \r\n );\r\n };\r\n\r\n createProfileBody = () => {\r\n return (\r\n <>\r\n \r\n
\r\n
\r\n
\r\n {this.props.message} \r\n
\r\n\r\n
\r\n
\r\n
\r\n \r\n {this.state.reject} \r\n
\r\n \r\n )\r\n }\r\n\r\n\r\n onAccept = () => {\r\n this.setState(state => ({\r\n showDrawer: false\r\n }));\r\n this.props.onClose(false);\r\n this.props.onConfirm(true);\r\n }\r\n\r\n onReject = () => {\r\n this.setState(state => ({\r\n showDrawer: false\r\n }));\r\n this.props.onClose(false);\r\n this.props.onConfirm(false);\r\n }\r\n\r\n }\r\n\r\n\r\n","import React from \"react\";\r\nimport Drawer from \"../../../Components/Common/Drawer/Drawer\";\r\nimport Loader from \"react-loader-spinner\";\r\nimport { toast } from 'react-toastify';\r\nimport 'react-toastify/dist/ReactToastify.css';\r\nimport bidService from \"../../../Services/BidService\";\r\nimport ConfirmationDrawer from \"../../Drawers/ConfirmationDrawer/ConfirmationDrawer\";\r\n\r\nvar model = {\r\n \"bidAcceptedOrRejectedUserId\": '',\r\n \"userId\": '',\r\n \"note\": '',\r\n \"bidId\": '',\r\n}\r\n\r\nexport default class QuoteAcceptRejectDrawer extends React.Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.note = React.createRef();\r\n }\r\n state = {\r\n showDrawer: false,\r\n quoteNote: '',\r\n isLoading:false,\r\n showConfirmationDrawer:false,\r\n message:''\r\n };\r\n\r\n componentDidMount() {\r\n this.setState({ showDrawer: this.props.showDrawer });\r\n //isAcceptQuote, bid\r\n }\r\n\r\n render() {\r\n\r\n let drawer = this.createDrawer();\r\n return {drawer}
;\r\n\r\n }\r\n\r\n toggleDrawer = isClose => {\r\n this.setState(state => ({\r\n showDrawer: !this.state.showDrawer\r\n }));\r\n\r\n if (isClose) {\r\n this.props.onCloseDrawer(false);\r\n }\r\n\r\n };\r\n\r\n createDrawer = () => {\r\n const header = this.createProfileHeader();\r\n const body = this.createProfileBody();\r\n const footer = this.createFooter();\r\n return (\r\n <>\r\n \r\n {this.state.showConfirmationDrawer?\r\n this.onConfirmation(status)}\r\n onClose={()=>this.onCloseConfirmationDrawer()}>:\"\"}\r\n \r\n );\r\n };\r\n\r\n showConfirmationDrawer=()=>{\r\n var amount = this.props.amount?this.props.amount.toFixed(2):0.00;\r\n var msg = \"A temporary fund of $\"+amount+\" will be held from your nominated credit card and it will be released once the job is marked as completed.\";\r\n this.setState({showConfirmationDrawer:true,\r\n message:msg});\r\n }\r\n\r\n onConfirmation=(status)=>{\r\n if(status){\r\n this.setState({showConfirmationDrawer:false});\r\n this.onAccept();\r\n }\r\n }\r\n\r\n onCloseConfirmationDrawer =()=>{\r\n this.setState({showConfirmationDrawer:false});\r\n }\r\n createProfileHeader = () => {\r\n return (\r\n <>\r\n \r\n Quote\r\n {(this.state.isLoading) ? \r\n \r\n this.toggleDrawer(true)}\r\n >\r\n
\r\n \r\n );\r\n };\r\n\r\n createProfileBody = () => {\r\n return (\r\n <>\r\n \r\n
\r\n
\r\n
\r\n Quote amount : ${this.props.amount?this.props.amount.toFixed(2):0.00} \r\n
\r\n
\r\n
Note \r\n
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n Cancel \r\n {this.props.isAcceptQuote ? :\r\n Reject }\r\n\r\n
\r\n \r\n )\r\n }\r\n\r\n handleOnChangeNote = () => {\r\n const note = this.note.current.value;\r\n this.setState({\r\n quoteNote: note\r\n });\r\n }\r\n\r\n onAccept = () => {\r\n\r\n\r\n\r\n this.setState({\r\n isLoading:true\r\n })\r\n\r\n model.bidId = this.props.bidId;\r\n model.bidAcceptedOrRejectedUserId = localStorage.getItem(\"userId\");\r\n model.userId = localStorage.getItem(\"userId\");\r\n model.note = this.state.quoteNote;\r\n\r\n bidService.acceptTenantMangeQuote(model).then(\r\n (res) => {\r\n if(res.status==13){\r\n toast.error(res.message, {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.setState(state => ({\r\n isLoading:false\r\n }));\r\n\r\n }else{\r\n toast.success(\"Quote accepted successfully\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n \r\n this.setState(state => ({\r\n isLoading:false,\r\n showDrawer: false\r\n }));\r\n this.props.onCloseDrawer(true);\r\n }\r\n\r\n }, error => {\r\n this.setState(state => ({\r\n isLoading:false\r\n }));\r\n toast.error(\"Quote accept unsuccessful\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n }\r\n )\r\n }\r\n\r\n onReject = () => {\r\n \r\n model.bidId = this.props.bidId;\r\n model.bidAcceptedOrRejectedUserId = localStorage.getItem(\"userId\");\r\n model.userId = localStorage.getItem(\"userId\");\r\n model.note = this.state.quoteNote;\r\n if (!model.note || model.note == \"\") {\r\n toast.error(\"Reject note required\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n } else {\r\n this.setState({\r\n isLoading:true\r\n })\r\n bidService.rejectTenantMangeQuote(model).then(\r\n (res) => {\r\n toast.success(\"Quote rejected successfully\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.setState(state => ({\r\n isLoading:false,\r\n showDrawer: false\r\n }));\r\n this.props.onCloseDrawer(true);\r\n }, error => {\r\n this.setState(state => ({\r\n isLoading:false\r\n }));\r\n toast.error(\"Quote reject unsuccessful\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n }\r\n )\r\n }\r\n\r\n }\r\n\r\n}\r\n","import React, { useState } from \"react\";\r\nimport Drawer from \"../../Common/Drawer/Drawer\";\r\nimport bidService from \"../../../Services/BidService\";\r\nimport { connect } from \"react-redux\";\r\nimport { AXIOS } from \"../../../Utilities/HttpRequest/Axios\";\r\nimport { toast } from \"react-toastify\";\r\nimport { AppConfiguration } from \"read-appsettings-json\";\r\n\r\nclass DeclineQuotesDrawer extends React.Component {\r\n state = {\r\n showDeclineAllQuotesDrawer: false,\r\n disableDeclineButton:false\r\n };\r\n constructor(props) {\r\n super(props);\r\n this.description = React.createRef();\r\n }\r\n\r\n render() {\r\n let drawer = this.createDrawer();\r\n\r\n return (\r\n \r\n
\r\n
If you want more information or have any questions, please reply to the email that you received which will go directly to your property manager.
\r\n
\r\n
\r\n \r\n \r\n
\r\n {drawer}\r\n
\r\n );\r\n };\r\n\r\n createDeclineAllQuotesHeader = () => {\r\n return (\r\n <>\r\n Decline Quotes \r\n \r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n createDeclineAllQuotesBody = () => {\r\n return (\r\n \r\n
\r\n
\r\n
\r\n Note* \r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n {\" \"}\r\n CANCEL{\" \"}\r\n \r\n \r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n onDeclineAllQuotes = () => {\r\n if (this.description.current.value == '' || this.description.current.value == undefined || this.description.current.value == null) {\r\n toast.error(\"Please enter quotes decline reason.\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n return;\r\n }\r\n this.setState({disableDeclineButton:true})\r\n \r\n bidService.declineAllBidsByOwner(this.props.jobDetails.id, this.description.current.value).then(res => {\r\n if(res){\r\n toast.success('All bids decline by owner', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.toggleDeclineAllQuotesDrawer();\r\n this.props.toggleDrawer(true);\r\n }\r\n else{\r\n debugger;\r\n toast.error('Job status has been changed. Please contact the property manager for more details', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.setState({disableDeclineButton:false})\r\n }\r\n });\r\n }\r\n\r\n toggleDeclineAllQuotesDrawer = () => {\r\n this.setState(state => ({\r\n showDeclineAllQuotesDrawer: !this.state.showDeclineAllQuotesDrawer\r\n }));\r\n };\r\n}\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n return {\r\n isRefresh: state.MyJobs.isRefreshGrid\r\n };\r\n};\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n refreshGrid: isRefresh => {\r\n dispatch({ type: \"REFRESH_GRID\", isRefresh: isRefresh });\r\n }\r\n };\r\n};\r\n\r\nexport default connect(\r\n mapStateToProps,\r\n mapDispatchToProps\r\n)(DeclineQuotesDrawer);\r\n","import React, { useState } from \"react\";\r\nimport Drawer from \"../../Common/Drawer/Drawer\";\r\nimport bidService from \"../../../Services/BidService\";\r\nimport { connect } from \"react-redux\";\r\nimport { AXIOS } from \"../../../Utilities/HttpRequest/Axios\";\r\nimport { toast } from \"react-toastify\";\r\nimport { AppConfiguration } from \"read-appsettings-json\";\r\n\r\nclass QuoteAcceptDrawer extends React.Component {\r\n state = {\r\n showAcceptQuoteDrawer: false,\r\n disableAcceptButton:false\r\n };\r\n constructor(props) {\r\n super(props);\r\n this.description = React.createRef();\r\n }\r\n\r\n render() {\r\n let drawer = this.createDrawer();\r\n\r\n return (\r\n <>\r\n Accept \r\n {drawer}\r\n \r\n );\r\n }\r\n\r\n createDrawer = () => {\r\n const header = this.createAcceptQuoteHeader();\r\n const body = this.createAcceptQuoteBody();\r\n const footer = this.createAcceptQuoteFooter();\r\n\r\n return (\r\n \r\n );\r\n };\r\n\r\n createAcceptQuoteHeader = () => {\r\n return (\r\n <>\r\n Accept Quote \r\n \r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n createAcceptQuoteBody = () => {\r\n return (\r\n \r\n
\r\n
\r\n
\r\n Note* \r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n {\" \"}\r\n CANCEL{\" \"}\r\n \r\n \r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n onClickApproveBid = () => {\r\n if (this.description.current.value == '' || this.description.current.value == undefined || this.description.current.value == null) {\r\n toast.error(\"Please enter quote accept reason.\", {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n return;\r\n }\r\n this.setState({disableAcceptButton:true})\r\n\r\n bidService.approveBidByOwner(this.props.jobDetails.id, this.props.bidDetails.bidId, this.description.current.value).then(res => {\r\n if(res){\r\n toast.success('Bid accepted by owner', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.toggleAcceptQuoteDrawer();\r\n this.props.toggleDrawer(true);\r\n }\r\n else{\r\n debugger;\r\n toast.error('Job status has been changed. Please contact the property manager for more details', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.setState({disableAcceptButton:false})\r\n } \r\n })\r\n };\r\n\r\n toggleAcceptQuoteDrawer = () => {\r\n this.setState(state => ({\r\n showAcceptQuoteDrawer: !this.state.showAcceptQuoteDrawer\r\n }));\r\n };\r\n}\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n return {\r\n isRefresh: state.MyJobs.isRefreshGrid\r\n };\r\n};\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n refreshGrid: isRefresh => {\r\n dispatch({ type: \"REFRESH_GRID\", isRefresh: isRefresh });\r\n }\r\n };\r\n};\r\n\r\nexport default connect(\r\n mapStateToProps,\r\n mapDispatchToProps\r\n)(QuoteAcceptDrawer);\r\n","import React, { useState } from \"react\";\r\nimport { connect } from \"react-redux\";\r\nimport bidService from \"../../../Services/BidService\";\r\nimport Moment from \"react-moment\";\r\nimport ImageViewer from \"../../Common/ImageViewer/ImageViewer\";\r\nimport { toast } from 'react-toastify';\r\nimport \"./quotesDetail.scss\";\r\nimport StarRatingComponent from \"react-star-rating-component\";\r\nimport ProviderMiniProfileDrawer from '../../Drawers/JobPostDrawer/ProviderProfileDrawer/ProviderMiniProfileDrawer';\r\nimport QuoteAcceptRejectDrawer from \"./QuoteAcceptRejectDrawer\";\r\nimport DeclineQuotesDrawer from \"../../Drawers/DeclineAllQuotesDrawer/DeclineAllQuotesDrawer\";\r\nimport QuoteAcceptDrawer from \"../../Drawers/QuoteAcceptDrawer/QuoteAcceptDrawer\";\r\nimport Loader from \"react-loader-spinner\";\r\n// Styles\r\n//import \"../OwnerApproval/JobApproveDrawer.scss\";\r\n\r\nclass QuotesDetails extends React.Component {\r\n\r\n state = {\r\n jobDetails: {},\r\n quotes: [],\r\n userId: \"\",\r\n isTenantManageJob:false,\r\n isShowProviderDrawer:false,\r\n providerViewId:'',\r\n showAcceptRejectDrawer:false,\r\n isAcceptQuote:false,\r\n selectedbidId:'',\r\n selectedbidAmount:0,\r\n isLoading:false,\r\n propertyId:'',\r\n ownerApprovalCount:0\r\n };\r\n constructor(props) {\r\n super(props);\r\n\r\n this.getQuoteAmount = this.getQuoteAmount.bind(this);\r\n this.getQoutesByJobId = this.getQoutesByJobId.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n this.setState({ jobDetails: this.props.jobDetails,\r\n userId: this.props.userId,\r\n isTenantManageJob : (this.props.jobDetails && this.props.jobDetails.isTenantManageJob)?true:false});\r\n this.getQoutesByJobId();\r\n }\r\n\r\n render() {\r\n\r\n return (\r\n <>\r\n {(this.state.isLoading) ? \r\n : ''}\r\n {(this.state.showAcceptRejectDrawer) ?\r\n this.onCloseDrawer(event)}>\r\n : ''}\r\n \r\n );\r\n }\r\n\r\n createJobQuoteBody = () => {\r\n const { jobDetails } = this.props;\r\n return (\r\n (!this.state.isTenantManageJob)?\r\n \r\n
Quote Limit : {(jobDetails && jobDetails.quoteLimit != null) ? jobDetails.quoteLimit : \"0\"} \r\n {(this.props.jobDetails.workflowStatusId == 6) ?
Note: Please select the best quote for the job, if not decline all to request better quotes.
: ''}\r\n {this.getQuotesList()}\r\n {(!this.state.quotes || this.state.quotes == null) ?
Quotes not available : \"\"}\r\n {\r\n this.bidDeclineButton()\r\n }\r\n
\r\n {this.getQuotesListForTenantManageJobs()} \r\n
\r\n );\r\n };\r\n\r\n bidDeclineButton=()=>{ \r\n let isReplyed = this.state.quotes.filter(a => a.quoteApprovalStatusId === 1 || a.quoteApprovalStatusId === 2).length > 0\r\n if (isReplyed || this.state.quotes.filter(a => a.jobStatus === 107 || a.jobStatus === 7).length > 0 || (this.props.jobDetails.workflowStatusId != 6 && this.state.ownerApprovalCount != 0)){\r\n return '';\r\n } else if(this.state.quotes.length > 0 && this.props.jobDetails.propertyId !== null && !this.state.jobDetails.isOwnerApprovalPendingForVariation) {\r\n return <>\r\n this.onCloseDrawer(event)}\r\n jobDetails={this.props.jobDetails}\r\n >\r\n \r\n }else{\r\n return '';\r\n }\r\n }\r\n\r\n onDeclineAllQuotes = () => {\r\n bidService.declineAllBidsByOwner(this.props.jobDetails.id, \"\").then(res => {\r\n toast.success('All bids decline by owner', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.props.reload();\r\n });\r\n }\r\n\r\n getQuotesList = () => {\r\n const quotes = this.state.quotes.map((bid, index) => {\r\n return (\r\n <>\r\n \r\n
\r\n
\r\n
created on \r\n {bid.createdOn}\r\n { } \r\n
\r\n
{bid.name} \r\n
email: {bid.email}
\r\n
tel: {bid.phone}
\r\n
\r\n
\r\n
\r\n {this.getQuoteAmount(bid)}\r\n
\r\n
\r\n\r\n
\r\n
\r\n {this.getSPNotes(bid.notes)}\r\n
\r\n
\r\n
\r\n {(bid.availabilityStart && bid.availabilityEnd) ?\r\n
\r\n
Schedule
\r\n
{bid.availabilityStart} to {bid.availabilityEnd}
\r\n
\r\n : ''}\r\n
\r\n
\r\n {(bid.estimatedTimeDisplay) ?\r\n
\r\n
Estimated Time
\r\n
{bid.estimatedTimeDisplay}
\r\n
\r\n : ''}\r\n
\r\n
\r\n {(!this.isApprovedOrDeclined() && this.props.jobDetails.propertyId != null \r\n && this.props.jobDetails.workflowStatusId!==107 && this.props.jobDetails.workflowStatusId!==7 \r\n && !this.state.jobDetails.isOwnerApprovalPendingForVariation && (this.props.jobDetails.workflowStatusId == 6 || this.state.ownerApprovalCount == 0)) ? <>\r\n
\r\n this.onCloseDrawer(event)}\r\n jobDetails={this.props.jobDetails}\r\n bidDetails={bid}\r\n >\r\n
\r\n : ''}\r\n
\r\n\r\n
\r\n {(bid.hasOwnProperty(\"attachments\")) ?\r\n
\r\n
\r\n\r\n\r\n
\r\n\r\n
\r\n
\r\n
this.providerProfileView(bid.providerProfile.userId)} style={{ padding: '10px' }}>\r\n
\r\n
\r\n
\r\n
\r\n
{bid.providerProfile.name} {(bid.providerProfile.businessName) ? \" | \" + bid.providerProfile.businessName : \"\"} \r\n
\r\n
Jobs Completed : {bid.providerProfile.completedJobsCount} \r\n
\r\n
\r\n
\r\n\r\n
\r\n {(bid.amount && bid.amount > 0) ?\r\n
\r\n
\r\n Quote amount \r\n ${bid.amount ? bid.amount.toFixed(2) : 0.00} \r\n
\r\n
\r\n :\"\"}\r\n {(bid.callOutFee>0 ||bid.hourlyRate>0) ?\r\n
\r\n
\r\n Call out fee \r\n ${bid.callOutFee ? bid.callOutFee.toFixed(2) : 0.00} \r\n
\r\n
\r\n Hourly rate \r\n ${bid.hourlyRate ? bid.hourlyRate.toFixed(2) : 0.00} \r\n
\r\n
\r\n :\"\"}\r\n \r\n \r\n\r\n
\r\n {bid.notes} \r\n
\r\n\r\n\r\n
\r\n
\r\n Esimated time \r\n {this.timeConvert(bid.estimatedHours)} \r\n
\r\n
\r\n {(bid.hasOwnProperty(\"attachments\")) ?\r\n
\r\n
\r\n \r\n\r\n {bid.status === 101?
\r\n
\r\n { this.approveQuote(bid.bidId,bid.amount) }}>Accept \r\n
\r\n
\r\n { this.rejectQuote(bid.bidId,bid.amount) }}>Reject \r\n
\r\n
:\"\"}\r\n\r\n
\r\n
\r\n
Quoted Amount
\r\n
${(bid.priceRevised > 0) ? bid.priceRevised.toFixed(2) : bid.amount.toFixed(2)}
\r\n
\r\n
\r\n
\r\n \r\n Min Max \r\n \r\n ${bid.amount.toFixed(2)}
${bid.amountMax.toFixed(2)}
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n Call out fee Hourly rate \r\n \r\n ${bid.callOutFee.toFixed(2)}
${bid.hourlyRate.toFixed(2)}
\r\n
\r\n
\r\n
Note: {notes}
;\r\n }\r\n };\r\n\r\n getInvoiceAttachments = (bid) => {\r\n if (bid.job != null && bid.job.attachments != null) {\r\n let invoiceAttachments = bid.job.attachments.filter(a => a.type == 6 && a.userId == bid.providerId)\r\n return (\r\n \r\n
\r\n );\r\n }\r\n }\r\n\r\n isApprovedOrDeclined = () => {\r\n return this.state.quotes.filter(a => a.quoteApprovalStatusId == 1 || a.quoteApprovalStatusId == 2).length > 0\r\n };\r\n\r\n onClickApproveBid = (bid) => {\r\n \r\n bidService.approveBidByOwner(this.props.jobDetails.id, bid.bidId, \"\").then(res => {\r\n toast.success('Bid accepted by owner', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.props.reload();\r\n })\r\n };\r\n\r\n\r\n providerProfileView =(id)=> {\r\n this.setState({providerViewId: id,isShowProviderDrawer:true});\r\n }\r\n onCloseProviderDrawer = ()=>{\r\n this.setState({isShowProviderDrawer: false});\r\n }\r\n\r\n \r\n\r\n onCloseDrawer = (event)=>{\r\n \r\n if(event){\r\n this.getQoutesByJobId();\r\n this.props.reload();\r\n }\r\n this.setState({showAcceptRejectDrawer: false});\r\n }\r\n}\r\n\r\n\r\n\r\nexport default connect(\r\n)(QuotesDetails);\r\n","export const WEEKDAYS = [\r\n { fullName: \"Sunday\", shortName: \"sun\", initial: \"S\" },\r\n { fullName: \"Monday\", shortName: \"mon\", initial: \"M\" },\r\n { fullName: \"Tuesday\", shortName: \"tue\", initial: \"T\" },\r\n { fullName: \"Wednesday\", shortName: \"wed\", initial: \"W\" },\r\n { fullName: \"Thursday\", shortName: \"thu\", initial: \"T\" },\r\n { fullName: \"Friday\", shortName: \"fri\", initial: \"F\" },\r\n { fullName: \"Saturday\", shortName: \"sat\", initial: \"S\" },\r\n];\r\n\r\nexport const MONTHS = [\r\n {fullName: 'January', shortName: 'Jan', key: 0 },\r\n {fullName: 'February', shortName: 'Feb', key: 1 },\r\n {fullName: 'March', shortName: 'Mar', key: 2 },\r\n {fullName: 'April', shortName: 'Apr', key: 3 },\r\n {fullName: 'May', shortName: 'May', key: 4 },\r\n {fullName: 'June', shortName: 'Jun', key: 5 },\r\n {fullName: 'July', shortName: 'Jul', key: 6 },\r\n {fullName: 'August', shortName: 'Aug', key: 7 },\r\n {fullName: 'September', shortName: 'Sep', key: 8 },\r\n {fullName: 'October', shortName: 'Oct', key: 9 },\r\n {fullName: 'November', shortName: 'Nov', key: 10 },\r\n {fullName: 'December', shortName: 'Dec', key: 11 }\r\n];\r\n\r\n// export const TIME_SLOTS = [\r\n// { start: \"0000\", end: \"0200\" },\r\n// { start: \"0200\", end: \"0400\" },\r\n// { start: \"0400\", end: \"0600\" },\r\n// { start: \"0600\", end: \"0800\" },\r\n// { start: \"0800\", end: \"1000\" },\r\n// { start: \"1000\", end: \"1200\" },\r\n// { start: \"1200\", end: \"1400\" },\r\n// { start: \"1400\", end: \"1600\" },\r\n// { start: \"1600\", end: \"1800\" },\r\n// { start: \"1800\", end: \"2000\" },\r\n// { start: \"2000\", end: \"2200\" },\r\n// { start: \"2200\", end: \"2400\" }\r\n// ];\r\n\r\nconst WORK_DAY = [\r\n { start: \"0800\", end: \"1000\" },\r\n { start: \"1000\", end: \"1200\" },\r\n { start: \"1200\", end: \"1400\" },\r\n { start: \"1400\", end: \"1600\" },\r\n { start: \"1600\", end: \"1800\" }\r\n];\r\n\r\nfunction getWorkDaySlots(day) {\r\n return WORK_DAY.map(slot => ({ ...slot, day }));\r\n}\r\n\r\nexport const WORK_WEEK = [\"mon\", \"tue\", \"wed\", \"thu\", \"fri\"].map(getWorkDaySlots).flat();\r\n\r\nexport const TIME_SLOTS = [\r\n { displayText: '12 AM', time: 24 , hours: 0, minutes: 0},\r\n { displayText: '', time: 2430, hours: 0, minutes: 30 },\r\n { displayText: '1 AM', time: 10 , hours: 1, minutes: 0},\r\n { displayText: '', time: 130, hours: 1, minutes: 30 },\r\n { displayText: '2 AM', time: 20 , hours: 2, minutes: 0},\r\n { displayText: '', time: 230, hours: 2, minutes: 30 },\r\n { displayText: '3 AM', time: 30 , hours: 3, minutes: 0},\r\n { displayText: '', time: 330, hours: 3, minutes: 30 },\r\n { displayText: '4 AM', time: 40 , hours: 4, minutes: 0},\r\n { displayText: '', time: 430, hours: 4, minutes: 30 },\r\n { displayText: '5 AM', time: 50 , hours: 5, minutes: 0},\r\n { displayText: '', time: 530, hours: 5, minutes: 30 },\r\n { displayText: '6 AM', time: 60 , hours: 6, minutes: 0},\r\n { displayText: '', time: 630, hours: 6, minutes: 30 },\r\n { displayText: '7 AM', time: 70 , hours: 7, minutes: 0},\r\n { displayText: '', time: 730, hours: 7, minutes: 30 },\r\n { displayText: '8 AM', time: 80 , hours: 8, minutes: 0},\r\n { displayText: '', time: 830, hours: 8, minutes: 30 },\r\n { displayText: '9 AM', time: 90, hours: 9, minutes: 0 },\r\n { displayText: '', time: 930, hours: 9, minutes: 30 },\r\n { displayText: '10 AM', time: 100, hours: 10, minutes: 0 },\r\n { displayText: '', time: 1030, hours: 10, minutes: 30 },\r\n { displayText: '11 AM', time: 110, hours: 11, minutes: 0 },\r\n { displayText: '', time: 1130, hours: 11, minutes: 30 },\r\n { displayText: '12 AM', time: 120, hours: 12, minutes: 0 },\r\n { displayText: '', time: 1230, hours: 12, minutes: 30 },\r\n { displayText: '1 PM', time: 1300, hours: 13, minutes: 0 },\r\n { displayText: '', time: 1330, hours: 13, minutes: 30 },\r\n { displayText: '2 PM', time: 140, hours: 14, minutes: 0 },\r\n { displayText: '', time: 1430, hours: 14, minutes: 30 },\r\n { displayText: '3 PM', time: 150, hours: 15, minutes: 0 },\r\n { displayText: '', time: 1530, hours: 15, minutes: 30 },\r\n { displayText: '4 PM', time: 160, hours: 16, minutes: 0 },\r\n { displayText: '', time: 1630, hours: 16, minutes: 30 },\r\n { displayText: '5 PM', time: 170, hours: 17, minutes: 0 },\r\n { displayText: '', time: 1730, hours: 17, minutes: 30 },\r\n { displayText: '6 PM', time: 180, hours: 18, minutes: 0 },\r\n { displayText: '', time: 1830, hours: 18, minutes: 30 },\r\n { displayText: '7 PM', time: 190, hours: 19, minutes: 0 },\r\n { displayText: '', time: 1930, hours: 19, minutes: 30 },\r\n { displayText: '8 PM', time: 200, hours: 20, minutes: 0 },\r\n { displayText: '', time: 2030, hours: 20, minutes: 30 },\r\n { displayText: '9 PM', time: 210, hours: 21, minutes: 0 },\r\n { displayText: '', time: 2130, hours: 21, minutes: 30 },\r\n { displayText: '10 PM', time: 220, hours: 22, minutes: 0 },\r\n { displayText: '', time: 2230, hours: 22, minutes: 30 },\r\n { displayText: '11 PM', time: 2300, hours: 23, minutes: 0 },\r\n { displayText: '', time: 2330, hours: 23, minutes: 30 }\r\n]","import React from \"react\";\r\nimport { connect } from \"react-redux\";\r\nimport { WEEKDAYS, TIME_SLOTS, MONTHS } from \"./Time\";\r\nimport moment from 'moment';\r\nimport { DatetimePickerTrigger, DatetimePicker, DatetimeRangePickerTrigger } from 'rc-datetime-picker';\r\nimport TimePicker from 'rc-time-picker';\r\nimport { toast } from 'react-toastify';\r\nimport 'rc-time-picker/assets/index.css';\r\nimport './EventScheduler.scss'\r\n\r\nclass EventScheduler extends React.Component {\r\n\r\n state = {\r\n workDays: [],\r\n suggestedTimeSlots: [],\r\n bidDetails: {},\r\n totalJobTimeHoursPortion: 0,\r\n totalJobTimeMinutesPortion: 0,\r\n estimatedJobTimeHoursPortion: 0,\r\n estimatedJobTimeMinutesPortion: 0,\r\n travelTimeHoursPortion: 0,\r\n travelTimeMinutesPortion: 0\r\n };\r\n\r\n componentDidMount() {\r\n this.fillTimeSlots();\r\n this.convertJobTimesToHoursAndMinutes();\r\n this.props.onRef(this);\r\n }\r\n\r\n componentWillUnmount() {\r\n this.props.onRef(undefined);\r\n }\r\n\r\n\r\n fillTimeSlots = () => {\r\n this.onPrepareGrid(this.props.fromDate, this.props.toDate);\r\n setTimeout(() => {\r\n this.fillAvailableTimeSlots();\r\n this.fillWorkingTimeSlots();\r\n this.fillSuggestedTimeSlots();\r\n this.fillNotAvailableTimeSlots();\r\n }, 500);\r\n }\r\n\r\n onPrepareGrid(fromDate, toDate) {\r\n let days = [];\r\n let endDate = new Date(toDate);\r\n let newToDate = new Date(endDate.setDate(endDate.getDate() + 1))\r\n let count = this.daysCountBetween(fromDate, newToDate)\r\n for (let index = 0; index < count; index++) {\r\n let fromDateObj = fromDate;\r\n let tomorrow = new Date(fromDateObj);\r\n tomorrow.setDate(tomorrow.getDate() + index);\r\n let dateObj = new Date(tomorrow);\r\n days.push({\r\n localDateString: dateObj.toLocaleDateString(),\r\n date: dateObj,\r\n day: WEEKDAYS[dateObj.getDay()].fullName,\r\n availableSlots: [],\r\n sugesstedSlots: [],\r\n notAvilableSlots: [],\r\n workingSlots: []\r\n })\r\n }\r\n this.setState({\r\n workDays: days\r\n });\r\n }\r\n\r\n fillAvailableTimeSlots = (workDays) => {\r\n this.props.availableTimeSlots.forEach(element => {\r\n let daysCount = this.daysCountBetween(element.from, element.to)\r\n if (daysCount == 0) {\r\n let dateObj = this.state.workDays.find(a => a.localDateString == element.from.toLocaleDateString())\r\n let fromHoursCount = element.from.getHours();\r\n let fromMinsCount = element.from.getMinutes();\r\n let toHoursCount = (element.to.getHours() == 0) ? 24 : element.to.getHours();\r\n let toMinsCount = element.to.getMinutes();\r\n let hours = [];\r\n for (let index = fromHoursCount; index <= toHoursCount; index++) {\r\n if (index == fromHoursCount) {\r\n let mins = (Math.round(fromMinsCount / 30) * 30) % 60;\r\n if (fromMinsCount > 30) {\r\n if (mins == 30) {\r\n hours.push((index).toString() + 30);\r\n }\r\n } else {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((index).toString() + 30);\r\n } else {\r\n hours.push((index).toString() + 30);\r\n }\r\n }\r\n } else if (index == toHoursCount) {\r\n let mins = (Math.round(toMinsCount / 30) * 30) % 60;\r\n if (toMinsCount > 30) {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30');\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n } else {\r\n if (mins == 30) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30')\r\n }\r\n }\r\n dateObj.availableSlots = dateObj.availableSlots.concat(hours);\r\n } else {\r\n for (let i = 0; i <= daysCount; i++) {\r\n let from = new Date(element.from);\r\n let tomorrow = from;\r\n tomorrow.setDate(tomorrow.getDate() + i);\r\n let fromObj = new Date(tomorrow);\r\n let fromHoursCount = element.from.getHours();\r\n let fromMinsCount = element.from.getMinutes();\r\n let toHoursCount = (element.to.getHours() == 0) ? 24 : element.to.getHours();\r\n let toMinsCount = element.to.getMinutes();\r\n let dateObj = this.state.workDays.find(a => a.localDateString == fromObj.toLocaleDateString());\r\n let hours = []\r\n if (daysCount == i) {\r\n fromHoursCount = 8;\r\n } else if (i > 0 && i != daysCount) {\r\n fromHoursCount = 8;\r\n toHoursCount = 17;\r\n } else {\r\n toHoursCount = 17;\r\n }\r\n for (let index = fromHoursCount; index <= toHoursCount; index++) {\r\n if (index == fromHoursCount) {\r\n let mins = (Math.round(fromMinsCount / 30) * 30) % 60;\r\n if (fromMinsCount > 30) {\r\n if (mins == 30) {\r\n hours.push((index).toString() + 30);\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((index).toString() + 30);\r\n }\r\n } else {\r\n //if(mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((index).toString() + 30);\r\n //} else {\r\n // if(index == 23 || index == 13) {\r\n // hours.push((index).toString() + '00');\r\n // } else {\r\n // hours.push((index).toString() + 0);\r\n // }\r\n // hours.push((index).toString() + 30);\r\n //}\r\n }\r\n } else if (index == toHoursCount) {\r\n let mins = (Math.round(toMinsCount / 30) * 30) % 60;\r\n if (toMinsCount > 30) {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30');\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n } else {\r\n if (mins == 30 || toHoursCount == 17) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30')\r\n }\r\n }\r\n dateObj.availableSlots = dateObj.availableSlots.concat(hours);\r\n }\r\n }\r\n })\r\n }\r\n\r\n updateAvailableTimeSlots = () => {\r\n let workDays = this.state.workDays;\r\n if (this.props.availableTimeSlots.length > 0) {\r\n this.props.availableTimeSlots.forEach(element => {\r\n let startTime = element.from;\r\n let endTime = element.to;\r\n let daysCount = this.daysCountBetween(startTime, endTime)\r\n var arrayIndex = workDays.findIndex(a => a.localDateString == startTime.toLocaleDateString())\r\n if (daysCount == 0 && arrayIndex >= 0) {\r\n let dateObj = workDays[arrayIndex];\r\n let fromHoursCount = element.from.getHours();\r\n let fromMinsCount = element.from.getMinutes();\r\n let toHoursCount = (element.to.getHours() == 0) ? 24 : element.to.getHours();\r\n let toMinsCount = element.to.getMinutes();\r\n let hours = []\r\n for (let index = fromHoursCount; index <= toHoursCount; index++) {\r\n let hoursIndex = index == 0 ? 24 : index;\r\n if (index == fromHoursCount) {\r\n let mins = (Math.round(fromMinsCount / 30) * 30) % 60;\r\n if (fromMinsCount > 30) {\r\n if (mins == 30) {\r\n hours.push((hoursIndex).toString() + 30);\r\n }\r\n } else {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((hoursIndex).toString() + 30);\r\n } else {\r\n hours.push((hoursIndex).toString() + 30);\r\n }\r\n }\r\n } else if (index == toHoursCount) {\r\n let mins = (Math.round(toMinsCount / 30) * 30) % 60;\r\n if (toMinsCount > 30) {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(hoursIndex.toString() + '30');\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n } else {\r\n if (mins == 30) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(hoursIndex.toString() + '30')\r\n }\r\n }\r\n dateObj.availableSlots = dateObj.availableSlots.concat(hours);\r\n workDays[arrayIndex] = dateObj;\r\n this.setState({ workDays: workDays });\r\n } else if(arrayIndex >= 0) {\r\n for (let i = 0; i <= daysCount; i++) {\r\n let from = new Date(element.from);\r\n let tomorrow = from;\r\n tomorrow.setDate(tomorrow.getDate() + i);\r\n let fromObj = new Date(tomorrow);\r\n let fromHoursCount = element.from.getHours();\r\n let fromMinsCount = element.from.getMinutes();\r\n let toHoursCount = (element.to.getHours() == 0) ? 24 : element.to.getHours();\r\n let toMinsCount = element.to.getMinutes();\r\n let arrayIndex = this.state.workDays.findIndex(a => a.localDateString == fromObj.toLocaleDateString())\r\n let dateObj = this.state.workDays[arrayIndex];\r\n let hours = []\r\n if (daysCount == i) {\r\n fromHoursCount = 8;\r\n } else if (i > 0 && i != daysCount) {\r\n fromHoursCount = 8;\r\n toHoursCount = 17;\r\n } else {\r\n toHoursCount = 17;\r\n }\r\n for (let index = fromHoursCount; index <= toHoursCount; index++) {\r\n if (index == fromHoursCount) {\r\n let mins = (Math.round(fromMinsCount / 30) * 30) % 60;\r\n if (fromMinsCount > 30) {\r\n if (mins == 30) {\r\n hours.push((index).toString() + 30);\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((index).toString() + 30);\r\n }\r\n } else {\r\n //if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((index).toString() + 30);\r\n //} else {\r\n // if (index == 23 || index == 13) {\r\n // hours.push((index).toString() + '00');\r\n // } else {\r\n // hours.push((index).toString() + 0);\r\n // }\r\n // hours.push((index).toString() + 30);\r\n //}\r\n }\r\n } else if (index == toHoursCount) {\r\n let mins = (Math.round(toMinsCount / 30) * 30) % 60;\r\n if (toMinsCount > 30) {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30');\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n } else {\r\n if (mins == 30 || toHoursCount == 17) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30')\r\n }\r\n }\r\n dateObj.availableSlots = dateObj.availableSlots.concat(hours);\r\n workDays[arrayIndex] = dateObj;\r\n this.setState({ workDays: workDays });\r\n }\r\n }\r\n })\r\n }\r\n }\r\n\r\n fillWorkingTimeSlots = (workDays) => {\r\n this.props.workingSlots.forEach(element => {\r\n if (!element || !element.fromDateTime) {\r\n return;\r\n }\r\n let daysCount = 0;\r\n if (daysCount == 0) {\r\n let startTime = element.from;\r\n let endTime = element.to;\r\n let dateObj = this.state.workDays.find(a => a.localDateString == startTime.toLocaleDateString())\r\n let fromHoursCount = startTime.getHours();\r\n let fromMinsCount = startTime.getMinutes();\r\n let toHoursCount = (endTime.getHours() == 0) ? 24 : endTime.getHours();\r\n let toMinsCount = endTime.getMinutes();\r\n let hours = []\r\n for (let index = fromHoursCount; index <= toHoursCount; index++) {\r\n if (index == fromHoursCount) {\r\n let mins = (Math.round(fromMinsCount / 30) * 30) % 60;\r\n if (fromMinsCount > 30) {\r\n if (mins == 30) {\r\n hours.push((index).toString() + 30);\r\n }\r\n } else {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((index).toString() + 30);\r\n } else {\r\n hours.push((index).toString() + 30);\r\n }\r\n }\r\n } else if (index == toHoursCount) {\r\n let mins = (Math.round(toMinsCount / 30) * 30) % 60;\r\n if (toMinsCount > 30) {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30');\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n } else {\r\n if (mins == 30) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30')\r\n }\r\n }\r\n dateObj.workingSlots = dateObj.workingSlots.concat(hours);\r\n\r\n }\r\n });\r\n\r\n\r\n }\r\n\r\n updateWorkingTimeSlots = () => {\r\n let workDays = this.state.workDays;\r\n this.props.workingSlots.forEach(element => {\r\n\r\n if (!element || !element.fromDateTime) {\r\n return;\r\n }\r\n let startTime = element.from;\r\n let endTime = element.to;\r\n let daysCount = 0;\r\n let arrayIndex = workDays.findIndex(a => a.localDateString == startTime.toLocaleDateString());\r\n if (daysCount == 0 && arrayIndex >= 0) { \r\n\r\n let dateObj = workDays[arrayIndex];\r\n let fromHoursCount = startTime.getHours();\r\n let fromMinsCount = startTime.getMinutes();\r\n let toHoursCount = (endTime.getHours() == 0) ? 24 : endTime.getHours();\r\n let toMinsCount = endTime.getMinutes();\r\n let hours = [];\r\n for (let index = fromHoursCount; index <= toHoursCount; index++) {\r\n let hoursIndex = index == 0 ? 24 : index;\r\n if (index == fromHoursCount) {\r\n let mins = (Math.round(fromMinsCount / 30) * 30) % 60;\r\n if (fromMinsCount > 30) {\r\n if (mins == 30) {\r\n hours.push((hoursIndex).toString() + 30);\r\n }\r\n } else {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((hoursIndex).toString() + 30);\r\n } else {\r\n hours.push((hoursIndex).toString() + 30);\r\n }\r\n }\r\n } else if (index == toHoursCount) {\r\n let mins = (Math.round(toMinsCount / 30) * 30) % 60;\r\n if (toMinsCount > 30) {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(hoursIndex.toString() + '30');\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n } else {\r\n if (mins == 30) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(hoursIndex.toString() + '30')\r\n }\r\n }\r\n\r\n dateObj.workingSlots = (dateObj && dateObj.workingSlots) ? dateObj.workingSlots.concat(hours): [];\r\n\r\n workDays[arrayIndex] = dateObj;\r\n this.setState({ workDays: workDays });\r\n }\r\n\r\n });\r\n\r\n }\r\n\r\n fillSuggestedTimeSlots = (workDays) => {\r\n let slots = this.props.suggestedTimeSlots;\r\n slots.forEach(element => {\r\n let daysCount = this.daysCountBetween(element.from, element.to)\r\n if (daysCount == 0) {\r\n let dateObj = this.state.workDays.find(a => a.localDateString == element.from.toLocaleDateString())\r\n let fromHoursCount = element.from.getHours();\r\n let fromMinsCount = element.from.getMinutes();\r\n let toHoursCount = (element.to.getHours() == 0) ? 24 : element.to.getHours();\r\n let toMinsCount = element.to.getMinutes();\r\n let hours = []\r\n for (let index = fromHoursCount; index <= toHoursCount; index++) {\r\n if (index == fromHoursCount) {\r\n let mins = (Math.round(fromMinsCount / 30) * 30) % 60;\r\n if (fromMinsCount > 30) {\r\n if (mins == 30) {\r\n hours.push((index).toString() + 30);\r\n }\r\n } else {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((index).toString() + 30);\r\n } else {\r\n hours.push((index).toString() + 30);\r\n }\r\n }\r\n } else if (index == toHoursCount) {\r\n let mins = (Math.round(toMinsCount / 30) * 30) % 60;\r\n if (toMinsCount > 30) {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30');\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n } else {\r\n if (mins == 30) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30')\r\n }\r\n }\r\n dateObj.sugesstedSlots = dateObj.sugesstedSlots.concat(hours);\r\n } else {\r\n for (let i = 0; i <= daysCount; i++) {\r\n let from = new Date(element.from);\r\n let tomorrow = from;\r\n tomorrow.setDate(tomorrow.getDate() + i);\r\n let fromObj = new Date(tomorrow);\r\n let fromHoursCount = element.from.getHours();\r\n let fromMinsCount = element.from.getMinutes();\r\n let toHoursCount = (element.to.getHours() == 0) ? 24 : element.to.getHours();\r\n let toMinsCount = element.to.getMinutes();\r\n let dateObj = this.state.workDays.find(a => a.localDateString == fromObj.toLocaleDateString());\r\n let hours = []\r\n if (daysCount == i) {\r\n fromHoursCount = 8;\r\n } else {\r\n toHoursCount = 17;\r\n }\r\n for (let index = fromHoursCount; index <= toHoursCount; index++) {\r\n if (index == fromHoursCount) {\r\n let mins = (Math.round(fromMinsCount / 30) * 30) % 60;\r\n if (fromMinsCount > 30) {\r\n if (mins == 30) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((index).toString() + 30);\r\n }\r\n } else {\r\n if (fromHoursCount == 8) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n if (!(toMinsCount < 30) || toHoursCount == 17) {\r\n hours.push((index).toString() + 30);\r\n }\r\n if (fromHoursCount + 1 == toHoursCount) {\r\n hours.push((index).toString() + 30);\r\n }\r\n }\r\n } else if (index == toHoursCount) {\r\n let mins = (Math.round(toMinsCount / 30) * 30) % 60;\r\n if (toMinsCount > 30) {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30');\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30')\r\n }\r\n }\r\n dateObj.sugesstedSlots = dateObj.sugesstedSlots.concat(hours);\r\n }\r\n }\r\n })\r\n }\r\n\r\n updateSuggestedTimeSlots = () => {\r\n let workDays = this.state.workDays;\r\n if (this.props.suggestedTimeSlots.length > 0) {\r\n let suggesSlots = this.props.suggestedTimeSlots;\r\n suggesSlots.forEach(element => {\r\n if (!element.isDeletedEvent) {\r\n let daysCount = this.daysCountBetween(element.from, element.to)\r\n if (daysCount == 0) {\r\n let arrayIndex = workDays.findIndex(a => a.localDateString == element.from.toLocaleDateString())\r\n let dateObj = workDays[arrayIndex];\r\n let fromHoursCount = element.from.getHours();\r\n let fromMinsCount = element.from.getMinutes();\r\n let toHoursCount = (element.to.getHours() == 0) ? 24 : element.to.getHours();\r\n let toMinsCount = element.to.getMinutes();\r\n let hours = []\r\n for (let index = fromHoursCount; index <= toHoursCount; index++) {\r\n if (index == fromHoursCount) {\r\n let mins = (Math.round(fromMinsCount / 30) * 30) % 60;\r\n if (fromMinsCount > 30) {\r\n if (mins == 30) {\r\n hours.push((index).toString() + 30);\r\n }\r\n } else {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((index).toString() + 30);\r\n } else {\r\n hours.push((index).toString() + 30);\r\n }\r\n }\r\n } else if (index == toHoursCount) {\r\n let mins = (Math.round(toMinsCount / 30) * 30) % 60;\r\n if (toMinsCount > 30) {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30');\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n } else {\r\n if (mins == 30) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30')\r\n }\r\n }\r\n dateObj.sugesstedSlots = dateObj.sugesstedSlots.concat(hours);\r\n workDays[arrayIndex] = dateObj;\r\n this.setState({ workDays: workDays });\r\n } else {\r\n for (let i = 0; i <= daysCount; i++) {\r\n let from = new Date(element.from);\r\n let tomorrow = from;\r\n tomorrow.setDate(tomorrow.getDate() + i);\r\n let fromObj = new Date(tomorrow);\r\n let fromHoursCount = element.from.getHours();\r\n let fromMinsCount = element.from.getMinutes();\r\n let toHoursCount = (element.to.getHours() == 0) ? 24 : element.to.getHours();\r\n let toMinsCount = element.to.getMinutes();\r\n let arrayIndex = this.state.workDays.findIndex(a => a.localDateString == fromObj.toLocaleDateString())\r\n let dateObj = this.state.workDays[arrayIndex];\r\n let hours = []\r\n if (daysCount == i) {\r\n fromHoursCount = 8;\r\n } else {\r\n toHoursCount = 17;\r\n }\r\n for (let index = fromHoursCount; index <= toHoursCount; index++) {\r\n if (index == fromHoursCount) {\r\n let mins = (Math.round(fromMinsCount / 30) * 30) % 60;\r\n if (fromMinsCount > 30) {\r\n if (mins == 30) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((index).toString() + 30);\r\n }\r\n } else {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((index).toString() + 30);\r\n } else {\r\n if (fromHoursCount == 8) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n if (!(toMinsCount < 30) || toHoursCount == 17) {\r\n hours.push((index).toString() + 30);\r\n }\r\n if (fromHoursCount + 1 == toHoursCount) {\r\n hours.push((index).toString() + 30);\r\n }\r\n }\r\n }\r\n } else if (index == toHoursCount) {\r\n let mins = (Math.round(toMinsCount / 30) * 30) % 60;\r\n if (toMinsCount > 30) {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30');\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30')\r\n }\r\n }\r\n dateObj.sugesstedSlots = dateObj.sugesstedSlots.concat(hours);\r\n workDays[arrayIndex] = dateObj;\r\n this.setState({ workDays: workDays });\r\n }\r\n }\r\n }\r\n })\r\n }\r\n }\r\n\r\n fillNotAvailableTimeSlots = (workDays) => {\r\n this.props.notAvailableTimeSlots.forEach(element => {\r\n let daysCount = this.daysCountBetween(element.from, element.to)\r\n if (daysCount == 0) {\r\n let dateObj = this.state.workDays.find(a => a.localDateString == element.from.toLocaleDateString())\r\n let fromHoursCount = element.from.getHours();\r\n let fromMinsCount = element.from.getMinutes();\r\n let toHoursCount = (element.to.getHours() == 0) ? 24 : element.to.getHours();\r\n let toMinsCount = element.to.getMinutes();\r\n let hours = []\r\n for (let index = fromHoursCount; index <= toHoursCount; index++) {\r\n if (index == fromHoursCount) {\r\n let mins = (Math.round(fromMinsCount / 30) * 30) % 60;\r\n if (fromMinsCount > 30) {\r\n if (mins == 30) {\r\n hours.push((index).toString() + 30);\r\n }\r\n } else {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((index).toString() + 30);\r\n } else {\r\n hours.push((index).toString() + 30);\r\n }\r\n }\r\n } else if (index == toHoursCount) {\r\n let mins = (Math.round(toMinsCount / 30) * 30) % 60;\r\n if (toMinsCount > 30) {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30');\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n } else {\r\n if (mins == 30) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30')\r\n }\r\n }\r\n dateObj.notAvilableSlots = dateObj.notAvilableSlots.concat(hours);\r\n } else {\r\n for (let i = 0; i <= daysCount; i++) {\r\n let from = new Date(element.from);\r\n let tomorrow = from;\r\n tomorrow.setDate(tomorrow.getDate() + i);\r\n let fromObj = new Date(tomorrow);\r\n let fromHoursCount = element.from.getHours();\r\n let fromMinsCount = element.from.getMinutes();\r\n let toHoursCount = (element.to.getHours() == 0) ? 24 : element.to.getHours();\r\n let toMinsCount = element.to.getMinutes();\r\n let dateObj = this.state.workDays.find(a => a.localDateString == fromObj.toLocaleDateString());\r\n let hours = []\r\n if (daysCount == i) {\r\n fromHoursCount = 8;\r\n } else if (i > 0 && i != daysCount) {\r\n fromHoursCount = 8;\r\n toHoursCount = 17;\r\n } else {\r\n toHoursCount = 17;\r\n }\r\n for (let index = fromHoursCount; index <= toHoursCount; index++) {\r\n if (index == fromHoursCount) {\r\n let mins = (Math.round(fromMinsCount / 30) * 30) % 60;\r\n if (fromMinsCount > 30) {\r\n if (mins == 30) {\r\n hours.push((index).toString() + 30);\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((index).toString() + 30);\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((index).toString() + 30);\r\n }\r\n } else if (index == toHoursCount) {\r\n let mins = (Math.round(toMinsCount / 30) * 30) % 60;\r\n if (toMinsCount > 30) {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30');\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n } else {\r\n if (mins == 30 || toHoursCount == 17) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30')\r\n }\r\n }\r\n dateObj.notAvilableSlots = dateObj.notAvilableSlots.concat(hours);\r\n }\r\n }\r\n })\r\n }\r\n\r\n updateNotAvailableTimeSlots = () => {\r\n let workDays = this.state.workDays;\r\n if (this.props.notAvailableTimeSlots.length > 0) {\r\n this.props.notAvailableTimeSlots.forEach(element => {\r\n let daysCount = this.daysCountBetween(element.from, element.to)\r\n if (daysCount == 0) {\r\n let arrayIndex = workDays.findIndex(a => a.localDateString == element.from.toLocaleDateString())\r\n let dateObj = workDays[arrayIndex];\r\n let fromHoursCount = element.from.getHours();\r\n let fromMinsCount = element.from.getMinutes();\r\n let toHoursCount = (element.to.getHours() == 0) ? 24 : element.to.getHours();\r\n let toMinsCount = element.to.getMinutes();\r\n let hours = []\r\n for (let index = fromHoursCount; index <= toHoursCount; index++) {\r\n if (index == fromHoursCount) {\r\n let mins = (Math.round(fromMinsCount / 30) * 30) % 60;\r\n if (fromMinsCount > 30) {\r\n if (mins == 30) {\r\n hours.push((index).toString() + 30);\r\n }\r\n } else {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((index).toString() + 30);\r\n } else {\r\n hours.push((index).toString() + 30);\r\n }\r\n }\r\n } else if (index == toHoursCount) {\r\n let mins = (Math.round(toMinsCount / 30) * 30) % 60;\r\n if (toMinsCount > 30) {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30');\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n } else {\r\n if (mins == 30) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30')\r\n }\r\n }\r\n if (dateObj !== undefined) {\r\n dateObj.notAvilableSlots = dateObj.notAvilableSlots.concat(hours);\r\n workDays[arrayIndex] = dateObj;\r\n this.setState({ workDays: workDays });\r\n }\r\n } else {\r\n for (let i = 0; i <= daysCount; i++) {\r\n let from = new Date(element.from);\r\n let tomorrow = from;\r\n tomorrow.setDate(tomorrow.getDate() + i);\r\n let fromObj = new Date(tomorrow);\r\n let fromHoursCount = element.from.getHours();\r\n let fromMinsCount = element.from.getMinutes();\r\n let toHoursCount = (element.to.getHours() == 0) ? 24 : element.to.getHours();\r\n let toMinsCount = element.to.getMinutes();\r\n let arrayIndex = this.state.workDays.findIndex(a => a.localDateString == fromObj.toLocaleDateString())\r\n let dateObj = this.state.workDays[arrayIndex];\r\n let hours = []\r\n if (daysCount == i) {\r\n fromHoursCount = 8;\r\n } else if (i > 0 && i != daysCount) {\r\n fromHoursCount = 8;\r\n toHoursCount = 17;\r\n } else {\r\n toHoursCount = 17;\r\n }\r\n for (let index = fromHoursCount; index <= toHoursCount; index++) {\r\n if (index == fromHoursCount) {\r\n let mins = (Math.round(fromMinsCount / 30) * 30) % 60;\r\n if (fromMinsCount > 30) {\r\n if (mins == 30) {\r\n hours.push((index).toString() + 30);\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((index).toString() + 30);\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push((index).toString() + 30);\r\n }\r\n } else if (index == toHoursCount) {\r\n let mins = (Math.round(toMinsCount / 30) * 30) % 60;\r\n if (toMinsCount > 30) {\r\n if (mins == 0) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30');\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n } else {\r\n if (mins == 30 || toHoursCount == 17) {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n }\r\n }\r\n } else {\r\n if (index == 23 || index == 13) {\r\n hours.push((index).toString() + '00');\r\n } else {\r\n hours.push((index).toString() + 0);\r\n }\r\n hours.push(index.toString() + '30')\r\n }\r\n }\r\n if (dateObj !== undefined) {\r\n dateObj.notAvilableSlots = dateObj.notAvilableSlots.concat(hours);\r\n workDays[arrayIndex] = dateObj;\r\n this.setState({ workDays: workDays });\r\n }\r\n\r\n }\r\n }\r\n })\r\n }\r\n }\r\n\r\n onCLickAddNewSuggestedTimeSlots = () => {\r\n let slots = this.props.suggestedTimeSlots;\r\n slots.push({ isUpdated: false, isSingle: false, from: new Date(), to: new Date() });\r\n this.props.updateState('suggestedTimeSlots', slots);\r\n }\r\n\r\n daysCountBetween = (date1, date2) => {\r\n let a = date1;\r\n let b = date2;\r\n const ONE_DAY = 1000 * 60 * 60 * 24;\r\n const differenceMs = Math.abs(a - b);\r\n return Math.round(differenceMs / ONE_DAY);\r\n }\r\n\r\n roundToThrityMins = (date) => {\r\n var now = date;\r\n var mins = now.getMinutes();\r\n var quarterHours = Math.round(mins / 30);\r\n if (quarterHours == 2) {\r\n now.setHours(now.getHours() + 1);\r\n }\r\n var rounded = (quarterHours * 30) % 60;\r\n now.setMinutes(rounded);\r\n return now;\r\n }\r\n\r\n onClickUpdateTimeSlot = (index) => {\r\n let slots = this.props.suggestedTimeSlots;\r\n let fromDate = (this.props.fromDate < slots[index].from) ? this.props.fromDate : slots[index].from\r\n let toDate = (this.props.toDate > slots[index].to) ? this.props.toDate : slots[index].to\r\n slots[index].isUpdated = true;\r\n //this.props.updateState('fromDate', fromDate);\r\n // this.props.updateState('toDate', toDate);\r\n\r\n let isValid = true;\r\n\r\n if (slots[index].from >= slots[index].to) {\r\n isValid = false;\r\n toast.error('End date should be greater than Start date.', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n return;\r\n }\r\n\r\n let rounded = {\r\n start: this.roundToThrityMins(new Date(slots[index].from)),\r\n end: this.roundToThrityMins(new Date(slots[index].to)),\r\n }\r\n let minsBetween = this.getMinutesBetweenDates(rounded.start, rounded.end);\r\n if (minsBetween < this.props.scheduledDuration) {\r\n isValid = false;\r\n toast.error('The suggested time slot(s) is not enough to complete the task', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n return;\r\n }\r\n\r\n let timeSlotKey = '';\r\n let time = new Date(rounded.start);\r\n let minuteSlots = minsBetween / 30;\r\n let newDate = new Date(rounded.start);\r\n \r\n let minutesToAdd = 0\r\n for (let index = 0; index < minuteSlots; index++) {\r\n minutesToAdd = index == 0 ? 0 : 30;\r\n time = new Date(new Date(time).setMinutes(new Date(time).getMinutes() + minutesToAdd));\r\n timeSlotKey = time.getHours().toString() + time.getMinutes().toString();\r\n if (timeSlotKey == '1730') {\r\n var d = newDate;\r\n d = new Date(d.setDate(d.getDate() + 1));\r\n time = new Date(new Date(d.setHours(8)).setMinutes(0));\r\n timeSlotKey = time.getHours().toString() + time.getMinutes().toString();\r\n }\r\n let element = document.querySelector(`[time-slot='${time.toLocaleDateString() + '-' + timeSlotKey}']`);\r\n\r\n if (element == null || element == undefined) {\r\n isValid = isValid && false;\r\n } else {\r\n isValid = isValid && true;\r\n }\r\n }\r\n\r\n if (isValid) {\r\n this.props.updateState('suggestedTimeSlots', slots);\r\n\r\n this.onPrepareGrid(fromDate, toDate);\r\n\r\n setTimeout(() => {\r\n this.updateNotAvailableTimeSlots();\r\n this.updateAvailableTimeSlots();\r\n this.updateSuggestedTimeSlots();\r\n this.updateWorkingTimeSlots();\r\n }, 500);\r\n } else {\r\n toast.error('Please select a valid time slot.', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n }\r\n }\r\n\r\n onClickDeleteTimeSlot = (index) => {\r\n this.props.suggestedTimeSlots.forEach((element, i) => {\r\n if (i === index) {\r\n element.isDeletedEvent = true;\r\n }\r\n });\r\n let suggestedTimeSlots = this.props.suggestedTimeSlots.filter((element, i) => i != index); // AN-24965\r\n\r\n this.onPrepareGrid(this.props.fromDate, this.props.toDate);\r\n setTimeout(() => {\r\n this.updateNotAvailableTimeSlots();\r\n this.updateAvailableTimeSlots();\r\n this.updateSuggestedTimeSlots();\r\n this.updateWorkingTimeSlots();\r\n }, 500);\r\n }\r\n\r\n disableFromDates = (currentDate, selectedDate, index) => {\r\n var d = new Date();\r\n d.setDate(d.getDate() - 1);\r\n return true; //currentDate > new Date(d);\r\n }\r\n\r\n disableToDates = (currentDate, selectedDate, index) => {\r\n let slot = this.props.suggestedTimeSlots[index];\r\n var d = slot.from\r\n d.setDate(d.getDate() - 1);\r\n return currentDate > new Date(d);\r\n }\r\n\r\n onClickAvailableSlot = (workDay, slot) => {\r\n let startDate = new Date(workDay.localDateString);\r\n startDate = new Date(startDate.setHours(slot.hours));\r\n startDate = new Date(startDate.setMinutes(slot.minutes));\r\n let startTime = new Date(startDate);\r\n let endTime = new Date(new Date(startDate).setMinutes(new Date(startDate).getMinutes() + this.props.scheduledDuration));\r\n if (endTime > new Date(new Date(new Date(startDate).setHours(17)).setMinutes(0))) {\r\n let minutesDiff = this.getMinutesBetweenDates(new Date(new Date(new Date(startDate).setHours(17)).setMinutes(0)), endTime) - 31;\r\n var d = new Date(workDay.localDateString);\r\n d = new Date(d.setDate(d.getDate() + 1));\r\n endTime = new Date(new Date(d.setHours(8)).setMinutes(minutesDiff));\r\n }\r\n let suggestedTimeSlots = [];\r\n let timeSlotKey = slot.hours.toString() + slot.minutes.toString();\r\n let time = workDay.date;\r\n time = new Date(new Date(workDay.date.setHours(slot.hours)).setMinutes(slot.minutes))\r\n let minuteSlots = this.props.scheduledDuration / 30;\r\n let newDate = workDay;\r\n let isValid = true;\r\n let minutesToAdd = 0\r\n for (let index = 0; index < minuteSlots; index++) {\r\n minutesToAdd = index == 0 ? 0 : 30;\r\n time = new Date(new Date(time).setMinutes(new Date(time).getMinutes() + minutesToAdd));\r\n timeSlotKey = time.getHours().toString() + time.getMinutes().toString();\r\n if (timeSlotKey == '1730') {\r\n var d = newDate.date;\r\n d = new Date(d.setDate(d.getDate() + 1));\r\n time = new Date(new Date(d.setHours(8)).setMinutes(0));\r\n timeSlotKey = time.getHours().toString() + time.getMinutes().toString();\r\n }\r\n let element = document.querySelector(`[time-slot='${time.toLocaleDateString() + '-' + timeSlotKey}']`);\r\n\r\n if (element == null || element == undefined) {\r\n isValid = isValid && false;\r\n } else {\r\n isValid = isValid && true;\r\n }\r\n }\r\n\r\n if (isValid) {\r\n suggestedTimeSlots.push({\r\n from: startTime,\r\n to: endTime,\r\n isUpdated: true,\r\n isSingle: true\r\n });\r\n\r\n this.props.updateState('suggestedTimeSlots', suggestedTimeSlots);\r\n\r\n this.onPrepareGrid(this.props.fromDate, this.props.toDate);\r\n setTimeout(() => {\r\n this.updateNotAvailableTimeSlots();\r\n this.updateAvailableTimeSlots();\r\n this.updateSuggestedTimeSlots();\r\n this.updateWorkingTimeSlots();\r\n }, 500);\r\n } else {\r\n toast.error('Please select a valid time slot.', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n }\r\n }\r\n\r\n getMinutesBetweenDates = (startDate, endDate) => {\r\n var diff = endDate.getTime() - startDate.getTime();\r\n return (diff / 60000);\r\n }\r\n\r\n renderTimeSlots = (workDay) => {\r\n {\r\n TIME_SLOTS.map((slot, index) => {\r\n return (\r\n \r\n {(workDay.sugesstedSlots.indexOf(slot.time.toString()) > -1) ?\r\n this.onClickAvailableSlot(workDay, slot)} time-slot={workDay.localDateString + '-' + slot.time}>\r\n
\r\n {(workDay.workingSlots.indexOf(slot.time.toString()) > -1) ?\r\n
\r\n :
}\r\n
this.onClickAvailableSlot(workDay, slot)} time-slot={workDay.localDateString + '-' + slot.time}>\r\n
\r\n {(workDay.workingSlots.indexOf(slot.time.toString()) > -1) ?\r\n
\r\n :
}\r\n
\r\n
\r\n {(workDay.workingSlots.indexOf(slot.time.toString()) > -1) ?\r\n
\r\n :
}\r\n
\r\n )\r\n })\r\n }\r\n }\r\n\r\n onChangeStartTime = (date, index) => {\r\n let slots = this.props.suggestedTimeSlots;\r\n let element = slots[index];\r\n let startDate = new Date(element.from);\r\n let startTime = new Date(date);\r\n element.from = new Date(new Date(startDate.setHours(startTime.getHours())).setMinutes(startTime.getMinutes()));\r\n element.isUpdated = false;\r\n element.isSingle = false;\r\n slots[index] = element;\r\n this.props.updateState('suggestedTimeSlots', slots);\r\n }\r\n\r\n onChangeStartDate = (date, index) => {\r\n let slots = this.props.suggestedTimeSlots;\r\n let element = slots[index];\r\n element.from = new Date(date);\r\n element.isUpdated = false;\r\n element.isSingle = false;\r\n slots[index] = element;\r\n this.props.updateState('suggestedTimeSlots', slots);\r\n };\r\n\r\n onChangeEndTime = (date, index) => {\r\n let slots = this.props.suggestedTimeSlots;\r\n let element = slots[index];\r\n let endDate = new Date(element.to);\r\n let endTime = new Date(date);\r\n element.to = new Date(new Date(endDate.setHours(endTime.getHours())).setMinutes(endTime.getMinutes()));\r\n element.isUpdated = false;\r\n element.isSingle = false;\r\n slots[index] = element;\r\n this.props.updateState('suggestedTimeSlots', slots);\r\n }\r\n\r\n onChangeEndDate = (date, index) => {\r\n let slots = this.props.suggestedTimeSlots;\r\n let element = slots[index];\r\n element.to = new Date(date);\r\n element.isUpdated = false;\r\n element.isSingle = false;\r\n slots[index] = element;\r\n this.props.updateState('suggestedTimeSlots', slots);\r\n }\r\n\r\n convertJobTimesToHoursAndMinutes() {\r\n var totalJobTimeInMinutes = this.props.bidDetails.estimatedHours;\r\n if (this.props.travelTimeDuration > 0) {\r\n totalJobTimeInMinutes = parseInt(this.props.bidDetails.estimatedHours + this.props.travelTimeDuration);\r\n }\r\n const totalJobTimeHoursPortion = Math.floor(totalJobTimeInMinutes / 60);\r\n const totalJobTimeMinutesPortion = totalJobTimeInMinutes % 60;\r\n\r\n const estimatedJobTimeHoursPortion = Math.floor(this.props.bidDetails.estimatedHours / 60);\r\n const estimatedJobTimeMinutesPortion = this.props.bidDetails.estimatedHours % 60;\r\n\r\n this.setState({\r\n totalJobTimeHoursPortion: totalJobTimeHoursPortion,\r\n totalJobTimeMinutesPortion: totalJobTimeMinutesPortion,\r\n estimatedJobTimeHoursPortion: estimatedJobTimeHoursPortion,\r\n estimatedJobTimeMinutesPortion: estimatedJobTimeMinutesPortion\r\n });\r\n\r\n if (this.props.travelTimeDuration > 0) {\r\n const travelTimeHoursPortion = Math.floor(this.props.travelTimeDuration / 60);\r\n const travelTimeMinutesPortion = this.props.travelTimeDuration % 60;\r\n this.setState({\r\n travelTimeHoursPortion: travelTimeHoursPortion,\r\n travelTimeMinutesPortion: travelTimeMinutesPortion\r\n });\r\n }\r\n }\r\n\r\n render() {\r\n const { workDays } = this.state;\r\n const { fromDate, toDate } = this.props;\r\n const shortcuts = {\r\n 'Today': moment()\r\n };\r\n return (\r\n <>\r\n \r\n
\r\n
\r\n
Suggested optional day(s) and time \r\n
\r\n
\r\n
*Avg job time ({this.state.totalJobTimeHoursPortion} hrs {this.state.totalJobTimeMinutesPortion} min ) =\r\n job estimation ({this.state.estimatedJobTimeHoursPortion} hrs {this.state.estimatedJobTimeMinutesPortion} min ) +\r\n travel time ({this.state.travelTimeHoursPortion} hrs {this.state.travelTimeMinutesPortion} min )
\r\n
\r\n
\r\n Add {\" \"}\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
Working Slot \r\n \r\n
\r\n
\r\n
\r\n
Available Slot \r\n \r\n
\r\n
\r\n
\r\n
Blocked Slot \r\n \r\n
\r\n
\r\n
\r\n
Suggested Slot \r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n {MONTHS[fromDate.getMonth()].shortName + ' ' + fromDate.getDate() + ' - ' + MONTHS[toDate.getMonth()].shortName + ' ' + toDate.getDate() + ', ' + toDate.getFullYear()}\r\n
\r\n {workDays.map((day, index) => {\r\n return (\r\n
\r\n
\r\n {day.date.toDateString()} \r\n
\r\n
\r\n )\r\n })}\r\n
\r\n
\r\n
\r\n
\r\n {TIME_SLOTS.map((slot, index) => {\r\n return (\r\n
\r\n
{slot.displayText}
\r\n
\r\n )\r\n })}\r\n
\r\n
\r\n {workDays.map((workDay, index) => {\r\n return (\r\n
\r\n
\r\n {/*{this.renderTimeSlots(workDay)}*/}\r\n {TIME_SLOTS.map((slot, index2) => {\r\n return (\r\n
\r\n {(workDay.sugesstedSlots.indexOf(slot.time.toString()) > -1) ?\r\n this.onClickAvailableSlot(workDay, slot)} time-slot={workDay.localDateString + '-' + slot.time}>\r\n
\r\n {(workDay.workingSlots.indexOf(slot.time.toString()) > -1) ?\r\n\r\n
\r\n :
}\r\n
this.onClickAvailableSlot(workDay, slot)} time-slot={workDay.localDateString + '-' + slot.time}>\r\n
\r\n {(workDay.workingSlots.indexOf(slot.time.toString()) > -1) ?\r\n\r\n
\r\n :
}\r\n
\r\n
\r\n {(workDay.workingSlots.indexOf(slot.time.toString()) > -1) ?\r\n\r\n
\r\n :
}\r\n
\r\n )\r\n })}\r\n
\r\n
\r\n )\r\n })}\r\n
\r\n
\r\n
\r\n
\r\n
\r\n Calendar \r\n \r\n {drawer}\r\n \r\n );\r\n }\r\n\r\n createDrawer = () => {\r\n const header = this.createHeader();\r\n const body = this.createBody();\r\n const footer = this.createFooter();\r\n\r\n return (\r\n \r\n );\r\n };\r\n\r\n createHeader = () => {\r\n const { isDetailsLoading } = this.state;\r\n return (\r\n <>\r\n Event Scheduler \r\n {(isDetailsLoading) ? \r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n createBody = () => {\r\n return (\r\n \r\n (this.scheduler = ref)}\r\n availableTimeSlots={this.state.availableTimeSlots}\r\n notAvailableTimeSlots={this.state.notAvailableTimeSlots}\r\n suggestedTimeSlots={this.state.suggestedTimeSlots}\r\n workingSlots={this.state.workingSlots}\r\n fromDate={this.state.fromDate}\r\n toDate={this.state.toDate}\r\n scheduledDuration={this.state.scheduledDuration}\r\n bidDetails={this.props.jobDetails.acceptedBid}\r\n travelTimeDuration={this.state.travelTimeDuration}\r\n updateState={(name, event) => this.updateState(name, event)} />\r\n
\r\n );\r\n };\r\n\r\n createFooter = () => {\r\n const { isUpdating } = this.state;\r\n return (\r\n <>\r\n \r\n this.onUpdateSchedule(event)}>\r\n {(isUpdating) ? \r\n
\r\n \r\n );\r\n };\r\n\r\n\r\n}\r\n","import React from 'react';\r\nimport {CardElement,injectStripe} from 'react-stripe-elements';\r\nimport settingsService from '../../../../Services/settingsService';\r\nimport { toast } from \"react-toastify\";\r\nimport \"react-toastify/dist/ReactToastify.css\";\r\nimport Loader from \"react-loader-spinner\";\r\nclass CardSection extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this._element = React.createRef();\r\n }\r\n\r\n state={\r\n error:'',\r\n card:'',\r\n elements:'',\r\n loading:false\r\n }\r\n\r\n render() {\r\n \r\n return (\r\n \r\n \r\n
\r\n );\r\n }\r\n\r\n handleChangeFor = (error) => { \r\n if(error.error){\r\n this.setState({error:error.error.message});\r\n }else{\r\n this.setState({error:''})\r\n }\r\n }\r\n\r\n handleSubmit = (ev) => {\r\n ev.preventDefault();\r\n this.props.stripe.createToken().then((token) => {\r\n if(token && token.token){\r\n this.addCardDetails(token.token.id);\r\n }\r\n });\r\n };\r\n\r\n addCardDetails=(token)=>{\r\n var model={\r\n 'userId':localStorage.getItem('userId'),\r\n 'cardToken':token\r\n }\r\n this.setState({loading:true});\r\n settingsService.addCardDetails(model)\r\n .then((res) => {\r\n this._element.clear();\r\n this.setState({loading:false});\r\n if(res.status===18){\r\n toast.success(\"Card added Successful.\", {\r\n position: toast.POSITION.BOTTOM_RIGHT,\r\n });\r\n if (this.props.isFromTenantManageJob) {\r\n this.props.nextStep(0);\r\n }\r\n }else{\r\n toast.error(res.message, {\r\n position: toast.POSITION.BOTTOM_RIGHT,\r\n });\r\n }\r\n this.props.refresh();\r\n });\r\n }\r\n}\r\n\r\nexport default injectStripe(CardSection);","import React from \"react\";\r\nimport Loader from \"react-loader-spinner\";\r\nimport { Badge } from \"react-bootstrap\";\r\nimport Moment from \"react-moment\";\r\nimport { toast } from \"react-toastify\";\r\nimport \"react-toastify/dist/ReactToastify.css\";\r\nimport settingsService from \"../../../../Services/settingsService\";\r\nimport { StripeProvider, Elements, ReactStrpeElements } from 'react-stripe-elements';\r\nimport CardSection from \"./CardSection\"\r\nclass Payment extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n }\r\n\r\n state = {\r\n cardDetails: [],\r\n stripe: null,\r\n loading: false\r\n };\r\n\r\n componentDidMount() {\r\n this.getCardDetailsByUserId(this.props.userId);\r\n if (window.Stripe) {\r\n this.setState({ stripe: window.Stripe(localStorage.getItem('spk')) });\r\n\r\n } else {\r\n document.querySelector('#stripe-js').addEventListener('load', () => {\r\n // Create Stripe instance once Stripe.js loads\r\n this.setState({ stripe: window.Stripe(localStorage.getItem('spk')) });\r\n });\r\n }\r\n }\r\n\r\n refresh = () => {\r\n this.getCardDetailsByUserId(this.props.userId);\r\n }\r\n getCardDetailsByUserId(userId) {\r\n settingsService\r\n .getCardDetailsByUserId(userId)\r\n .then((res) => {\r\n this.setState({\r\n cardDetails: res\r\n });\r\n if (this.props.isFromTenantManageJob) {\r\n this.props.checkCardAvailability();\r\n }\r\n });\r\n }\r\n\r\n\r\n render() {\r\n let { cardDetails } = this.state;\r\n let cardDetailsView = this.loadCardDetails(cardDetails);\r\n return (<>\r\n {cardDetailsView}\r\n \r\n )\r\n }\r\n\r\n addCardDetails = () => {\r\n return (\r\n \r\n \r\n this.refresh()} isFromTenantManageJob={this.props.isFromTenantManageJob}\r\n nextStep={this.props.nextStep} />\r\n \r\n \r\n );\r\n }\r\n\r\n loadCardDetails = (cardDetails) => {\r\n\r\n let defaultCard = (cardDetails) ? cardDetails.filter(m => m.isDefault === true) : null;\r\n let otherCards = (cardDetails) ? cardDetails.filter(m => m.isDefault === false) : null;\r\n return (\r\n \r\n
\r\n
Add new card \r\n \r\n
\r\n {this.addCardDetails()}\r\n
\r\n
\r\n {(defaultCard.length !== 0 || otherCards.length !== 0) ?
Card Details : \"\"}\r\n \r\n
\r\n
\r\n
\r\n {(defaultCard && defaultCard !== null) ?\r\n defaultCard.map((item) => (\r\n
\r\n
\r\n
\r\n
{item.brand}
\r\n
\r\n
\r\n Card number\r\n {item.cardMask} \r\n
\r\n
\r\n Exp.\r\n {item.exp_month}/{item.exp_year} \r\n
\r\n
\r\n
\r\n
\r\n
)) : \"\"}\r\n {(otherCards && otherCards !== null) ?\r\n\r\n otherCards.map((item) => (\r\n
\r\n
\r\n
\r\n
{item.brand}
\r\n
\r\n
\r\n Card number\r\n {item.cardMask} \r\n
\r\n
\r\n Exp.\r\n {item.exp_month} / {item.exp_year} \r\n
\r\n
\r\n
\r\n this.remove(item.id)}>\r\n Remove\r\n \r\n this.setDefault(item.id)}>\r\n Set Default\r\n \r\n
\r\n
\r\n
\r\n
\r\n ))\r\n : \"\"}\r\n
\r\n
\r\n
\r\n
\r\n\r\n
\r\n
{t('new_ui_pj_lbl_job_select')} \r\n \r\n\r\n
\r\n {(this.state.isJobsLoading) ?
:\r\n
\r\n { this.handleJobChange(value) }}>\r\n {scheduleJobs.map((a, index) => {\r\n return \r\n \r\n
#{a.jobNumber} | {this.timeAgo(a.postedOn)}
\r\n
\r\n {a.jobUrgencyId === 1 ? t('new_ui_pj_lbl_urgent') : \"\"} \r\n
\r\n
{a.title}
\r\n\r\n \r\n
\r\n
\r\n
\r\n
{a.statusDisplay}
\r\n
Updated: {this.timeAgo(a.lastUpdatedDateTime)}
\r\n
\r\n
\r\n
\r\n
\r\n })\r\n }\r\n \r\n \r\n }\r\n
\r\n\r\n
\r\n
\r\n\r\n {(!this.state.isJobsLoading) ?\r\n
\r\n this.nextStep(nextStepIndex)} style={this.state.primaryButtonStyle}>{t('new_ui_pj_btn_continue')} \r\n
\r\n : ''}\r\n\r\n
\r\n {step}\r\n
\r\n \r\n }\r\n\r\n nextStep = (index) => {\r\n if (this.validateCurrentStep(index - 1)) {\r\n this.setState({ currentStepIndex: index });\r\n }\r\n }\r\n\r\n validateCurrentStep = (index) => {\r\n const { t } = this.props;\r\n let currentStep = this.state.stepFlow[index][1];\r\n switch (currentStep) {\r\n case \"scheduledJobs\":\r\n if (Object.keys(this.state.currentJob).length === 0) {\r\n this.props.showChatbotError(t('new_ui_lbl_selectScheduledJob_error_msg'));\r\n return false;\r\n }\r\n else\r\n return true;\r\n case \"detailView\":\r\n return true;\r\n case \"NoJobFound\":\r\n return true;\r\n }\r\n }\r\n\r\n showCurrentStep = (index) => {\r\n let currentStep = this.state.stepFlow[index][1];\r\n switch (currentStep) {\r\n case \"scheduledJobs\":\r\n return this.scheduleJobs();\r\n case \"detailView\":\r\n return this.jobDetails();\r\n case \"NoJobFound\":\r\n return this.JobsNotFound();\r\n }\r\n }\r\n\r\n jobDetails = () => {\r\n const { t } = this.props;\r\n const { currentJob } = this.state;\r\n return (\r\n \r\n
\r\n
\r\n
\r\n
{t('new_ui_pj_lbl_job_details_header')} #{currentJob.jobNumber} \r\n \r\n
\r\n\r\n
{currentJob.description}
\r\n \r\n
\r\n
\r\n
\r\n
\r\n
{t('new_ui_pj_lbl_job_issue_posted')}
\r\n
{currentJob.postedOnUTCDisplay}
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
{t('new_ui_pj_lbl_job_trade_assigned')}
\r\n
{currentJob.acceptedServiceProviderName}({currentJob.primaryJobTypeDisplay})
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
{t('new_ui_pj_lbl_job_issue_completed')}
\r\n
{currentJob.dueDateUTCDisplay}
\r\n
\r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n
\r\n
\r\n
\r\n this.props.backToMainMenu()} style={this.state.primaryButtonStyle}>{t('new_ui_qna_lbl_back_to_main_chat')} \r\n
\r\n\r\n
\r\n
\r\n
\r\n\r\n
\r\n
\r\n {t('new_ui_pj_lbl_job_not_found')} \r\n
\r\n\r\n
\r\n\r\n
\r\n
\r\n
\r\n this.props.backToMainMenu()} style={this.state.primaryButtonStyle}>{t('new_ui_qna_lbl_back_to_main_chat')} \r\n
\r\n\r\n
\r\n {(pageNumber >2)?\r\n this.pageNavigetor(1)}><< \r\n :''}\r\n {(pageNumber >1)?\r\n this.pageNavigetor(pageNumber-1)}>< \r\n :''}\r\n {pageArray.map((val, index) => (\r\n \r\n this.pageNavigetor(val)}>{val} \r\n \r\n ))}\r\n {(total > pageSize && (pageCount-pageNumber)>0)?\r\n this.pageNavigetor(pageNumber+1)}>> \r\n :''}\r\n {(total > pageSize && (pageCount-pageNumber)>1)?\r\n this.pageNavigetor(pageCount)}>>> \r\n :''}\r\n \r\n }\r\n\r\n getPageArray=(count,pageNumber,size)=>{\r\n\r\n if(count<=5 && count>0){\r\n return Array.from({length: count}, (_, i) => i + 1);\r\n }else if(count>0 && pageNumber>3 && (count-pageNumber)>2){\r\n return Array.from({length: size}, (_, i) => (pageNumber-3)+i);\r\n }else if(count>0 && (count-pageNumber)<=2){\r\n return Array.from({length: size}, (_, i) => (count-3)+i);\r\n }else if(count>0){\r\n return Array.from({length: size}, (_, i) => i+1);\r\n }else{\r\n return [];\r\n }\r\n }\r\n\r\n pageNavigetor=(pageNumber)=>{\r\n this.setState({page:pageNumber}, function() {\r\n this.updateList();\r\n }); \r\n }\r\n\r\n updateList=()=>{\r\n this.props.updateJobList(true,this.state.page);\r\n }\r\n\r\n}\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n return {\r\n pageNumber : this.state.page\r\n };\r\n};\r\n\r\nexport default connect(mapStateToProps)(Paginator);","import React, { useState } from \"react\";\r\nimport Drawer from \"../../Common/Drawer/Drawer\";\r\nimport { connect } from \"react-redux\";\r\nimport { AXIOS } from \"../../../Utilities/HttpRequest/Axios\";\r\nimport { toast } from \"react-toastify\";\r\nimport jobService from \"../../../Services/JobService\";\r\nimport { trackPromise } from \"react-promise-tracker\";\r\nimport { UserType } from \"../../../Constants/Enums\";\r\n\r\nclass JobCancelDrawer extends React.Component {\r\n state = {\r\n showJobCancelDrawer: false\r\n };\r\n constructor(props) {\r\n super(props);\r\n }\r\n\r\n render() {\r\n let drawer = this.createDrawer();\r\n\r\n return (\r\n <>\r\n \r\n Cancel \r\n \r\n {drawer}\r\n \r\n );\r\n }\r\n\r\n createDrawer = () => {\r\n const header = this.createJobCancelHeader();\r\n const body = this.createJobCancelBody();\r\n const footer = this.createJobCancelFooter();\r\n\r\n return (\r\n \r\n );\r\n };\r\n\r\n createJobCancelHeader = () => {\r\n return (\r\n <>\r\n Cancel Job \r\n \r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n createJobCancelBody = () => {\r\n return (\r\n \r\n
\r\n
\r\n
\r\n Are you sure you want to cancel the job? \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n {\" \"}\r\n Mark as Completed\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n {\" \"}\r\n No{\" \"}\r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n onClickJobCancel = () => {\r\n trackPromise(\r\n jobService.CancelJob(this.props.jobDetails.id).then(response => {\r\n if(response) {\r\n toast.success(\"Job has been cancelled.\",{\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n this.toggleJobCancelDrawer();\r\n this.props.toggleDrawer(true);\r\n } else {\r\n toast.error(\"Error occured. Please try again.\",{\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n }\r\n }).catch(error => {\r\n toast.error(\"Error occured. Please try again.\",{\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n })\r\n )\r\n };\r\n\r\n toggleJobCancelDrawer = () => {\r\n if (this.isAwarded() || (this.props.jobDetails.tradees.length > 0 && !this.isDraftedJob())) {\r\n\r\n const tradeOption = this.props.jobDetails.targetedTradeeOption === 2\r\n ? \"awarded\"\r\n : \"sent for quotes\";\r\n\r\n const message = localStorage.getItem(\"userType\") == UserType.Tenant\r\n ? \"please contact your property manager to cancel the job.\"\r\n : \"hence it cannot be canceled.\";\r\n\r\n toast.info(`The job has been ${tradeOption}, ${message}`, {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n }\r\n else {\r\n this.setState(state => ({\r\n showJobCancelDrawer: !this.state.showJobCancelDrawer\r\n }));\r\n }\r\n };\r\n\r\n isAwarded() {\r\n return this.props.jobDetails.workflowStatusId == 4;\r\n }\r\n\r\n isDraftedJob() {\r\n return this.props.jobDetails.workflowStatusId == 1;\r\n }\r\n}\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n return {\r\n isRefresh: state.MyJobs.isRefreshGrid\r\n };\r\n};\r\n\r\nconst mapDispatchToProps = dispatch => {\r\n return {\r\n refreshGrid: isRefresh => {\r\n dispatch({ type: \"REFRESH_GRID\", isRefresh: isRefresh });\r\n }\r\n };\r\n};\r\n\r\nexport default connect(\r\n mapStateToProps,\r\n mapDispatchToProps\r\n)(JobCancelDrawer);\r\n","import axios from \"axios\";\r\nimport { AppConfiguration } from \"read-appsettings-json\";\r\n\r\nconst apiendpoint = AppConfiguration.Setting().Translate_API;\r\nconst allowDynamicTranslate = AppConfiguration.Setting().AllowDynamicTranslate;\r\n\r\nconst translate = (requestModel) => {\r\n delete axios.defaults.headers.get[\"ClientSecret\"];\r\n delete axios.defaults.headers.post[\"ClientSecret\"];\r\n\r\n const promise = new Promise((resolve, reject) => {\r\n if (requestModel.targetCode != requestModel.sourceCode && allowDynamicTranslate) {\r\n return axios.post(apiendpoint, requestModel, null).then((res) => {\r\n resolve(res.data);\r\n });\r\n } else resolve([]);\r\n });\r\n return promise;\r\n};\r\n\r\nconst translateService = {\r\n translate,\r\n};\r\n\r\nexport default translateService;\r\n","import React, { useState } from \"react\";\r\n\r\n// Plugins\r\nimport { toast } from \"react-toastify\";\r\nimport { registerPlugin, FilePond } from \"react-filepond\";\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\nimport { withTranslation, Trans } from 'react-i18next';\r\n\r\n// Components\r\nimport Drawer from \"../../Common/Drawer/Drawer\";\r\n\r\n// Styles\r\nimport \"./AttachmentsDrawer.scss\";\r\n\r\nregisterPlugin(FilePondPluginImageExifOrientation, FilePondPluginImagePreview);\r\nclass AttachmentsDrawer extends React.Component {\r\n state = {\r\n attachments: [],\r\n showAttachmentsDrawer: false,\r\n isFromBot:this.props.isFromBot?true:false,\r\n isFromAsset:this.props.isFromAsset?true:false,\r\n };\r\n\r\n constructor(props) {\r\n super(props);\r\n }\r\n\r\n render() {\r\n let drawer = this.createDrawer();\r\n return <>{drawer};\r\n }\r\n\r\n createDrawer = () => {\r\n let header = this.createHeader();\r\n let body = this.createBody();\r\n let footer = this.createFooter();\r\n const { t , isFromBot , isFromVariation} = this.props;\r\n return (\r\n <>\r\n {(this.props.isJobPosted) ? Upload Attachments : <>\r\n \r\n
\r\n \r\n
\r\n \r\n
{isFromBot ? t('btn_addimages_videos') : isFromVariation ? 'Upload images/ videos' : 'Upload Attachments'} \r\n {isFromVariation ?\r\n <> :
\r\n
\r\n }
\r\n \r\n );\r\n };\r\n\r\n createHeader = () => {\r\n const { t, isFromBot } = this.props;\r\n return (\r\n <>\r\n \r\n {/* {this.props.title} */}\r\n {isFromBot ? t('hdr_attachment_drawer') : 'Add Attachments'}\r\n \r\n \r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n createBody = () => {\r\n const files = this.getUploadedImages();\r\n const { t, isFromBot, isFromAsset} = this.props;\r\n return (\r\n \r\n
\r\n
\r\n {(!isFromAsset)? \r\n Please upload some {{ name: t('lbl_attachment_drawer_highlited') }} to\r\n provide further information for service providers to more accurately\r\n quote.\r\n :\r\n 'Please upload some Pictures, Documents to provide further information for property managers to more accurately review'}\r\n \r\n
\r\n
\r\n \r\n
{isFromBot ? t('btn_addimages_videos') : 'Add images/ videos'} \r\n
\r\n
\r\n
\r\n
\r\n Add Attachments(s) \r\n \r\n (.jpg,.jpeg,.png,.png,.mp4,.csv,.pdf)\r\n \r\n \r\n
(this.pond = ref)}\r\n name={\"filepond--browser\"}\r\n type={\"remote\"}\r\n files={this.state.attachments}\r\n allowMultiple={true}\r\n server={{\r\n process: (\r\n fieldName,\r\n file,\r\n metadata,\r\n load,\r\n error,\r\n progress,\r\n abort,\r\n transfer,\r\n options\r\n ) => {\r\n\r\n if (file.name.includes('.msg') || file.name.includes('.eml') || file.type === 'message/rfc822' || file.name.includes('.mp3')) {\r\n toast.error('Please Select valid types of file.', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n abort();\r\n return;\r\n }\r\n\r\n if (isFromAsset && (file.name.includes('.mp4') || file.name.includes('.mov') || file.name.includes('.csv') || file.name.includes('.mp3'))) {\r\n toast.error('Please Select valid types of file.', {\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n abort();\r\n return;\r\n }\r\n const formData = new FormData();\r\n formData.append(\"file\", file);\r\n const request = new XMLHttpRequest();\r\n const attComponent = this;\r\n if(this.props.isFromVariation){\r\n request.open(\r\n \"POST\",\r\n `/tenant-api/file-upload?id=${\r\n this.props.jobDetails.id\r\n }&persist=false&userId=${localStorage.getItem(\"userId\")}`\r\n );\r\n }\r\n else if(this.props.isExternal){\r\n request.open(\r\n \"POST\",\r\n `/tenant-api/file-upload?id=${\r\n this.props.jobDetails.id\r\n }&persist=${!this.props\r\n .isJobPost}&attachmentType=${this.props.isJobPost ? 3 : 0}&userId=${this.props.jobDetails.serviceConsumerId}`);\r\n }\r\n else if(this.props.isFromAsset){\r\n request.open(\r\n \"POST\",\r\n `/tenant-api/file-upload?id=${\r\n this.props.assetId\r\n }&persist=${false}&attachmentType=0&userId=${this.props.assetSubmittedUserId}`);\r\n }\r\n else{\r\n request.open(\r\n \"POST\",\r\n `/tenant-api/file-upload?id=${\r\n this.props.jobDetails.id\r\n }&persist=${!this.props\r\n .isJobPost}&attachmentType=${this.props.isJobPost ? 3 : 0}&userId=${localStorage.getItem(\"userId\")}`\r\n );\r\n }\r\n\r\n\r\n // Should call the progress method to update the progress to 100% before calling load\r\n // Setting computable to false switches the loading indicator to infinite mode\r\n request.upload.onprogress = e => {\r\n progress(e.lengthComputable, e.loaded, e.total);\r\n };\r\n\r\n // Should call the load method when done and pass the returned server file id\r\n // this server file id is then used later on when reverting or restoring a file\r\n // so your server knows which file to return without exposing that info to the client\r\n request.onload = function () {\r\n if (request.status >= 200 && request.status < 300) { \r\n let result = JSON.parse(request.responseText);\r\n if (result && result.status==10){\r\n toast.error(result.message,{\r\n position: toast.POSITION.BOTTOM_RIGHT\r\n });\r\n error();\r\n abort();\r\n return;\r\n }\r\n // the load method accepts either a string (id) or an object\r\n load(request.responseText);\r\n attComponent.state.attachments.push(\r\n JSON.parse(request.response)\r\n );\r\n } else {\r\n // Can call the error method if something is wrong, should exit after\r\n error(\"oh no\");\r\n }\r\n };\r\n\r\n request.send(formData);\r\n\r\n // Should expose an abort method so the request can be cancelled\r\n return {\r\n abort: () => {\r\n // This function is entered if the user has tapped the cancel button\r\n request.abort();\r\n\r\n // Let FilePond know the request has been cancelled\r\n abort();\r\n }\r\n };\r\n },\r\n revert: (uniqueFileId, load, error) => {\r\n let attComponent = this;\r\n const request = new XMLHttpRequest();\r\n let fileObj = JSON.parse(uniqueFileId);\r\n request.open(\r\n \"GET\",\r\n `/tenant-api/delete-file?fileId=${fileObj.fileId}`\r\n );\r\n\r\n request.onload = function () {\r\n if (request.status >= 200 && request.status < 300) {\r\n // the load method accepts either a string (id) or an object\r\n load();\r\n let att = attComponent.state.attachments.filter(a => {\r\n return a.fileId != fileObj.fileId;\r\n });\r\n attComponent.state.attachments = att;\r\n } else {\r\n // Can call the error method if something is wrong, should exit after\r\n error(\"oh no\");\r\n }\r\n };\r\n\r\n request.send();\r\n\r\n return {\r\n abort: () => {\r\n // This function is entered if the user has tapped the cancel button\r\n request.abort();\r\n }\r\n };\r\n // Can call the error method if something is wrong, should exit after\r\n //{/* error(\"oh my goodness\"); */ }\r\n // Should call the load method when done, no parameters required\r\n }\r\n }}\r\n oninitfile={() => this.handleInit()}\r\n labelIdle={isFromBot ? t('hdr_lbl_drop_attchmnt_here') + \" (.jpg, .jpeg, .png, .gif, .mp4, .csv, .pdf, .mov, .tiff)\" : (isFromAsset)?'Drop attachment(s) here to upload or browse (.jpg, .jpeg, .png, .pdf)': 'Drop attachment(s) here to upload or browse' + \" (.jpg, .jpeg, .png, .gif, .mp4, .csv, .pdf, .mov, .tiff)\"}\r\n >\r\n \r\n {files}\r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n {\" \"}\r\n {isFromBot ? t('btn_cancel') : 'Cancel'}{\" \"}\r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n onAttachToPost = () => { \r\n \r\n if(this.props.isFromAsset){\r\n this.setAsstJobAttachments();\r\n return;\r\n }\r\n\r\n this.state.attachments.forEach(element => {\r\n this.props.jobDetails.attachments.push(element);\r\n });\r\n this.props.onSubmitAttachments( this.props.jobDetails.attachments);\r\n this.toggleAttachmentsDrawer();\r\n\r\n };\r\n\r\n setAsstJobAttachments=()=>{\r\n this.state.attachments.forEach(element => {\r\n this.props.assetAttachments.push(element);\r\n });\r\n this.props.onSubmitAttachments( this.props.assetAttachments );\r\n this.toggleAttachmentsDrawer();\r\n }\r\n \r\n handleInit = (file) => {\r\n };\r\n\r\n toggleAttachmentsDrawer = () => {\r\n this.setState({ attachments: [] });\r\n this.setState({\r\n showAttachmentsDrawer: !this.state.showAttachmentsDrawer\r\n });\r\n };\r\n}\r\n\r\nexport default withTranslation()(AttachmentsDrawer);\r\n","import { AXIOS } from '../Utilities/HttpRequest/Axios';\r\nimport { AppConfiguration } from \"read-appsettings-json\";\r\n\r\nconst getQoutesByJobId = (jobId, userId) => {\r\n return AXIOS.GET(`tenant-api/bids?jobId=${jobId}&userId=${userId}`);\r\n}\r\n\r\nconst approveBidByOwner = (jobId, bidId, note) => {\r\n return AXIOS.GET(`tenant-api/bid/approve-bid?jobId=${jobId}&userId=${localStorage.getItem('userIdDecripted')}&bidId=${bidId}&userIdEncrypted=${localStorage.getItem('exernalUserId')}¬e=${note}`);\r\n}\r\n\r\nconst declineAllBidsByOwner = (jobId, note) => {\r\n return AXIOS.GET(`tenant-api/bid/decline-all-quotes-by-owner?jobId=${jobId}&userId=${localStorage.getItem('userIdDecripted')}&userIdEncrypted=${localStorage.getItem('exernalUserId')}¬e=${note}`);\r\n}\r\n\r\nconst acceptTenantMangeQuote = (model) => {\r\n return AXIOS.POST(`tenant-api/consumer-type/accept-quote`,model);\r\n}\r\n\r\nconst rejectTenantMangeQuote = (model) => {\r\n return AXIOS.POST(`tenant-api/consumer-type/reject-quote`,model);\r\n}\r\n\r\nconst bidService = {\r\n getQoutesByJobId,\r\n approveBidByOwner,\r\n declineAllBidsByOwner,\r\n acceptTenantMangeQuote,\r\n rejectTenantMangeQuote\r\n}\r\n\r\nexport default bidService;","import React, { useState } from 'react';\r\nimport Drawer from \"../../../Common/Drawer/Drawer\"\r\n\r\nclass Disclaimer extends React.Component {\r\n state = {\r\n isFromBot:this.props.isFromBot?true:false,\r\n }\r\n\r\n constructor(props) {\r\n super(props);\r\n }\r\n\r\n render() {\r\n let drawer = this.createDrawer();\r\n return {drawer}
;\r\n }\r\n\r\n createDrawer = () => {\r\n let header = this.createHeader();\r\n let body = this.createBody();\r\n let footer = this.createFooter();\r\n return (\r\n <>\r\n \r\n \r\n );\r\n };\r\n\r\n createHeader = () => {\r\n return (\r\n <>\r\n \r\n Disclaimer\r\n \r\n \r\n \r\n
\r\n \r\n );\r\n };\r\n\r\n createBody = () => {\r\n if(this.props.showDrawer) {\r\n return (\r\n <>\r\n \r\n
\r\n \r\n )\r\n } else {\r\n return;\r\n }\r\n };\r\n\r\n createFooter = () => {\r\n return (\r\n <>\r\n \r\n Cancel \r\n I agree \r\n
\r\n \r\n )\r\n }\r\n\r\n onAgree = () => {\r\n this.props.onAgreedForDisclaimer(this.props.jobPostWorkflowStatus);\r\n this.closeDrawer();\r\n }\r\n\r\n closeDrawer = () => {\r\n this.props.onCloseDisclaimer();\r\n }\r\n \r\n}\r\n\r\ndocument.body.classList.add('disclaimer');\r\nexport default Disclaimer;"],"sourceRoot":""} ![\"Bricks](\"https://test.bricksandagent.com/images/app-logo-sm.svg\"){kind=logo}
\r\n \r\n ![\"Bricks](\"https://test.bricksandagent.com/images/app-logo.svg\"){kind=logo}
\r\n ![](\"/images/default-group-profile.png\")
\r\n }\r\n }\r\n\r\n openChatBox = () => {\r\n let chatList = (this.props.chatList == '') ? [] : JSON.parse(this.props.chatList);\r\n chatList.push(this.props.conversation)\r\n this.props.addToChatBoxList(JSON.stringify(chatList));\r\n }\r\n}\r\n\r\nconst mapStateToProps = (state, ownProps) => {\r\n return {\r\n chatList : state.Conversation.conversationList,\r\n imageThumbnailsCdnEndpoint: state.AppSettings.imageThumbnailsCdnEndpoint,\r\n imageCdnEndpoint: state.AppSettings.imageCdnEndpoint,\r\n profileThumbnailsCdnEndpoint: state.AppSettings.profileThumbnailsCdnEndpoint,\r\n }\r\n }\r\n \r\n const mapDispatchToProps = (dispatch) => {\r\n\r\n return {\r\n addToChatBoxList: (chatList) => { dispatch({type:'SHOW_CONVERSATION', chatList: chatList})}\r\n }\r\n }\r\n\r\nexport default connect(mapStateToProps, mapDispatchToProps)(Conversation);","import React from 'react';\r\nimport { connect } from 'react-redux';\r\nimport Conversation from './Conversation/Conversation';\r\n\r\nclass ConversationList extends React.Component {\r\n\r\n state = {\r\n conversationList: [],\r\n chatRecived: false\r\n }\r\n\r\n constructor(props) {\r\n super(props);\r\n }\r\n\r\n componentDidMount() {\r\n }\r\n\r\n render() {\r\n const chatList = this.getChatList();\r\n return (\r\n <>\r\n ![\"\"](\"/images/bot-chat.svg\")
\r\n ![\"user-add-icon\"](\"/Images/user-add-icon.png\"){kind=icon}
\r\n \r\n \r\n ![\"upload-icon\"](\"/Images/upload-icon.png\"){kind=icon}
\r\n \r\n 
\r\n ![](\"/Images/icon-prop.svg\"){kind=icon}
\r\n {(jobDetails && jobDetails.isExternalConsumerJob) ? t('lbl_location_placeholder') : t('lbl_property')}\r\n ![](\"/Images/icon-serv.svg\"){kind=icon}
\r\n {t('lbl_service')}\r\n ![](\"/Images/icon_budget.svg\"){kind=icon}
\r\n {t('lbl_budget')}\r\n ![](\"/Images/icon-schedule.svg\"){kind=icon}
\r\n Schedule\r\n ![](\"/Images/icon-tag.svg\"){kind=icon}
\r\n Selected Tag\r\n ![](\"/Images/icon-loca.svg\"){kind=icon}
\r\n Location\r\n ![](\"/Images/icon-key-col.svg\"){kind=icon}
\r\n {t('lbl_key')}\r\n ![](\"/Images/icons-images.svg\"){kind=icon}
\r\n {t('lbl_image_videos')}\r\n ![](\"/Images/icon-invoice.svg\"){kind=icon}
\r\n {\"Invoice\"} \r\n ![](\"/Images/icon-trade-attach.svg\"){kind=icon}
\r\n {\"Trade Attachments\"} \r\n ![](\"/Images/icon-note.svg\"){kind=icon}
\r\n {t(\"lbl_notes\")}\r\n ![](\"/Images/icon-exclam.svg\"){kind=icon}
\r\n ![\"\"](\"/images/recent-activity/job-icon.svg\"){kind=icon}
\r\n ![](\"/images/app-download-bg.jpg\")
\r\n 
![](\"/images/location_on_black.svg\")
![](\"/images/construction_black.svg\")
![](\"/images/account_balance_wallet_black.svg\")
![](\"/images/attach_file_black.svg\")
![](\"/images/success-msg.PNG\")
\r\n ![\"avatar\"](\"/images/user.svg\")
\r\n ![\"Client](\"/images/app-logo.svg\"){kind=logo}
\r\n ![](\"/images/user-info.png\")
\r\n ![](\"/images/air-conditioner.png\")
\r\n ![](\"/images/compliance-plate.png\")
\r\n ![](\"/images/complete.png\")
\r\n ![](\"/Images/asset_icon.svg\"){kind=icon}
\r\n ![](\"/Images/tick.svg\")
![\"Arrow\"](\"/Images/down.svg\")
\r\n \r\n ![](\"/Images/edit.svg\")
\r\n \r\n ![](\"/Images/delete.svg\")
\r\n \r\n ![\"expired-icon\"](\"/Images/expired-icon.svg\"){kind=icon}
\r\n ![\"success-icon\"](\"/Images/success-icon.svg\"){kind=icon}
\r\n ![\"Lock-icon\"](\"/Images/lock.png\")
\r\n \r\n \r\n 
\r\n 
\r\n ![](\"/images/app-store-badge.png\"){kind=icon}
\r\n ![](\"/images/google-play-badge.png\"){kind=icon}
\r\n