diff --git a/src/components/Ashp/BuildingInfo.js b/src/components/Questionnaire/BuildingInfo.js similarity index 77% rename from src/components/Ashp/BuildingInfo.js rename to src/components/Questionnaire/BuildingInfo.js index 7651e7f6e8632be166f5ed349886ae89e0f6fc55..2dbd4187496ee65b43c31422503d79b794a8b31a 100644 --- a/src/components/Ashp/BuildingInfo.js +++ b/src/components/Questionnaire/BuildingInfo.js @@ -1,7 +1,7 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { Table, Input } from 'reactstrap'; -import ApartmentTypeDropdown from './ApartmentTypeDropdown'; +import BuildingUnitDropdown from './BuildingUnitDropdown'; class BuildingInfo extends Component { constructor(props) { @@ -12,14 +12,16 @@ class BuildingInfo extends Component { lastName: props.lastName, email: props.email, phone: props.phone, - numOfStudio: props.numOfStudio, - numOfOneBedroom: props.numOfOneBedroom, - numOfTwoBedroom: props.numOfTwoBedroom, - numOfThreeBedroom: props.numOfThreeBedroom, - numOfFourBedroom: props.numOfFourBedroom, - other: props.other, - numOfOther: props.numOfOther, address: props.address, + unitInfo: { + studio: props.numOfStudio, + oneBedroom: props.numOfOneBedroom, + twoBedroom: props.numOfTwoBedroom, + threeBedroom: props.numOfThreeBedroom, + fourBedroom: props.numOfFourBedroom, + other: props.other, + numOfOther: props.numOfOther, + }, }, }; } @@ -39,10 +41,34 @@ class BuildingInfo extends Component { } handleInputChangeSubComponent = (name, val) => { + const unitInfo = {}; + Object.entries(this.state.form.unitInfo).forEach(entry => { + if (entry[0] === name) { + unitInfo[name] = parseInt(val, 10); + } else { + unitInfo[entry[0]] = entry[1]; + } + }); this.setState({ form: { ...this.state.form, - [name]: val, + unitInfo, + }, + }, () => { + this.props.onChangeEvent('buildingInfo', this.state.form); + console.log('changed!'); // eslint-disable-line + }); + } + + handleOtherInputChange = (event) => { + const val = event.target.value; + const name = event.target.name; + const unitInfo = this.state.form.unitInfo; + unitInfo[name] = val; + this.setState({ + form: { + ...this.state.form, + unitInfo, }, }, () => { this.props.onChangeEvent('buildingInfo', this.state.form); @@ -135,10 +161,10 @@ class BuildingInfo extends Component {
Number of Studio
- @@ -146,10 +172,10 @@ class BuildingInfo extends Component {
Number of One Bedroom Apartment
- @@ -162,10 +188,10 @@ class BuildingInfo extends Component {
Number of Two Bedroom Apartment
- @@ -173,10 +199,10 @@ class BuildingInfo extends Component {
Number of Three Bedroom Apartment
- @@ -189,10 +215,10 @@ class BuildingInfo extends Component {
Number of Four Bedroom Apartment
- @@ -204,17 +230,17 @@ class BuildingInfo extends Component {
this.handleInputChange(e)} + placeholder="Other" + value={this.state.form.unitInfo.other} + onChange={e => this.handleOtherInputChange(e)} />
this.handleInputChange(e)} + value={this.state.form.unitInfo.numOfOther} + onChange={e => this.handleOtherInputChange(e)} > diff --git a/src/components/Ashp/ApartmentTypeDropdown.js b/src/components/Questionnaire/BuildingUnitDropdown.js similarity index 79% rename from src/components/Ashp/ApartmentTypeDropdown.js rename to src/components/Questionnaire/BuildingUnitDropdown.js index 564bc513de7b9da4beb42202173bc4b7d6e496ba..ca2c6df259145a3a1106e86b62d787dae9aa6c8b 100644 --- a/src/components/Ashp/ApartmentTypeDropdown.js +++ b/src/components/Questionnaire/BuildingUnitDropdown.js @@ -5,11 +5,11 @@ import { } from 'reactstrap'; -class ApartmentTypeDropdown extends Component { +class BuildingUnitDropdown extends Component { constructor(props) { super(props); this.state = { - numOfApartment: props.numOfApartment, + numOfUnit: props.numOfUnit, }; } @@ -17,9 +17,9 @@ class ApartmentTypeDropdown extends Component { const val = event.target.value; // const name = event.target.name; this.setState({ - numOfApartment: val, + numOfUnit: val, }, () => { - this.props.onChange(this.props.inputName, this.state.numOfApartment); + this.props.onChange(this.props.inputName, this.state.numOfUnit); console.log('changed!'); // eslint-disable-line }); } @@ -31,7 +31,7 @@ class ApartmentTypeDropdown extends Component { this.handleInputChange(e)} > @@ -47,10 +47,10 @@ class ApartmentTypeDropdown extends Component { } } -ApartmentTypeDropdown.propTypes = { +BuildingUnitDropdown.propTypes = { inputName: PropTypes.string, - numOfApartment: PropTypes.number, + numOfUnit: PropTypes.number, onChange: PropTypes.func, }; -export default ApartmentTypeDropdown; +export default BuildingUnitDropdown; diff --git a/src/components/Ashp/FinancialInitial.js b/src/components/Questionnaire/FinancialInitial.js similarity index 59% rename from src/components/Ashp/FinancialInitial.js rename to src/components/Questionnaire/FinancialInitial.js index 4fc5b3a550b80916f1a5ea2bbd7c423ff17b7bf8..ac588bb474e5a65296837871c53a8cf9d9cfab95 100644 --- a/src/components/Ashp/FinancialInitial.js +++ b/src/components/Questionnaire/FinancialInitial.js @@ -8,7 +8,7 @@ class FinanacialInitial extends Component { super(props); this.state = { form: { - bankruptyPast: props.bankruptyPast, + bankruptcyPast: props.bankruptcyPast, currentOnEnergyBills: props.currentOnEnergyBills, currentMortgageBalance: props.currentMortgageBalance, profitable: props.profitable, @@ -23,7 +23,11 @@ class FinanacialInitial extends Component { this.setState({ form: { ...this.state.form, - [name]: val, + [name]: { + question_id: this.state.form[name].question_id, + question: this.state.form[name].question, + answer_id: val, + }, }, }, () => { this.props.onChangeEvent('financialInitials', this.state.form); @@ -48,91 +52,91 @@ class FinanacialInitial extends Component {
- Any bankruptcy in the past three years? + {this.props.bankruptcyPast.question} this.handleInputChange(e)} > - - - - + + + + - Current on energy bills? + {this.props.currentOnEnergyBills.question} this.handleInputChange(e)} > - - - - - - - + + + + + + +
- What is the current outstanding balance of the mortgage? + {this.props.currentMortgageBalance.question} this.handleInputChange(e)} > - - - - - - + + + + + + - Is your building currently profitable? + {this.props.profitable.question} this.handleInputChange(e)} > - - - - + + + +
- What is your current budget for a down payment? + {this.props.budgetForDownPayment.question} this.handleInputChange(e)} > - - - + + + @@ -154,12 +158,13 @@ class FinanacialInitial extends Component { FinanacialInitial.propTypes = { tableHeader: PropTypes.objectOf, - bankruptyPast: PropTypes.string, + bankruptcyPast: PropTypes.string, currentOnEnergyBills: PropTypes.string, currentMortgageBalance: PropTypes.string, profitable: PropTypes.string, budgetForDownPayment: PropTypes.string, onChangeEvent: PropTypes.func, + // answers: PropTypes.objectOf, }; export default FinanacialInitial; diff --git a/src/components/Ashp/RemoteSurvey.js b/src/components/Questionnaire/RemoteSurvey.js similarity index 58% rename from src/components/Ashp/RemoteSurvey.js rename to src/components/Questionnaire/RemoteSurvey.js index dadcdc3b36f26dafa6017cfb6a80540bddc91e37..8cf65b7bfb8ad3a9bfe3778032729b0b78d086f3 100644 --- a/src/components/Ashp/RemoteSurvey.js +++ b/src/components/Questionnaire/RemoteSurvey.js @@ -11,7 +11,7 @@ class RemoteSurvey extends Component { heatingSystem: props.heatingSystem, heatingFuelSource: props.heatingFuelSource, DHWSameBoiler: props.DHWSameBoiler, - AgeOfHeatGenerateSystem: props.AgeOfHeatGenerateSystem, + ageOfHeatGenerateSystem: props.ageOfHeatGenerateSystem, planToReplaceHS: props.planToReplaceHS, hallwaysHeated: props.hallwaysHeated, basementHeated: props.basementHeated, @@ -33,7 +33,11 @@ class RemoteSurvey extends Component { this.setState({ form: { ...this.state.form, - [name]: val, + [name]: { + question_id: this.state.form[name].question_id, + question: this.state.form[name].question, + answer_id: val, + }, }, }, () => { this.props.onChangeEvent('remoteSurvey', this.state.form); @@ -56,94 +60,95 @@ class RemoteSurvey extends Component { @@ -384,8 +386,9 @@ RemoteSurvey.propTypes = { tenantComplaintsWindows: PropTypes.string, tenantComplaintsComfort: PropTypes.string, meteredForElectricity: PropTypes.string, - AgeOfHeatGenerateSystem: PropTypes.string, + ageOfHeatGenerateSystem: PropTypes.string, onChangeEvent: PropTypes.func, + // answers: PropTypes.objectOf, }; export default RemoteSurvey; diff --git a/src/components/Ashp/ReviewAnswers/BuildingInfo.js b/src/components/Questionnaire/ReviewAnswers/BuildingInfo.js similarity index 82% rename from src/components/Ashp/ReviewAnswers/BuildingInfo.js rename to src/components/Questionnaire/ReviewAnswers/BuildingInfo.js index 3c8efa1da16c16f3f35208f76e202cbede886ce2..84e9e5bb2cc472fd43b615c3cc828ffb2fe582ec 100644 --- a/src/components/Ashp/ReviewAnswers/BuildingInfo.js +++ b/src/components/Questionnaire/ReviewAnswers/BuildingInfo.js @@ -9,13 +9,18 @@ const BuildingInfo = (props) => { fontWeight: 'bold', color: '#CCCCCC', }; - const address = props.data.address.map(addressItem => { - return ( -
- {addressItem} -
- ); - }); + + let address = props.data.address; // eslint-disable-line + if (Array.isArray(props.data.address)) { + address = props.data.address.map(addressItem => { + return ( +
+ {addressItem} +
+ ); + }); + } + return (
- Heating System + {this.props.heatingSystem.question} this.handleInputChange(e)} > - - - - - - + + + + + + - Heating Fuel Source + {this.props.heatingFuelSource.question} this.handleInputChange(e)} > - - - - - - + + + + + +
- Is Domestic Hot Water (DHW) and heat prepared by the same boiler? + {this.props.DHWSameBoiler.question} this.handleInputChange(e)} > - - - - + + + + - Age of heat generating system? + {this.props.ageOfHeatGenerateSystem.question} this.handleInputChange(e)} > - - - - - - + + + + + +
- When do you plan to replace the heating system? + {this.props.planToReplaceHS.question} this.handleInputChange(e)} > - - - - - + + + + + + @@ -166,13 +171,13 @@ class RemoteSurvey extends Component { this.handleInputChange(e)} > - - - - + + + + @@ -186,13 +191,13 @@ class RemoteSurvey extends Component { this.handleInputChange(e)} > - - - - + + + + @@ -214,13 +219,13 @@ class RemoteSurvey extends Component { this.handleInputChange(e)} > - - - - + + + + @@ -234,13 +239,13 @@ class RemoteSurvey extends Component { this.handleInputChange(e)} > - - - - + + + + @@ -251,109 +256,106 @@ class RemoteSurvey extends Component {
- Is the roof flat and easily accessible by a stairwell? + {this.props.accessibleByStairwell.question} this.handleInputChange(e)} > - - - - + + + + - Is the back facade of your building attached to - an adjacent building or structure? + {this.props.backFacadeAttached.question} this.handleInputChange(e)} > - - - - + + + + +
- Are the exterior walls of your building attached to - an adjacent building or structure? + {this.props.exteriorWallsAttached.question} this.handleInputChange(e)} > - - - - - + + + + + - Any tenant complaints about comfort issues? (Temperature) + {this.props.tenantComplaintsComfort.question} this.handleInputChange(e)} > - - - - - + + + +
- Any tenant complaints about drafty windows? + {this.props.tenantComplaintsWindows.question} this.handleInputChange(e)} > - - - - - + + + + + - Is the building directly metered for electricity - (tenants pay ConEd bills)? + {this.props.meteredForElectricity.question} this.handleInputChange(e)} > - - - - + + + +
@@ -76,7 +81,7 @@ const BuildingInfo = (props) => { Number of Studio
- {props.data.numOfStudio} + {props.data.unitInfo.studio}
@@ -94,7 +99,7 @@ const BuildingInfo = (props) => { Number of Two Bedroom Apartment
- {props.data.numOfTwoBedroom} + {props.data.unitInfo.twoBedroom}
@@ -112,7 +117,7 @@ const BuildingInfo = (props) => { Number of Four Bedroom Apartment
- {props.data.numOfFourBedroom} + {props.data.unitInfo.fourBedroom}
diff --git a/src/components/Ashp/ReviewAnswers/FinancialInitial.js b/src/components/Questionnaire/ReviewAnswers/FinancialInitial.js similarity index 67% rename from src/components/Ashp/ReviewAnswers/FinancialInitial.js rename to src/components/Questionnaire/ReviewAnswers/FinancialInitial.js index 70bab548e59ec4b410ad9f1d4e061db0db3ec51a..e8e9d3d338a4337f52de81d1a37d678b12ca6444 100644 --- a/src/components/Ashp/ReviewAnswers/FinancialInitial.js +++ b/src/components/Questionnaire/ReviewAnswers/FinancialInitial.js @@ -9,6 +9,7 @@ const FinancialInitial = (props) => { fontWeight: 'bold', color: '#BBBBBB', }; + return (
@@ -84,7 +89,7 @@ const BuildingInfo = (props) => { Number of One Bedroom Apartment
- {props.data.numOfOneBedroom} + {props.data.unitInfo.oneBedroom}
@@ -102,7 +107,7 @@ const BuildingInfo = (props) => { Number of Three Bedroom Apartment
- {props.data.numOfThreeBedroom} + {props.data.unitInfo.threeBedroom}
@@ -120,7 +125,7 @@ const BuildingInfo = (props) => { Other Apartment
- {props.data.other} {props.data.numOfOther} + {props.data.unitInfo.other} {props.data.unitInfo.numOfOther}
@@ -23,7 +24,11 @@ const FinancialInitial = (props) => { Any bankruptcy in the past three years?
- {props.upperFirstLetter(props.data.bankruptyPast)} + { + props.upperFirstLetter( + props.answers[props.data.bankruptcyPast.answer_id] + ) + }
@@ -33,7 +38,11 @@ const FinancialInitial = (props) => { Current on energy bills?
- {props.upperFirstLetter(props.data.currentOnEnergyBills)} + { + props.upperFirstLetter( + props.answers[props.data.currentOnEnergyBills.answer_id] + ) + }
@@ -43,7 +52,11 @@ const FinancialInitial = (props) => { What is the current outstanding balance of the mortgage?
- {props.upperFirstLetter(props.data.currentMortgageBalance)} + { + props.upperFirstLetter( + props.answers[props.data.currentMortgageBalance.answer_id] + ) + }
@@ -53,7 +66,11 @@ const FinancialInitial = (props) => { Is your building currently profitable?
- {props.upperFirstLetter(props.data.profitable)} + { + props.upperFirstLetter( + props.answers[props.data.profitable.answer_id] + ) + }
@@ -63,7 +80,11 @@ const FinancialInitial = (props) => { What is your current budget for a down payment?
- {props.upperFirstLetter(props.data.budgetForDownPayment)} + { + props.upperFirstLetter( + props.answers[props.data.budgetForDownPayment.answer_id] + ) + }
@@ -77,6 +98,7 @@ FinancialInitial.propTypes = { title: PropTypes.string, data: PropTypes.objectOf, upperFirstLetter: PropTypes.func, + answers: PropTypes.objectOf, }; export default FinancialInitial; diff --git a/src/components/Ashp/ReviewAnswers/RemoteSurvey.js b/src/components/Questionnaire/ReviewAnswers/RemoteSurvey.js similarity index 60% rename from src/components/Ashp/ReviewAnswers/RemoteSurvey.js rename to src/components/Questionnaire/ReviewAnswers/RemoteSurvey.js index c7bc75c80db9a4649b9b9e908ec6caf154340b14..04afeb1d77c1244535eb8bc13e80bdd6b91399e5 100644 --- a/src/components/Ashp/ReviewAnswers/RemoteSurvey.js +++ b/src/components/Questionnaire/ReviewAnswers/RemoteSurvey.js @@ -23,7 +23,11 @@ const RemoteSurvey = (props) => { Heating System
- {props.upperFirstLetter(props.data.heatingSystem)} + { + props.upperFirstLetter( + props.answers[props.data.heatingSystem.answer_id] + ) + }
@@ -41,7 +49,11 @@ const RemoteSurvey = (props) => { Is Domestic Hot Water (DHW) and heat prepared by the same boiler?
- {props.upperFirstLetter(props.data.DHWSameBoiler)} + { + props.upperFirstLetter( + props.answers[props.data.DHWSameBoiler.answer_id] + ) + }
@@ -51,7 +63,11 @@ const RemoteSurvey = (props) => { Age of heat generating system?
- {props.upperFirstLetter(props.data.AgeOfHeatGenerateSystem)} + { + props.upperFirstLetter( + props.answers[props.data.ageOfHeatGenerateSystem.answer_id] + ) + }
@@ -61,7 +77,11 @@ const RemoteSurvey = (props) => { When do you plan to replace the heating system?
- {props.upperFirstLetter(props.data.planToReplaceHS)} + { + props.upperFirstLetter( + props.answers[props.data.planToReplaceHS.answer_id] + ) + }
@@ -71,7 +91,11 @@ const RemoteSurvey = (props) => { Hallways heated?
- {props.upperFirstLetter(props.data.hallwaysHeated)} + { + props.upperFirstLetter( + props.answers[props.data.hallwaysHeated.answer_id] + ) + }
@@ -89,7 +117,11 @@ const RemoteSurvey = (props) => { Stairwells heated?
- {props.upperFirstLetter(props.data.stairwellsHeated)} + { + props.upperFirstLetter( + props.answers[props.data.stairwellsHeated.answer_id] + ) + }
@@ -107,7 +143,11 @@ const RemoteSurvey = (props) => { Is the roof flat and easily accessible by a stairwell?
- {props.upperFirstLetter(props.data.accessibleByStairwell)} + { + props.upperFirstLetter( + props.answers[props.data.accessibleByStairwell.answer_id] + ) + }
@@ -117,7 +157,11 @@ const RemoteSurvey = (props) => { Is the back facade of your building attached to an adjacent building or structure?
- {props.upperFirstLetter(props.data.backFacadeAttached)} + { + props.upperFirstLetter( + props.answers[props.data.backFacadeAttached.answer_id] + ) + }
@@ -127,7 +171,11 @@ const RemoteSurvey = (props) => { Are the exterior walls of your building attached to an adjacent building or structure?
- {props.upperFirstLetter(props.data.exteriorWallsAttached)} + { + props.upperFirstLetter( + props.answers[props.data.exteriorWallsAttached.answer_id] + ) + }
@@ -137,7 +185,11 @@ const RemoteSurvey = (props) => { Any tenant complaints about comfort issues? (Temperature)
- {props.upperFirstLetter(props.data.tenantComplaintsComfort)} + { + props.upperFirstLetter( + props.answers[props.data.tenantComplaintsComfort.answer_id] + ) + }
@@ -147,7 +199,11 @@ const RemoteSurvey = (props) => { Any tenant complaints about drafty windows?
- {props.upperFirstLetter(props.data.tenantComplaintsWindows)} + { + props.upperFirstLetter( + props.answers[props.data.tenantComplaintsWindows.answer_id] + ) + }
@@ -157,7 +213,11 @@ const RemoteSurvey = (props) => { Is the building directly metered for electricity (tenants pay ConEd bills)?
- {props.upperFirstLetter(props.data.meteredForElectricity)} + { + props.upperFirstLetter( + props.answers[props.data.meteredForElectricity.answer_id] + ) + }
@@ -171,6 +231,7 @@ RemoteSurvey.propTypes = { title: PropTypes.string, data: PropTypes.objectOf, upperFirstLetter: PropTypes.func, + answers: PropTypes.objectOf, }; export default RemoteSurvey; diff --git a/src/components/Ashp/ReviewAnswers/index.js b/src/components/Questionnaire/ReviewAnswers/index.js similarity index 83% rename from src/components/Ashp/ReviewAnswers/index.js rename to src/components/Questionnaire/ReviewAnswers/index.js index 034b60b30bdf802c2c391c4741323ea4e49961da..b83b0223b951edb271af09ed3c58387332c9ab82 100644 --- a/src/components/Ashp/ReviewAnswers/index.js +++ b/src/components/Questionnaire/ReviewAnswers/index.js @@ -1,4 +1,5 @@ import React from 'react'; +import { Row, Col } from 'reactstrap'; import PropTypes from 'prop-types'; import BuildingInfo from './BuildingInfo'; import RemoteSurvey from './RemoteSurvey'; @@ -12,32 +13,34 @@ const ReviewAnswers = (props) => { return (
-
-
+ +
- -
+ +
- -
+ +
- - + + ); }; @@ -47,6 +50,7 @@ ReviewAnswers.propTypes = { buildingInfo: PropTypes.objectOf, remoteSurvey: PropTypes.objectOf, financialInitials: PropTypes.objectOf, + answers: PropTypes.objectOf, }; export default ReviewAnswers; diff --git a/src/containers/Questionnaire/actions.js b/src/containers/Questionnaire/actions.js index 85d322bcc0c1ab144b43be2f012e1ac7a6bc0e24..7ba76557bad67db2aec5bf3e28679a97753a35ad 100644 --- a/src/containers/Questionnaire/actions.js +++ b/src/containers/Questionnaire/actions.js @@ -5,6 +5,8 @@ import { SUBMIT_QUESTIONNAIRE_REQUESTED, SUBMIT_QUESTIONNAIRE_SUCCEEDED, SUBMIT_QUESTIONNAIRE_FAILED, + EDIT_QUESTIONNAIRE_REQUESTED, + EDIT_QUESTIONNAIRE_SUCCEEDED, CALCULATE_COST_REQUESTED, CALCULATE_COST_SUCCEEDED, CALCULATE_COST_FAILED, @@ -17,16 +19,19 @@ import { makeActionCreator } from '../../utils/reduxHelpers'; export const loadQuestionnaire = makeActionCreator(LOAD_QUESTIONNAIRE_REQUESTED, 'buildingId'); -export const loadQuestionnaireSucceeded = makeActionCreator(LOAD_QUESTIONNAIRE_SUCCEEDED, 'questionnaire'); +export const loadQuestionnaireSucceeded = makeActionCreator(LOAD_QUESTIONNAIRE_SUCCEEDED, 'instance'); export const loadQuestionnaireLFailed = makeActionCreator(LOAD_QUESTIONNAIRE_FAILED, 'error'); -export const submitQuestionnaire = makeActionCreator(SUBMIT_QUESTIONNAIRE_REQUESTED, 'buildingId'); -export const submitQuestionnaireSucceeded = makeActionCreator(SUBMIT_QUESTIONNAIRE_SUCCEEDED, 'questionnaire'); +export const submitQuestionnaire = makeActionCreator(SUBMIT_QUESTIONNAIRE_REQUESTED, 'buildingId', 'payload'); +export const submitQuestionnaireSucceeded = makeActionCreator(SUBMIT_QUESTIONNAIRE_SUCCEEDED, 'instance'); export const submitQuestionnaireFailed = makeActionCreator(SUBMIT_QUESTIONNAIRE_FAILED, 'error'); -export const calculateCost = makeActionCreator(CALCULATE_COST_REQUESTED, 'buildingId', 'id'); -export const calculateCostSucceeded = makeActionCreator(CALCULATE_COST_SUCCEEDED, 'id'); -export const calculateCostFailed = makeActionCreator(CALCULATE_COST_FAILED, 'id', 'error'); +export const editQuestionnaire = makeActionCreator(EDIT_QUESTIONNAIRE_REQUESTED, 'buildingId', 'payload'); +export const editQuestionnaireSucceeded = makeActionCreator(EDIT_QUESTIONNAIRE_SUCCEEDED, 'instance'); + +export const calculateCost = makeActionCreator(CALCULATE_COST_REQUESTED, 'buildingId'); +export const calculateCostSucceeded = makeActionCreator(CALCULATE_COST_SUCCEEDED, 'instance'); +export const calculateCostFailed = makeActionCreator(CALCULATE_COST_FAILED, 'error'); export const downloadReport = makeActionCreator(DOWNLOAD_REPORT_REQUESTED, 'buildingId'); export const downloadReportSucceeded = makeActionCreator(DOWNLOAD_REPORT_SUCCEEDED, 'payload'); diff --git a/src/containers/Questionnaire/constants.js b/src/containers/Questionnaire/constants.js index 1f1286dee9172af4e197a7248f54d80724cc9ca6..774531afe41e17a61e388346871b0e8405a5140c 100644 --- a/src/containers/Questionnaire/constants.js +++ b/src/containers/Questionnaire/constants.js @@ -6,6 +6,9 @@ export const SUBMIT_QUESTIONNAIRE_REQUESTED = 'SUBMIT_QUESTIONNAIRE_REQUESTED'; export const SUBMIT_QUESTIONNAIRE_SUCCEEDED = 'SUBMIT_QUESTIONNAIRE_SUCCEEDED'; export const SUBMIT_QUESTIONNAIRE_FAILED = 'SUBMIT_QUESTIONNAIRE_FAILED'; +export const EDIT_QUESTIONNAIRE_REQUESTED = 'EDIT_QUESTIONNAIRE_REQUESTED'; +export const EDIT_QUESTIONNAIRE_SUCCEEDED = 'EDIT_QUESTIONNAIRE_SUCCEEDED'; + export const CALCULATE_COST_REQUESTED = 'CALCULATE_COST_REQUESTED'; export const CALCULATE_COST_SUCCEEDED = 'CALCULATE_COST_SUCCEEDED'; export const CALCULATE_COST_FAILED = 'CALCULATE_COST_FAILED'; diff --git a/src/containers/Questionnaire/index.js b/src/containers/Questionnaire/index.js index e2e23f17f4c7f07f01244ded85a37df5ad9bbc47..6b2d4d112a0249fc7fde899ce4db251293016f77 100644 --- a/src/containers/Questionnaire/index.js +++ b/src/containers/Questionnaire/index.js @@ -3,19 +3,20 @@ import PropTypes from 'prop-types'; import { connect } from 'react-redux'; import { bindActionCreators } from 'redux'; import { Button } from 'reactstrap'; -// import Loading from '../../components/Loading'; +import Loading from '../../components/Loading'; import buildingDetailPropTypes from '../Building/propTypes'; import { loadQuestionnaire, submitQuestionnaire, + editQuestionnaire, calculateCost, - downloadReport, + // downloadReport, } from './actions'; import LinkBarDetail from '../../components/LinkBarDetail'; -import BuildingInfo from '../../components/Ashp/BuildingInfo'; -import FinancialInitial from '../../components/Ashp/FinancialInitial'; -import RemoteSurvey from '../../components/Ashp/RemoteSurvey'; -import ReviewAnswers from '../../components/Ashp/ReviewAnswers'; +import BuildingInfo from '../../components/Questionnaire/BuildingInfo'; +import FinancialInitial from '../../components/Questionnaire/FinancialInitial'; +import RemoteSurvey from '../../components/Questionnaire/RemoteSurvey'; +import ReviewAnswers from '../../components/Questionnaire/ReviewAnswers'; class Questionnaire extends Component { @@ -41,56 +42,16 @@ class Questionnaire extends Component { tenantComplaintsComfort: 'Tenant temperature complaints', tenantComplaintsWindows: 'Tenant window draft complaints', meteredForElectricity: 'ConEd Electricity Meter', - bankruptyPast: 'Past bankruptcy', + bankruptcyPast: 'Past bankruptcy', currentOnEnergyBills: 'Energy bills status', currentMortgageBalance: 'Outstanding mortgage balance', profitable: 'Building profit', budgetForDownPayment: 'Down payment budget', }; this.state = { - buildingInfo: { - firstName: 'Bryan', - lastName: 'Ontiveros', - email: 'bryan@blocpower.io', - phone: '911-911-9911', - address: this.props.building.street_address.map(addressItem => { - return `${addressItem}, ${this.props.building.borough}`; - }), - numOfStudio: 1, - numOfOneBedroom: 3, - numOfTwoBedroom: 2, - numOfThreeBedroom: 1, - numOfFourBedroom: 0, - other: ' ', - numOfOther: 0, - }, - remoteSurvey: { - heatingSystem: 'steam', - heatingFuelSource: 'heating oil', - DHWSameBoiler: 'yes', - AgeOfHeatGenerateSystem: '0-3 years', - planToReplaceHS: 'asap', - hallwaysHeated: 'yes', - basementHeated: 'yes', - stairwellsHeated: 'yes', - floorsHeated: 'yes', - accessibleByStairwell: 'yes', - backFacadeAttached: 'yes', - exteriorWallsAttached: 'no', - tenantComplaintsComfort: 'no', - tenantComplaintsWindows: 'no', - meteredForElectricity: 'no', - }, - financialInitials: { - bankruptyPast: 'yes', - currentOnEnergyBills: 'current', - currentMortgageBalance: '0%', - profitable: 'always', - budgetForDownPayment: 'no cash', - }, - showReviewAnswers: false, - submitted: false, - calculated: false, + buildingInfo: {}, + remoteSurvey: {}, + financialInitials: {}, }; } @@ -109,50 +70,46 @@ class Questionnaire extends Component { } submitQuestionnaire = () => { - if (this.validateInputs()) { - this.setState({ - submitted: true, - showReviewAnswers: true, - }, () => { - console.log('Saving answers!'); // eslint-disable-line - }); + const data = { + buildingInfo: Object.keys(this.state.buildingInfo).length > 0 ? + this.state.buildingInfo : + this.props.questionnaire.buildingInfo.data, + remoteSurvey: Object.keys(this.state.remoteSurvey).length > 0 ? + this.state.remoteSurvey : + this.props.questionnaire.submittedAnswers.data.remoteSurvey, + financialInitials: Object.keys(this.state.financialInitials).length > 0 ? + this.state.financialInitials : + this.props.questionnaire.submittedAnswers.data.financialInitials, + }; + + if (this.validateInputs(data)) { + this.props.submitQuestionnaire(this.props.building.building_id, data); } return false; } - calculate = () => { - this.setState({ - submitted: false, - calculated: true, - }, () => { - console.log('Calculated!'); // eslint-disable-line - }); + calculateCost = () => { + this.props.calculateCost(this.props.building.building_id); } downloadReport = () => { - this.setState({ - calculated: false, - }, () => { - console.log('Dowmloaded!'); // eslint-disable-line - }); + window.open(`${process.env.REACT_APP_BLOCLINK_URL}/buildings/${this.props.building.building_id}/pna/report/download/`, '_blank'); } editForm = () => { - this.setState({ - showReviewAnswers: false, - submitted: false, - calculated: false, - }); + this.props.editQuestionnaire( + this.props.building.building_id, this.props.questionnaire + ); } - validateInputs() { + validateInputs(data) { const emptyFields = []; const invalidFields = []; const errorMessage = []; const validEmail = /^$|^[a-zA-Z0-9]+@[a-zA-Z0-9]+\.[A-Za-z]+$/; const validPhone = /^$|^\(?(\d{3})\)?[- ]?(\d{3})[- ]?(\d{4})$/; - Object.entries(this.state).forEach(formData => { + Object.entries(data).forEach(formData => { if (['buildingInfo', 'remoteSurvey', 'financialInitials'].includes(formData[0])) { Object.entries(formData[1]).forEach(fieldData => { if (fieldData[0] !== 'other' && fieldData[1].toString().replace(/^\s+|\s+$/g, '') === '') { @@ -164,208 +121,252 @@ class Questionnaire extends Component { if (fieldData[0] === 'email' && !(validEmail.test(fieldData[1]))) { invalidFields.push(this.nameMapping[fieldData[0]]); } - if (fieldData[1] === '-1') { + if (typeof fieldData[1] === 'object' && + fieldData[1].answer_id !== undefined && + fieldData[1].answer_id === -1 && + fieldData[1].question_id !== 16) { emptyFields.push(this.nameMapping[fieldData[0]]); } }); } }); - if (emptyFields.length > 0 || invalidFields.length > 0) { - if (emptyFields.length > 0) { - errorMessage.push(`Please fill in ${emptyFields.join(', ')} field(s)`); - } - if (invalidFields.length > 0) { - errorMessage.push(`\nInvalid input in ${invalidFields.join(', ')} field(s)`); - } + + if (emptyFields.length > 0) { + errorMessage.push(`Please fill in ${emptyFields.join(', ')} field(s)`); + alert(errorMessage); + return false; + } + if (invalidFields.length > 0) { + errorMessage.push(`\nInvalid input in ${invalidFields.join(', ')} field(s)`); alert(errorMessage); return false; } + return true; } render() { - const tableHeader = { - paddingBottom: '20px', - borderTop: '1px solid #CCCCCC', - background: '#EEEEEE', - fontWeight: 'bold', - paddingTop: '20px', - }; + let mainContent = ; + const { + questionnaire, + building, + } = this.props; + const { + buildingInfo, + submittedAnswers, + answers, + submitted, + calculated, + } = questionnaire; - const labelStyle = { - marginBottom: '0.7em', - fontWeight: 'bold', - fontSize: '12px', - color: '#999999', - }; + if (buildingInfo.data !== undefined && buildingInfo.data !== null && + submittedAnswers.data !== undefined && submittedAnswers.data !== null && + building !== undefined) { + console.log(questionnaire); // eslint-disable-line + const address = building.street_address.map(addressItem => { + return `${addressItem}, ${building.borough}`; + }); - const successMsgStyle = { - padding: '15px 50px 15px 50px', - border: '2px solid #CCCCCC', - marginBottom: '20px', - background: '#B8DFC2', - }; + const tableHeader = { + paddingBottom: '20px', + borderTop: '1px solid #CCCCCC', + background: '#EEEEEE', + fontWeight: 'bold', + paddingTop: '20px', + }; - const editStyle = { - marginLeft: '15px', - cursor: 'pointer', - textDecoration: 'underline', - }; + const labelStyle = { + marginBottom: '0.7em', + fontWeight: 'bold', + fontSize: '12px', + color: '#999999', + }; - let forms = ''; - if (this.state.showReviewAnswers === false) { - forms = ( -
-
-
- + const successMsgStyle = { + padding: '25px 50px 25px 50px', + border: '4px solid #CCCCCC', + marginBottom: '25px', + background: '#B8DFC2', + fontWeight: 'bold', + borderRadius: '5px', + }; + + const editStyle = { + marginLeft: '15px', + cursor: 'pointer', + textDecoration: 'underline', + }; + + let forms = ''; + if (submitted === false && calculated === false) { + forms = ( +
+
+
+ +
-
-
-
- +
+
+ +
-
-
-
- +
+
+ +
-
- ); - } - - let message = ''; - let editLink = ''; - let submitButton = ''; - if (this.state.showReviewAnswers === false) { - submitButton = ( - - ); - } + ); + } - let calculateButton = ''; - if (this.state.submitted === true) { - calculateButton = ( - - {' '} + let message = ''; + let editLink = ''; + let submitButton = ''; + if (submitted === false && calculated === false) { + submitButton = ( - - ); - message = ( -
- Successfully submitted. -
- ); - } + ); + } - let downloadButton = ''; - if (this.state.calculated === true) { - downloadButton = ( - - {' '} - - - ); - message = ( -
- Calculation completed. -
- ); - } + let calculateButton = ''; + if (submitted === true && calculated === false) { + calculateButton = ( + + {' '} + + + ); + message = ( +
+ ⚑  Your questionnaire has been submitted. +
+ ); + } - let reviewAnswers = null; - if (this.state.showReviewAnswers === true) { - reviewAnswers = ( - - ); - editLink = ( - - Edit answers - - ); - } + let downloadButton = ''; + if (calculated === true) { + downloadButton = ( + + {' '} + + + ); + message = ( +
+ ✔  Your report is ready. +
+ ); + } - const mainContent = ( -
- {forms} -
-
- {message} - {submitButton} - {calculateButton} - {downloadButton} - {editLink} + let reviewAnswers = null; + if ((submitted === true || calculated === true) + && Object.keys(answers).length > 0) { + reviewAnswers = ( + + ); + editLink = ( + + Edit answers + + ); + } + + mainContent = ( +
+ {forms} +
+
+ {message} + {submitButton} + {calculateButton} + {downloadButton} + {editLink} +
+ {reviewAnswers}
- {reviewAnswers} -
- ); + ); + } return (
@@ -386,19 +387,25 @@ class Questionnaire extends Component { Questionnaire.propTypes = { building: buildingDetailPropTypes, loadQuestionnaire: PropTypes.func, + submitQuestionnaire: PropTypes.func, + editQuestionnaire: PropTypes.func, + calculateCost: PropTypes.func, + // downloadReport: PropTypes.func, + questionnaire: PropTypes.objectOf, }; const mapDispatchToProps = dispatch => ( bindActionCreators({ loadQuestionnaire, submitQuestionnaire, + editQuestionnaire, calculateCost, - downloadReport, + // downloadReport, }, dispatch) ); const mapStateToProps = state => ({ - buildingInfo: state.buildingInfo, + questionnaire: state.questionnaire, user: state.user, eng: state.eng, }); diff --git a/src/containers/Questionnaire/reducer.js b/src/containers/Questionnaire/reducer.js index b932745ae439291fc684bc82e232206dfe929c8a..651cbf2c62facffc89da9960b596bc865ff57014 100644 --- a/src/containers/Questionnaire/reducer.js +++ b/src/containers/Questionnaire/reducer.js @@ -5,6 +5,8 @@ import { SUBMIT_QUESTIONNAIRE_REQUESTED, SUBMIT_QUESTIONNAIRE_SUCCEEDED, SUBMIT_QUESTIONNAIRE_FAILED, + EDIT_QUESTIONNAIRE_REQUESTED, + EDIT_QUESTIONNAIRE_SUCCEEDED, CALCULATE_COST_REQUESTED, CALCULATE_COST_SUCCEEDED, CALCULATE_COST_FAILED, @@ -20,16 +22,14 @@ const questionnaireInitialState = { error: false, data: null, }, - remoteSurvey: { - loading: false, - error: false, - data: null, - }, - financialInitials: { + submittedAnswers: { loading: false, error: false, data: null, }, + answers: {}, + submitted: false, + calculated: false, }; export default function (state = questionnaireInitialState, action) { @@ -42,16 +42,29 @@ export default function (state = questionnaireInitialState, action) { loading: true, error: false, }, + submittedAnswers: { + ...state.submittedAnswers, + loading: true, + error: false, + }, }; case LOAD_QUESTIONNAIRE_SUCCEEDED: return { ...state, buildingInfo: { - data: action.instance, + data: action.instance.buildingInfo, + loading: false, + error: false, + }, + submittedAnswers: { + data: action.instance.submittedAnswers, loading: false, error: false, }, + answers: action.instance.answers, + submitted: action.instance.submitted, + calculated: action.instance.calculated, }; case LOAD_QUESTIONNAIRE_FAILED: @@ -61,35 +74,98 @@ export default function (state = questionnaireInitialState, action) { loading: false, error: action.error, }, + submittedAnswers: { + loading: false, + error: action.error, + }, }; case SUBMIT_QUESTIONNAIRE_REQUESTED: return { ...state, - remoteSurvey: { - ...state.remoteSurvey, + buildingInfo: { + ...state.buildingInfo, + loading: true, + error: false, + }, + submittedAnswers: { + ...state.submittedAnswers, loading: true, error: false, }, }; case SUBMIT_QUESTIONNAIRE_SUCCEEDED: + console.log(action); // eslint-disable-line return { ...state, - remoteSurvey: { - data: action.instance, + buildingInfo: { + data: action.instance.buildingInfo, loading: false, error: false, }, + submittedAnswers: { + data: { + remoteSurvey: action.instance.remoteSurvey, + financialInitials: action.instance.financialInitials, + }, + loading: false, + error: false, + }, + answers: action.instance.answers, + submitted: true, + calculated: false, }; case SUBMIT_QUESTIONNAIRE_FAILED: return { ...state, - remoteSurvey: { + buildingInfo: { + loading: false, + error: action.error, + }, + submittedAnswers: { loading: false, error: action.error, }, + submitted: false, + calculated: false, + }; + + case EDIT_QUESTIONNAIRE_REQUESTED: + return { + ...state, + buildingInfo: { + ...state.buildingInfo, + loading: true, + error: false, + }, + submittedAnswers: { + ...state.submittedAnswers, + loading: true, + error: false, + }, + }; + + case EDIT_QUESTIONNAIRE_SUCCEEDED: + return { + ...state, + buildingInfo: { + data: action.instance.buildingInfo.data, + loading: false, + error: false, + }, + submittedAnswers: { + data: { + remoteSurvey: action.instance.submittedAnswers.data.remoteSurvey, + financialInitials: action.instance.submittedAnswers.data.financialInitials, + }, + loading: false, + error: false, + }, + answers: {}, + submitted: false, + calculated: false, }; case CALCULATE_COST_REQUESTED: @@ -103,13 +179,11 @@ export default function (state = questionnaireInitialState, action) { }; case CALCULATE_COST_SUCCEEDED: + console.log(action); // eslint-disable-line return { ...state, - financialInitials: { - data: action.instance, - loading: false, - error: false, - }, + submitted: false, + calculated: true, }; case CALCULATE_COST_FAILED: diff --git a/src/containers/Questionnaire/sagas.js b/src/containers/Questionnaire/sagas.js index da8db336925f9e47e77d295710b1ad11256b56cc..99cc3eb031ad6ce70682ff37d53a370c874dc5b0 100644 --- a/src/containers/Questionnaire/sagas.js +++ b/src/containers/Questionnaire/sagas.js @@ -5,6 +5,7 @@ import request from '../../utils/request'; import { LOAD_QUESTIONNAIRE_REQUESTED, SUBMIT_QUESTIONNAIRE_REQUESTED, + EDIT_QUESTIONNAIRE_REQUESTED, CALCULATE_COST_REQUESTED, DOWNLOAD_REPORT_REQUESTED, } from './constants'; @@ -14,6 +15,7 @@ import { loadQuestionnaireLFailed, submitQuestionnaireSucceeded, submitQuestionnaireFailed, + editQuestionnaireSucceeded, calculateCostSucceeded, calculateCostFailed, downloadReportSucceeded, @@ -24,47 +26,51 @@ import SagaRequests from '../../utils/sagaRequests'; function* loadQuestionnaire(action) { - const url = `${process.env.REACT_APP_BLOCLINK_URL}/buildings/${action.buildingId}/questionnaire/`; + const url = `${process.env.REACT_APP_BLOCLINK_URL}/buildings/${action.buildingId}/pna/questionnaire/`; yield SagaRequests.get(action, url, loadQuestionnaireSucceeded, loadQuestionnaireLFailed); } function* submitQuestionnaire(action) { - const formData = new FormData(); - Object.keys(action.payload).map(key => formData.append(key, action.payload[key])); - const url = `${process.env.REACT_APP_BLOCLINK_URL}/buildings/${action.buildingId}/questionnaire/`; - + console.log(action); // eslint-disable-line + const url = `${process.env.REACT_APP_BLOCLINK_URL}/buildings/${action.buildingId}/pna/questionnaire/`; const res = yield call( request, SagaRequests.generateURL(url, action), { - method: 'POST', + method: 'PUT', headers: getHeaders(), - body: formData, + body: JSON.stringify(action.payload), } ); if (!res.err) { - yield put(submitQuestionnaireSucceeded(res)); + yield put(submitQuestionnaireSucceeded(Object.assign({}, res, action.payload))); } else { yield put(submitQuestionnaireFailed(res.err)); } } +function* editQuestionnaire(action) { + console.log(action); // eslint-disable-line + yield put(editQuestionnaireSucceeded(action.payload)); +} + function* calculateCost(action) { - const url = `${process.env.REACT_APP_BLOCLINK_URL}/buildings/${action.buildingId}/calculate-cost/`; + const url = `${process.env.REACT_APP_BLOCLINK_URL}/buildings/${action.buildingId}/pna/report/generate/`; yield SagaRequests.get(action, url, calculateCostSucceeded, calculateCostFailed); } function* downloadReport(action) { - const url = `${process.env.REACT_APP_BLOCLINK_URL}/buildings/${action.buildingId}/download-report/`; + const url = `${process.env.REACT_APP_BLOCLINK_URL}/buildings/${action.buildingId}/pna/report/download/`; yield SagaRequests.get(action, url, downloadReportSucceeded, downloadReportFailed); } -function* engWatcher() { +function* questionnaireWatcher() { yield takeEvery(LOAD_QUESTIONNAIRE_REQUESTED, loadQuestionnaire); yield takeEvery(SUBMIT_QUESTIONNAIRE_REQUESTED, submitQuestionnaire); + yield takeEvery(EDIT_QUESTIONNAIRE_REQUESTED, editQuestionnaire); yield takeEvery(CALCULATE_COST_REQUESTED, calculateCost); yield takeEvery(DOWNLOAD_REPORT_REQUESTED, downloadReport); } -export default engWatcher; +export default questionnaireWatcher;
@@ -31,7 +35,11 @@ const RemoteSurvey = (props) => { Heating Fuel Source
- {props.upperFirstLetter(props.data.heatingFuelSource)} + { + props.upperFirstLetter( + props.answers[props.data.heatingFuelSource.answer_id] + ) + }
@@ -79,7 +103,11 @@ const RemoteSurvey = (props) => { Basement heated?
- {props.upperFirstLetter(props.data.basementHeated)} + { + props.upperFirstLetter( + props.answers[props.data.basementHeated.answer_id] + ) + }
@@ -97,7 +129,11 @@ const RemoteSurvey = (props) => { Floors heated?
- {props.upperFirstLetter(props.data.floorsHeated)} + { + props.upperFirstLetter( + props.answers[props.data.floorsHeated.answer_id] + ) + }