Merge branch 'unstable' into 'main'
unstable See merge request internship-2025/survey-webapp/survey-webapp!22
This commit is contained in:
commit
7c0ac0c7f2
4 changed files with 30 additions and 12 deletions
|
|
@ -13,4 +13,5 @@
|
||||||
text-align: center;
|
text-align: center;
|
||||||
box-shadow: 0 0 7.4px 0 rgba(154, 202, 247, 1);
|
box-shadow: 0 0 7.4px 0 rgba(154, 202, 247, 1);
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
.settingSurvey{
|
.settingSurvey{
|
||||||
width: 85%;
|
width: 85%;
|
||||||
height: 100vh;
|
min-height: 100vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
.startEndTime{
|
.startEndTime{
|
||||||
|
|
|
||||||
|
|
@ -1,26 +1,40 @@
|
||||||
import React from 'react';
|
import React, {useState} from 'react';
|
||||||
import SurveyInfo from "../SurveyInfo/SurveyInfo.tsx";
|
import SurveyInfo from "../SurveyInfo/SurveyInfo.tsx";
|
||||||
import styles from "./SettingSurvey.module.css";
|
import styles from "./SettingSurvey.module.css";
|
||||||
import TimeEvent from "../TimeEvent/TimeEvent.tsx";
|
import TimeEvent from "../TimeEvent/TimeEvent.tsx";
|
||||||
import SaveButton from "../SaveButton/SaveButton.tsx";
|
import SaveButton from "../SaveButton/SaveButton.tsx";
|
||||||
import {ISurvey} from "../../api/SurveyApi.ts";
|
import {ISurvey} from "../../api/SurveyApi.ts";
|
||||||
import {useOutletContext} from "react-router-dom";
|
import {useLocation, useOutletContext} from "react-router-dom";
|
||||||
|
|
||||||
|
|
||||||
const SettingSurvey: React.FC = () => {
|
const SettingSurvey: React.FC = () => {
|
||||||
|
const location = useLocation();
|
||||||
|
const isSettingCreatePage = location.pathname.includes('/survey/create');
|
||||||
const { survey, setSurvey } = useOutletContext<{
|
const { survey, setSurvey } = useOutletContext<{
|
||||||
survey: ISurvey;
|
survey: ISurvey;
|
||||||
setSurvey: (survey: ISurvey) => void;
|
setSurvey: (survey: ISurvey) => void;
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
|
const [descriptionSurvey, setDescriptionSurvey] = useState('');
|
||||||
|
const [titleSurvey, setTitleSurvey] = useState('');
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={styles.settingSurvey}>
|
<div className={styles.settingSurvey}>
|
||||||
|
{isSettingCreatePage ? (
|
||||||
|
<SurveyInfo
|
||||||
|
titleSurvey={titleSurvey}
|
||||||
|
descriptionSurvey={descriptionSurvey}
|
||||||
|
setDescriptionSurvey={setDescriptionSurvey}
|
||||||
|
setTitleSurvey={setTitleSurvey}
|
||||||
|
/>
|
||||||
|
) : (
|
||||||
<SurveyInfo
|
<SurveyInfo
|
||||||
titleSurvey={survey.title}
|
titleSurvey={survey.title}
|
||||||
descriptionSurvey={survey.description}
|
descriptionSurvey={survey.description}
|
||||||
setDescriptionSurvey={(value) => setSurvey({ ...survey, description: value })}
|
setDescriptionSurvey={(value) => setSurvey({ ...survey, description: value })}
|
||||||
setTitleSurvey={(value) => setSurvey({ ...survey, title: value })}
|
setTitleSurvey={(value) => setSurvey({ ...survey, title: value })}
|
||||||
/>
|
/>
|
||||||
|
)}
|
||||||
<div className={styles.startEndTime}>
|
<div className={styles.startEndTime}>
|
||||||
<TimeEvent title='Время начала'/>
|
<TimeEvent title='Время начала'/>
|
||||||
<TimeEvent title='Время окончания'/>
|
<TimeEvent title='Время окончания'/>
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
|
|
||||||
.timeEvent{
|
.timeEvent{
|
||||||
width: 49%;
|
width: 44%;
|
||||||
padding: 17px 25px 48px 20px;
|
padding: 17px 25px 48px 20px;
|
||||||
background-color: #FFFFFF;
|
background-color: #FFFFFF;
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
|
|
@ -18,19 +18,22 @@
|
||||||
.datetime{
|
.datetime{
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
gap: 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.inputDate{
|
.inputDate{
|
||||||
|
width: fit-content;
|
||||||
border: 3px solid #007AFF26;
|
border: 3px solid #007AFF26;
|
||||||
padding: 12px 107px 12px 21px;
|
padding: 12px 40px 12px 21px;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.inputTime{
|
.inputTime{
|
||||||
|
width: fit-content;
|
||||||
border: 3px solid #007AFF26;
|
border: 3px solid #007AFF26;
|
||||||
padding: 12px 42px;
|
padding: 12px 22px;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue