Merge pull request 'Add additional feedback during the survey [fix #100]' (#101) from survey/visualfeedback into main
Reviewed-on: #101
This commit is contained in:
commit
b6ec0948e2
3 changed files with 147 additions and 38 deletions
|
@ -162,7 +162,7 @@ def register():
|
||||||
return ret, 409
|
return ret, 409
|
||||||
|
|
||||||
|
|
||||||
@app.route('/umfrage', methods=['POST'])
|
@app.route('/api/protected/umfrage', methods=['POST'])
|
||||||
@flask_praetorian.auth_required
|
@flask_praetorian.auth_required
|
||||||
def survey():
|
def survey():
|
||||||
req = flask.request.get_json(force=True)
|
req = flask.request.get_json(force=True)
|
||||||
|
@ -172,18 +172,66 @@ def survey():
|
||||||
|
|
||||||
# get data from the survey and write it to the database
|
# get data from the survey and write it to the database
|
||||||
|
|
||||||
|
# placeholder if the survey is valid
|
||||||
|
is_survey_valid = True
|
||||||
|
|
||||||
|
# Check age if it's numeric
|
||||||
age = req.get('age', None)
|
age = req.get('age', None)
|
||||||
|
if not age.isnumeric():
|
||||||
|
is_survey_valid = False
|
||||||
|
|
||||||
|
# check gender possibilites
|
||||||
gender = req.get('gender', None)
|
gender = req.get('gender', None)
|
||||||
|
possible_genders = [
|
||||||
|
"male",
|
||||||
|
"female",
|
||||||
|
"divers",
|
||||||
|
"sex_na"
|
||||||
|
]
|
||||||
|
if gender not in possible_genders:
|
||||||
|
is_survey_valid = False
|
||||||
|
|
||||||
|
# check education possibilities
|
||||||
education = req.get('education', None)
|
education = req.get('education', None)
|
||||||
|
possible_education = [
|
||||||
|
"edu_lehre",
|
||||||
|
"edu_gymnasium",
|
||||||
|
"edu_berufsmatura",
|
||||||
|
"edu_bachelor",
|
||||||
|
"edu_Master",
|
||||||
|
"edu_na"
|
||||||
|
]
|
||||||
|
if education not in possible_education:
|
||||||
|
is_survey_valid = False
|
||||||
|
|
||||||
|
# check skills values
|
||||||
skills = req.get('skills', None)
|
skills = req.get('skills', None)
|
||||||
|
possible_skills = [
|
||||||
|
"skills_sehr_gut",
|
||||||
|
"skills_gut",
|
||||||
|
"skills_mittel",
|
||||||
|
"skills_nicht_so_good",
|
||||||
|
"skills_garnicht",
|
||||||
|
"skills_na"
|
||||||
|
]
|
||||||
|
|
||||||
|
if skills not in possible_skills:
|
||||||
|
is_survey_valid = False
|
||||||
|
|
||||||
|
if is_survey_valid:
|
||||||
user_db = User.query.filter_by(id=id_req).first()
|
user_db = User.query.filter_by(id=id_req).first()
|
||||||
user_db.age = age
|
user_db.age = age
|
||||||
user_db.gender = gender
|
user_db.gender = gender
|
||||||
user_db.education = education
|
user_db.education = education
|
||||||
user_db.skills = skills
|
user_db.skills = skills
|
||||||
db.session.commit()
|
db.session.commit()
|
||||||
ret = {'message': 'Umfrage freigestellt'}
|
print(req)
|
||||||
|
ret = {'message': 'Vielen Dank für das Ausfüllen der Umfrage.'}
|
||||||
return ret, 200
|
return ret, 200
|
||||||
|
else:
|
||||||
|
ret = {
|
||||||
|
'message': 'Einige der Felder stimmen nicht überein und müssen angepasst werden.'}
|
||||||
|
return ret, 400
|
||||||
|
|
||||||
|
|
||||||
@app.route('/time')
|
@app.route('/time')
|
||||||
|
|
10
frontend/src/components/ErrorMessage.js
Normal file
10
frontend/src/components/ErrorMessage.js
Normal file
|
@ -0,0 +1,10 @@
|
||||||
|
import React from "react";
|
||||||
|
import "../App.css";
|
||||||
|
|
||||||
|
export default function ErrorMessage(props) {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<p className="errorMessage">{props.message}</p>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
|
@ -6,15 +6,33 @@ import Footer from "../../Footer";
|
||||||
import InputField from "../InputField";
|
import InputField from "../InputField";
|
||||||
import SubmitField from "../SubmitField";
|
import SubmitField from "../SubmitField";
|
||||||
import { authFetch } from "../../auth/AuthProvider";
|
import { authFetch } from "../../auth/AuthProvider";
|
||||||
|
import ErrorMessage from "../ErrorMessage";
|
||||||
|
|
||||||
export default function Umfrage() {
|
export default function Umfrage() {
|
||||||
|
/* values from survey */
|
||||||
const [age, setAge] = useState("");
|
const [age, setAge] = useState("");
|
||||||
const [gender, setGender] = useState("");
|
const [gender, setGender] = useState("");
|
||||||
const [education, setEducation] = useState("");
|
const [education, setEducation] = useState("");
|
||||||
const [skills, setSkills] = useState("");
|
const [skills, setSkills] = useState("");
|
||||||
|
|
||||||
let surveyIsValid = true;
|
/* error messages */
|
||||||
let errorMessage = "";
|
const [ageErrorMessage, setAgeErrorMessage] = useState("");
|
||||||
|
const [genderErrorMessage, setGenderErrorMessage] = useState("");
|
||||||
|
const [educationErrorMessage, setEducationErrorMessage] = useState("");
|
||||||
|
const [skillsErrorMessage, setSkillsErrorMessage] = useState("");
|
||||||
|
|
||||||
|
const [backendErrorMessage, setBackendErrorMessage] = useState("");
|
||||||
|
const [backendSuccessMessage, setBackendSuccessMessage] = useState("");
|
||||||
|
const [isSurveyValidBackend, setIsSurveyValidBackend] = useState("");
|
||||||
|
|
||||||
|
/* boolean if the values are ok */
|
||||||
|
const [isAgeOk, setIsAgeOk] = useState("");
|
||||||
|
const [isGenderOk, setIsGenderOk] = useState("");
|
||||||
|
const [isEducationOk, setIsEducationOk] = useState("");
|
||||||
|
const [isSkillsOk, setIsSkillsOk] = useState("");
|
||||||
|
|
||||||
|
/* genereal check if survey is valid */
|
||||||
|
const [isSurveyValid, setIsSurveyValid] = useState("");
|
||||||
|
|
||||||
const onSubmitClick = (e) => {
|
const onSubmitClick = (e) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
@ -25,32 +43,56 @@ export default function Umfrage() {
|
||||||
skills: skills,
|
skills: skills,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
setIsAgeOk(true);
|
||||||
|
setIsGenderOk(true);
|
||||||
|
setIsEducationOk(true);
|
||||||
|
setIsSkillsOk(true);
|
||||||
|
|
||||||
if (!Number(age)) {
|
if (!Number(age)) {
|
||||||
errorMessage += "age is not a number\n";
|
setAgeErrorMessage("Das Alter muss als Zahl angegeben werden.");
|
||||||
surveyIsValid = false;
|
setIsSurveyValid(false);
|
||||||
|
setIsAgeOk(false);
|
||||||
}
|
}
|
||||||
if (gender === "DEFAULT" || gender === "") {
|
if (gender === "DEFAULT" || gender === "") {
|
||||||
errorMessage += "choose gender\n";
|
setGenderErrorMessage(
|
||||||
surveyIsValid = false;
|
"Bitte wähle eine der Optionen für dein Geschlecht aus."
|
||||||
|
);
|
||||||
|
setIsSurveyValid(false);
|
||||||
|
setIsGenderOk(false);
|
||||||
}
|
}
|
||||||
if (education === "DEFAULT" || education === "") {
|
if (education === "DEFAULT" || education === "") {
|
||||||
errorMessage += "choose edu\n";
|
setEducationErrorMessage(
|
||||||
surveyIsValid = false;
|
"Bitte wähle eine der Optionen zu deiner Ausbildung aus."
|
||||||
|
);
|
||||||
|
setIsSurveyValid(false);
|
||||||
|
setIsEducationOk(false);
|
||||||
}
|
}
|
||||||
if (skills === "DEFAULT" || skills === "") {
|
if (skills === "DEFAULT" || skills === "") {
|
||||||
errorMessage += "choose skills\n";
|
setSkillsErrorMessage(
|
||||||
surveyIsValid = false;
|
"Bitte wähle eine der Optionen zu den Fähigkeiten aus"
|
||||||
|
);
|
||||||
|
setIsSurveyValid(false);
|
||||||
|
setIsSkillsOk(false);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (surveyIsValid === true) {
|
setIsSurveyValid(true);
|
||||||
console.log(opts);
|
if (isSurveyValid === true) {
|
||||||
|
authFetch("/api/protected/umfrage", {
|
||||||
authFetch("/umfrage", {
|
|
||||||
method: "post",
|
method: "post",
|
||||||
body: JSON.stringify(opts),
|
body: JSON.stringify(opts),
|
||||||
|
}).then((response) => {
|
||||||
|
if (response.status === 200) {
|
||||||
|
response.json().then((r) => {
|
||||||
|
setBackendSuccessMessage(r.message);
|
||||||
|
setIsSurveyValidBackend(true);
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
console.log(errorMessage);
|
response.json().then((r) => {
|
||||||
|
setBackendErrorMessage(r.message);
|
||||||
|
setIsSurveyValidBackend(false);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -96,6 +138,7 @@ export default function Umfrage() {
|
||||||
className="input-field"
|
className="input-field"
|
||||||
LabelName="Wie alt bist du? (Alter in Jahren)"
|
LabelName="Wie alt bist du? (Alter in Jahren)"
|
||||||
/>
|
/>
|
||||||
|
{!isAgeOk && <ErrorMessage message={ageErrorMessage} />}
|
||||||
<div className="input-field">
|
<div className="input-field">
|
||||||
<label htmlFor="gender">Welches Geschlecht hast du?</label> <br />
|
<label htmlFor="gender">Welches Geschlecht hast du?</label> <br />
|
||||||
<select
|
<select
|
||||||
|
@ -109,10 +152,11 @@ export default function Umfrage() {
|
||||||
</option>
|
</option>
|
||||||
<option value="male">Männlich</option>
|
<option value="male">Männlich</option>
|
||||||
<option value="female">Weiblich</option>
|
<option value="female">Weiblich</option>
|
||||||
<option value="divers">divers</option>
|
<option value="divers">Divers</option>
|
||||||
<option value="sex_na">Keine Angabe</option>
|
<option value="sex_na">Keine Angabe</option>
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
|
{!isGenderOk && <ErrorMessage message={genderErrorMessage} />}
|
||||||
<div className="input-field">
|
<div className="input-field">
|
||||||
<label htmlFor="education">
|
<label htmlFor="education">
|
||||||
Welches ist deine höchste abgeschlossene Ausbildung?
|
Welches ist deine höchste abgeschlossene Ausbildung?
|
||||||
|
@ -127,14 +171,15 @@ export default function Umfrage() {
|
||||||
<option disabled value="DEFAULT">
|
<option disabled value="DEFAULT">
|
||||||
-- Bitte wähle deine Ausbildung aus --
|
-- Bitte wähle deine Ausbildung aus --
|
||||||
</option>
|
</option>
|
||||||
<option>Berufslehre</option>
|
<option value="edu_lehre">Berufslehre</option>
|
||||||
<option>Gymnasiale Maturität</option>
|
<option value="edu_gymnasium">Gymnasiale Maturität</option>
|
||||||
<option>Berufsmatura</option>
|
<option value="edu_berufsmatura">Berufsmatura</option>
|
||||||
<option>Bachelor</option>
|
<option value="edu_bachelor">Bachelor</option>
|
||||||
<option>Master oder höher</option>
|
<option value="edu_Master">Master oder höher</option>
|
||||||
<option>Keine Angabe</option>
|
<option value="edu_na">Keine Angabe</option>
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
|
{!isEducationOk && <ErrorMessage message={educationErrorMessage} />}
|
||||||
<div className="input-field">
|
<div className="input-field">
|
||||||
<label htmlFor="itskills">
|
<label htmlFor="itskills">
|
||||||
Wie schätzt du deine Kompetenzen im Bereich der Informatik als
|
Wie schätzt du deine Kompetenzen im Bereich der Informatik als
|
||||||
|
@ -150,14 +195,15 @@ export default function Umfrage() {
|
||||||
<option disabled value="DEFAULT">
|
<option disabled value="DEFAULT">
|
||||||
-- Bitte wähle etwas aus --
|
-- Bitte wähle etwas aus --
|
||||||
</option>
|
</option>
|
||||||
<option>Sehr gut</option>
|
<option value="skills_sehr_gut">Sehr gut</option>
|
||||||
<option>Gut</option>
|
<option value="skills_gut">Gut</option>
|
||||||
<option>Mittel</option>
|
<option value="skills_mittel">Mittel</option>
|
||||||
<option>Eher nicht so gut</option>
|
<option value="skills_nicht_so_good">Eher nicht so gut</option>
|
||||||
<option>Gar nicht gut</option>
|
<option value="skills_garnicht">Gar nicht gut</option>
|
||||||
<option>Keine Angabe</option>
|
<option value="skills_na">Keine Angabe</option>
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
|
{!isSkillsOk && <ErrorMessage message={skillsErrorMessage} />}
|
||||||
<SubmitField
|
<SubmitField
|
||||||
InputName="Umfrage abschicken"
|
InputName="Umfrage abschicken"
|
||||||
InputValue="Umfrage abschicken"
|
InputValue="Umfrage abschicken"
|
||||||
|
@ -165,6 +211,11 @@ export default function Umfrage() {
|
||||||
onClick={onSubmitClick}
|
onClick={onSubmitClick}
|
||||||
/>
|
/>
|
||||||
</form>
|
</form>
|
||||||
|
{!isSurveyValidBackend ? (
|
||||||
|
<ErrorMessage message={backendErrorMessage} />
|
||||||
|
) : (
|
||||||
|
<p>{backendSuccessMessage}</p>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
<Footer />
|
<Footer />
|
||||||
</>
|
</>
|
||||||
|
|
Loading…
Reference in a new issue