Tochka
/
legacy
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

completed PsychTest page

This commit is contained in:
Денис Сарапулов 2023-05-17 00:36:03 +10:00
parent c88fa484da
commit b512115444
10 changed files with 316 additions and 231 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
pairent_backend/pairent_app/migrations/0006_alter_user_options_alter_user_about_me_and_more.py
View File

@ -97,7 +97,6 @@ class Migration(migrations.Migration):
('tenth_question', models.IntegerField(validators=[django.core.validators.MaxValueValidator(5)], verbose_name='Ответ на десятый вопрос')), ('tenth_question', models.IntegerField(validators=[django.core.validators.MaxValueValidator(5)], verbose_name='Ответ на десятый вопрос')),
('eleventh_question', models.IntegerField(validators=[django.core.validators.MaxValueValidator(5)], verbose_name='Ответ на одиннадцатый вопрос')), ('eleventh_question', models.IntegerField(validators=[django.core.validators.MaxValueValidator(5)], verbose_name='Ответ на одиннадцатый вопрос')),
('twelfth_question', models.IntegerField(validators=[django.core.validators.MaxValueValidator(5)], verbose_name='Ответ на двенадцатый вопрос')), ('twelfth_question', models.IntegerField(validators=[django.core.validators.MaxValueValidator(5)], verbose_name='Ответ на двенадцатый вопрос')),
('thirteenth_question', models.IntegerField(validators=[django.core.validators.MaxValueValidator(5)], verbose_name='Ответ на тринадцатый вопрос')),
('users', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, to='pairent_app.user', verbose_name='Пользователь')), ('users', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, to='pairent_app.user', verbose_name='Пользователь')),
], ],
), ),

1
pairent_backend/pairent_app/models.py
View File

@ -122,7 +122,6 @@ class PsychTestAnswers(models.Model):
tenth_question = models.IntegerField(validators=[MaxValueValidator(5)], verbose_name="Ответ на десятый вопрос") tenth_question = models.IntegerField(validators=[MaxValueValidator(5)], verbose_name="Ответ на десятый вопрос")
eleventh_question = models.IntegerField(validators=[MaxValueValidator(5)], verbose_name="Ответ на одиннадцатый вопрос") eleventh_question = models.IntegerField(validators=[MaxValueValidator(5)], verbose_name="Ответ на одиннадцатый вопрос")
twelfth_question = models.IntegerField(validators=[MaxValueValidator(5)], verbose_name="Ответ на двенадцатый вопрос") twelfth_question = models.IntegerField(validators=[MaxValueValidator(5)], verbose_name="Ответ на двенадцатый вопрос")
thirteenth_question = models.IntegerField(validators=[MaxValueValidator(5)], verbose_name="Ответ на тринадцатый вопрос")
class Meta: class Meta:
verbose_name = "Ответ на психологический тест" verbose_name = "Ответ на психологический тест"

25
pairent_backend/pairent_app/views.py
View File

@ -98,19 +98,18 @@ class PsychTestAddResultViewSet(viewsets.ViewSet):
results = request.data results = request.data
PsychTestAnswers.objects.create( PsychTestAnswers.objects.create(
user=user, user=user,
first_question=results['first'], first_question=results[0],
second_question=results['second'], second_question=results[1],
third_question=results['third'], third_question=results[2],
fourth_question=results['fourth'], fourth_question=results[3],
fifth_question=results['fifth'], fifth_question=results[4],
sixth_question=results['sixth'], sixth_question=results[5],
seventh_question=results['seventh'], seventh_question=results[6],
eighth_question=results['eighth'], eighth_question=results[7],
nineth_question=results['nineth'], nineth_question=results[8],
tenth_question=results['tenth'], tenth_question=results[9],
eleventh_question=results['eleventh'], eleventh_question=results[10],
twelfth_question=results['twelfth'], twelfth_question=results[11]
thirteenth_question=results['thirteenth']
) )
return Response({'successfully': 'results post'}) return Response({'successfully': 'results post'})

116
pairent_frontend_react/src/components/PsychTestForm/index.jsx Normal file
View File

@ -0,0 +1,116 @@
import PsychTestQuestion from "../PsychTestQuestion";
import React, { useState } from "react";
import PsychTestAddResult from "../../API/PsychTestAddResult";
import { useNavigate } from "react-router-dom";
import "./styles/PsychTestForm.css";
const PsychTestForm = () => {
const [isValid, setIsValid] = useState(true);
const navigate = useNavigate();
const [answers, setAnswers] = useState(new Array(12));
const answerChangeHandler = (answer, account) => {
answers[account] = answer;
setAnswers(answers);
};
const submitHandler = async (event) => {
event.preventDefault();
let isTrue = true;
for (let i = 0; i < 12; i++) {
if (answers[i] == undefined) {
setIsValid(false);
isTrue = false;
}
}
if (isTrue) {
await PsychTestAddResult.addById(1, answers); // 1 - это id пользователя TODO: приделать логин систему
navigate("/");
}
};
return (
<form onSubmit={submitHandler} className="form">
<PsychTestQuestion
name="На сколько Вам важна национальность вашего соседа/соседки?"
account="0"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="Согласны ли Вы делить одну комнату с вашим соседом/соседкой?"
account="1"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="Какое число людей, снимающих квартиру (включая Вас), для вас приемлемо?"
account="2"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="На сколько вам важно такое коммуникативное качество, как общительность, в вашем соседе/соседке?"
account="3"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="На сколько вам важно такое коммуникативное качество, как эмпатия, в вашем соседе/соседке?"
account="4"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="На сколько вам важно такое коммуникативное качество, как доброжелательность, в вашем соседе/соседке?"
account="5"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="На сколько вам важно такое коммуникативное качество, как тактичность, в вашем соседе/соседке?"
account="6"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="На сколько вам важно такое личностное качество, как ответственность, в вашем соседе/соседке?"
account="7"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="На сколько вам важно такое личностное качество, как аккуратность, в вашем соседе/соседке?"
account="8"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="На сколько вам важно такое личностное качество, как честность (искренность) , в вашем соседе/соседке ?"
account="9"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="На сколько вам важно такое личностное качество, как чистоплотность , в вашем соседе/соседке ?"
account="10"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="На сколько вам важна такия черта характера, как трудолюбие , в вашем соседе/соседке ?"
account="11"
onChangeAnswer={answerChangeHandler}
/>
{isValid && (
<div className="btn-box">
<button className="btn-box__form-btn" type="submit">
Отправить
</button>
</div>
)}
{!isValid && (
<div className="btn-box">
<button className="btn-box__form-btn" type="submit">
Отправить
</button>
<p className="btn-box__text">
Вы не ответили на один из вопросов
</p>
</div>
)}
{/* <button type="submit">Отправить</button> */}
</form>
);
};
export default PsychTestForm;

25
pairent_frontend_react/src/components/PsychTestForm/styles/PsychTestForm.css Normal file
View File

@ -0,0 +1,25 @@
.form {
position: relative;
}
.btn-box {
display: flex;
flex-direction: column;
align-items: center;
}
.btn-box__form-btn {
background-color: #007eff;
width: 192px;
height: 33px;
border-radius: 12px;
font-size: 14px;
color: white;
font-weight: 500;
margin-bottom: 10px;
}
.btn-box__text {
color: red;
padding-left: 37.5px;
}

14
pairent_frontend_react/src/components/PsychTestHeader/index.jsx Normal file
View File

@ -0,0 +1,14 @@
import "./styles/PsychTestHeader.css";
const PsychTestHeader = () => {
return (
<div className="header">
<button type="button" className="header__btn">
Вернуться назад
</button>
<h1 className="header__title">Тест на совместимость</h1>
</div>
);
};
export default PsychTestHeader;

22
pairent_frontend_react/src/components/PsychTestHeader/styles/PsychTestHeader.css Normal file
View File

@ -0,0 +1,22 @@
.header {
display: flex;
padding-left: 40px;
padding-top: 14px;
align-items: center;
margin-bottom: 55px;
}
.header__title {
font-size: 20px;
}
.header__btn {
color: #bababa;
font-size: 15px;
width: 180px;
height: 36px;
background-color: white;
border: 1px solid #cccccc;
border-radius: 12px;
margin-right: 13px;
}

100
pairent_frontend_react/src/components/PsychTestQuestion/index.jsx
View File

@ -1,57 +1,63 @@
import React, { useState } from "react"; import React, { useState } from "react";
import "./styles/PsychTestQuestion.css";
const PsychTestQuestion = (props) => { const PsychTestQuestion = (props) => {
const answerChangeHandler = (event) => { const answerChangeHandler = (event) => {
props.onChangeAnswer(event.target.value, event.target.name); props.onChangeAnswer(event.target.value, event.target.name);
}; };
return ( return (
<div> <div className="question">
<label>{props.name}</label> <div className="question__account">{+props.account + 1}</div>
<label> <p className="question__title">{props.name}</p>
<input <div className="question__answers">
name={props.account} <p>Не важно</p>
type="radio" <label className="question__answer">
value="1" <input
onChange={answerChangeHandler} name={props.account}
/> type="radio"
1 value="1"
</label> onChange={answerChangeHandler}
<label> />
<input <span>1</span>
name={props.account} </label>
type="radio" <label className="question__answer">
value="2" <input
onChange={answerChangeHandler} name={props.account}
/> type="radio"
2 value="2"
</label> onChange={answerChangeHandler}
<label> />
<input <span>2</span>
name={props.account} </label>
type="radio" <label className="question__answer">
value="3" <input
onChange={answerChangeHandler} name={props.account}
/> type="radio"
3 value="3"
</label> onChange={answerChangeHandler}
<label> />
<input <span>3</span>
name={props.account} </label>
type="radio" <label className="question__answer">
value="4" <input
onChange={answerChangeHandler} name={props.account}
/> type="radio"
4 value="4"
</label> onChange={answerChangeHandler}
<label> />
<input <span>4</span>
name={props.account} </label>
type="radio" <label className="question__answer">
value="5" <input
onChange={answerChangeHandler} name={props.account}
/> type="radio"
5 value="5"
</label> onChange={answerChangeHandler}
/>
<span>5</span>
</label>
<p>Очень важно</p>
</div>
</div> </div>
); );
}; };

68
pairent_frontend_react/src/components/PsychTestQuestion/styles/PsychTestQuestion.css Normal file
View File

@ -0,0 +1,68 @@
.question {
padding-top: 4px;
position: relative;
display: flex;
flex-direction: column;
align-items: center;
margin: 0 auto;
width: 799px;
min-height: 151px;
border-bottom: 1px solid #cccccc;
margin-bottom: 34.5px;
}
.question__account {
color: #cccccc;
position: absolute;
top: 0px;
left: 0;
display: flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
border: 2px solid #cccccc;
border-radius: 100px;
}
.question__answers input {
width: 16px;
height: 16px;
}
.question__title {
margin-bottom: 80px;
text-align: center;
width: 638px;
font-size: 16px;
margin-right: 0;
}
.question__answers {
display: flex;
margin-bottom: 29.5px;
}
.question__answers p,
span {
font-size: 14px;
}
.question__answer {
position: relative;
}
.question__answer span {
position: absolute;
top: -17px;
left: 3.5px;
}
.question__answers input,
p {
margin-right: 32px;
}
.question__answers *:last-child {
margin-right: 0;
}

175
pairent_frontend_react/src/pages/PsychTest/index.jsx
View File

@ -1,175 +1,12 @@
import PsychTestQuestion from "../../components/PsychTestQuestion"; import PsychTestForm from "../../components/PsychTestForm";
import React, { useState } from "react"; import PsychTestHeader from "../../components/PsychTestHeader";
import PsychTestAddResult from "../../API/PsychTestAddResult";
import { useNavigate } from "react-router-dom";
const PsychTest = () => { const PsychTest = () => {
const navigate = useNavigate();
const [answers, setAnswers] = useState({
first: 0,
second: 0,
third: 0,
fourth: 0,
fifth: 0,
sixth: 0,
seventh: 0,
eighth: 0,
nineth: 0,
tenth: 0,
eleventh: 0,
twelfth: 0,
thirteenth: 0,
});
// TODO: Может как-то изменить, а то я сидел и тупил только не ругайте
const answerChangeHandler = (answer, account) => {
if (account == "first") {
setAnswers((previous) => ({
...previous,
first: answer,
}));
} else if (account == "second") {
setAnswers((previous) => ({
...previous,
second: answer,
}));
} else if (account == "third") {
setAnswers((previous) => ({
...previous,
third: answer,
}));
} else if (account == "fourth") {
setAnswers((previous) => ({
...previous,
fourth: answer,
}));
} else if (account == "fifth") {
setAnswers((previous) => ({
...previous,
fifth: answer,
}));
} else if (account == "sixth") {
setAnswers((previous) => ({
...previous,
sixth: answer,
}));
} else if (account == "seventh") {
setAnswers((previous) => ({
...previous,
seventh: answer,
}));
} else if (account == "eight") {
setAnswers((previous) => ({
...previous,
eight: answer,
}));
} else if (account == "nineth") {
setAnswers((previous) => ({
...previous,
nineth: answer,
}));
} else if (account == "tenth") {
setAnswers((previous) => ({
...previous,
tenth: answer,
}));
} else if (account == "eleventh") {
setAnswers((previous) => ({
...previous,
eleventh: answer,
}));
} else if (account == "twelfth") {
setAnswers((previous) => ({
...previous,
twelfth: answer,
}));
} else if (account == "thirteenth") {
setAnswers((previous) => ({
...previous,
thirteenth: answer,
}));
}
};
const submitHandler = async (event) => {
event.preventDefault();
const result = await PsychTestAddResult.addById(1, answers); // 1 - это id пользователя
console.log(result);
navigate("/");
};
return ( return (
<div> <>
<h1>Название теста</h1> <PsychTestHeader />
<form onSubmit={submitHandler}> <PsychTestForm />
<PsychTestQuestion </>
name="Название вопроса 1"
account="first"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="Название вопроса 2"
account="second"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="Название вопроса 3"
account="third"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="Название вопроса 4"
account="fourth"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="Название вопроса 5"
account="fifth"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="Название вопроса 6"
account="sixth"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="Название вопроса 7"
account="seventh"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="Название вопроса 8"
account="eighth"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="Название вопроса 9"
account="nineth"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="Название вопроса 10"
account="tenth"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="Название вопроса 11"
account="eleventh"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="Название вопроса 12"
account="twelfth"
onChangeAnswer={answerChangeHandler}
/>
<PsychTestQuestion
name="Название вопроса 13"
account="thirteenth"
onChangeAnswer={answerChangeHandler}
/>
<button type="submit">Отправить</button>
</form>
</div>
); );
}; };