Merge pull request 'Infra/Update Dockerfiles' (#59) from infra/update-dockerfiles into main
This commit is contained in:
commit
73a0c2bdd4
|
|
@ -1,12 +1,13 @@
|
|||
FROM python
|
||||
|
||||
WORKDIR /opt/demo/
|
||||
WORKDIR /app
|
||||
|
||||
RUN apt-get -y update && apt-get -y upgrade
|
||||
|
||||
COPY requirements.txt .
|
||||
|
||||
RUN apt-get -y update && apt-get -y upgrade
|
||||
RUN pip install -r requirements.txt
|
||||
|
||||
COPY /src .
|
||||
|
||||
CMD [ "python", "main.py" ]
|
||||
CMD [ "python", "app.py" ]
|
||||
|
|
|
|||
|
|
@ -8,3 +8,15 @@ services:
|
|||
dockerfile: Dockerfile.prod
|
||||
ports:
|
||||
- 8877:80
|
||||
backend-prod:
|
||||
container_name: backend_bt
|
||||
build:
|
||||
context: ./backend
|
||||
dockerfile: Dockerfile.prod
|
||||
ports:
|
||||
- 5000:5000
|
||||
environment:
|
||||
DEBUG: "no"
|
||||
PORT: 5000
|
||||
HOST: "0.0.0.0"
|
||||
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@ import Login from "./components/pages/Login";
|
|||
import Register from "./components/pages/Register";
|
||||
import Manual from "./components/pages/Manual";
|
||||
import Secret from "./components/pages/Secret";
|
||||
import Umfrage from "./components/pages/Umfrage";
|
||||
import PrivateRoute from "./auth/PrivateRoute";
|
||||
|
||||
function App() {
|
||||
|
|
@ -27,6 +28,7 @@ function App() {
|
|||
<Route path="/manual" component={Manual} />
|
||||
<Route path="/ueber" component={Ueber} />
|
||||
<PrivateRoute path="/secret" component={Secret} />
|
||||
<PrivateRoute path="/umfrage" component={Umfrage} />
|
||||
</Switch>
|
||||
</Router>
|
||||
</>
|
||||
|
|
|
|||
|
|
@ -1,12 +1,15 @@
|
|||
.input-field {
|
||||
width: auto;
|
||||
margin-bottom: 2em;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.input-field p {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.input-field input {
|
||||
.input-field input,
|
||||
.input-field select {
|
||||
width: 100%;
|
||||
border-color: var(--primary);
|
||||
background-color: var(--secondary);
|
||||
|
|
@ -27,3 +30,7 @@
|
|||
.input-field input[type="submit"]:hover {
|
||||
background-color: var(--primary-contr);
|
||||
}
|
||||
|
||||
.input-field label {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
152
frontend/src/components/pages/Umfrage.js
Normal file
152
frontend/src/components/pages/Umfrage.js
Normal file
|
|
@ -0,0 +1,152 @@
|
|||
import React from "react";
|
||||
import { useState } from "react/cjs/react.development";
|
||||
import "../../App.css";
|
||||
import "../Input.css";
|
||||
import Footer from "../../Footer";
|
||||
import InputField from "../InputField";
|
||||
import SubmitField from "../SubmitField";
|
||||
|
||||
export default function Umfrage() {
|
||||
const [age, setAge] = useState("");
|
||||
const [gender, setGender] = useState("");
|
||||
const [education, setEducation] = useState("");
|
||||
const [skills, setSkills] = useState("");
|
||||
|
||||
const onSubmitClick = (e) => {
|
||||
e.preventDefault();
|
||||
let opts = {
|
||||
age: age,
|
||||
gender: gender,
|
||||
education: education,
|
||||
skills: skills,
|
||||
};
|
||||
console.log(opts);
|
||||
/*fetch("/api/login", {
|
||||
method: "post",
|
||||
body: JSON.stringify(opts),
|
||||
})
|
||||
.then((r) => r.json())
|
||||
.then((token) => {
|
||||
if (token.access_token) {
|
||||
login(token);
|
||||
} else {
|
||||
console.log("Please type in the correct username / password");
|
||||
}
|
||||
});
|
||||
*/
|
||||
};
|
||||
|
||||
const handleAgeChange = (e) => {
|
||||
setAge(e.target.value);
|
||||
};
|
||||
|
||||
const handleGenderChange = (e) => {
|
||||
setGender(e.target.value);
|
||||
};
|
||||
|
||||
const handleEducationChange = (e) => {
|
||||
setEducation(e.target.value);
|
||||
};
|
||||
|
||||
const handleSkillsChange = (e) => {
|
||||
setSkills(e.target.value);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="sitePage">
|
||||
<h1> Umfrage</h1>
|
||||
<p>
|
||||
Damit ich etwas über die Studienteilnehmenden erfahre, möchte ich hier
|
||||
eine kurze Erhebung einiger wichtiger Daten machen. Die Daten werden
|
||||
natürlich nicht genauer verfolgt und die Auswertung der biometrischen
|
||||
Verhaltensmerkmale geschieht unabhängig davon. Konkret bedeutet das,
|
||||
dass ich deine Angaben nicht mit den Informationen aus den
|
||||
Verhaltensmerkmalen zusammenfliessen lasse.
|
||||
</p>
|
||||
<p>
|
||||
Die Umfrage dauert nur ca. 2 Minuten und nach der ersten Befragung
|
||||
musst du diese auch nicht mehr ausfüllen, da ich dann eine ungefähre
|
||||
Auswertung machen kann, wie sich die Studienteilnehmenden aufteilen.
|
||||
So kann es für mich beispielsweise relevant sein, wenn sämtliche
|
||||
Teilnehmenden ein sehr gutes Informatikverständnis haben.
|
||||
</p>
|
||||
<form id="umfrage" onClick={onSubmitClick}>
|
||||
<InputField
|
||||
InputType="number"
|
||||
onChange={handleAgeChange}
|
||||
LabelName="Wie alt bist du? (Alter in Jahren)"
|
||||
/>
|
||||
<div className="input-field">
|
||||
<label htmlFor="gender">Welches Geschlecht hast du?</label> <br />
|
||||
<select
|
||||
name="gender"
|
||||
id="gender"
|
||||
onChange={handleGenderChange}
|
||||
defaultValue="DEFAULT"
|
||||
>
|
||||
<option disabled value="DEFAULT">
|
||||
-- Bitte wähle etwas aus --{" "}
|
||||
</option>
|
||||
<option value="male">Männlich</option>
|
||||
<option value="female">Weiblich</option>
|
||||
<option value="divers">divers</option>
|
||||
<option value="sex_na">Keine Angabe</option>
|
||||
</select>
|
||||
</div>
|
||||
<div className="input-field">
|
||||
<label htmlFor="education">
|
||||
Welches ist deine höchste abgeschlossene Ausbildung?
|
||||
</label>
|
||||
<br />
|
||||
<select
|
||||
name="education"
|
||||
id="education"
|
||||
onChange={handleEducationChange}
|
||||
defaultValue="DEFAULT"
|
||||
>
|
||||
<option disabled value="DEFAULT">
|
||||
-- Bitte wähle deine Ausbildung aus --
|
||||
</option>
|
||||
<option>Berufslehre</option>
|
||||
<option>Gymnasiale Maturität</option>
|
||||
<option>Berufsmatura</option>
|
||||
<option>Bachelor</option>
|
||||
<option>Master oder höher</option>
|
||||
<option>Keine Angabe</option>
|
||||
</select>
|
||||
</div>
|
||||
<div className="input-field">
|
||||
<label htmlFor="itskills">
|
||||
Wie schätzt du deine Kompetenzen im Bereich der Informatik als
|
||||
Anwender ein?
|
||||
</label>
|
||||
<br />
|
||||
<select
|
||||
name="itskills"
|
||||
id="itskills"
|
||||
onChange={handleSkillsChange}
|
||||
defaultValue="DEFAULT"
|
||||
>
|
||||
<option disabled value="DEFAULT">
|
||||
-- Bitte wähle etwas aus --
|
||||
</option>
|
||||
<option>Sehr gut</option>
|
||||
<option>Gut</option>
|
||||
<option>Mittel</option>
|
||||
<option>Eher nicht so gut</option>
|
||||
<option>Gar nicht gut</option>
|
||||
<option>Keine Angabe</option>
|
||||
</select>
|
||||
</div>
|
||||
<SubmitField
|
||||
InputName="Umfrage abschicken"
|
||||
InputValue="Umfrage abschicken"
|
||||
LabelName="Umfrage abschicken"
|
||||
/>
|
||||
</form>
|
||||
</div>
|
||||
<Footer />
|
||||
</>
|
||||
);
|
||||
}
|
||||
Loading…
Reference in a new issue