This commit is contained in:
Mikola 2024-01-12 19:11:36 +03:00
parent cc0f76ea8d
commit a24ce7d7a1
8 changed files with 67 additions and 32 deletions

View File

@ -44,12 +44,7 @@ const AllTaskTableItem = ({ task, projects }) => {
</div> </div>
</td> </td>
<td> <td>
{task.timers.map((item) => { {new Date(task.timers.reduce((acc, cur) => acc + cur.deltaSeconds, 0) * 1000).toISOString().slice(11, 19)}
let time = new Date(item.deltaSeconds * 1000)
.toISOString()
.slice(11, 19);
return `${time}`;
})}
</td> </td>
<td>{new Date(task.created_at).toLocaleDateString()}</td> <td>{new Date(task.created_at).toLocaleDateString()}</td>
<td>{new Date(task.dead_line).toLocaleDateString()}</td> <td>{new Date(task.dead_line).toLocaleDateString()}</td>

View File

@ -9,23 +9,16 @@ const ArchiveTasksItem = ({ task, index }) => {
<tr key={index}> <tr key={index}>
<td className="archive__completeTask__description"> <td className="archive__completeTask__description">
<p className="completeTask__title">{task.title}</p> <p className="completeTask__title">{task.title}</p>
<p {/*<p*/}
className="date" {/* className="date"*/}
dangerouslySetInnerHTML={{ {/* dangerouslySetInnerHTML={{*/}
__html: task.description {/* __html: task.description*/}
}} {/* }}*/}
/> {/*/>*/}
</td> </td>
<td className="archive__completeTask__time"> <td className="archive__completeTask__time">
<p> <p>
{task.timers.length == 0 {new Date(task.timers.reduce((acc, cur) => acc + cur.deltaSeconds, 0) * 1000).toISOString().slice(11, 19)}
? "-"
: task.timers.map((item) => {
let time = new Date(item.deltaSeconds * 1000)
.toISOString()
.slice(11, 19);
return `${time}`;
})}
</p> </p>
</td> </td>
<td className="archive__completeTask__info"> <td className="archive__completeTask__info">

View File

@ -0,0 +1,10 @@
.completeTask__title {
white-space: nowrap;
max-width: 250px;
text-overflow: ellipsis;
overflow: hidden;
}
.archive__completeTask__time {
text-align: center;
}

View File

@ -1,20 +1,33 @@
.archive { .archive {
&__table { &__table {
margin: 29px 0 0 0; margin: 29px 0 0 0;
height: 67px; display: flex;
flex-direction: column;
width: 100%; width: 100%;
font-size: 14px; font-size: 14px;
font-weight: 400; font-weight: 400;
thead { thead {
display: flex;
background: #f1f1f1; background: #f1f1f1;
color: #5b6871; color: #5b6871;
border-radius: 12px; border-radius: 12px;
height: 65px;
background: #f1f1f1; background: #f1f1f1;
color: #5b6871; color: #5b6871;
tr {
display: grid;
padding: 20px 10px 11px;
grid-template-columns: 40% 20% 40%;
width: 100%;
}
th { th {
display: flex;
text-align: center;
color: #5B6871;
line-height: 32px;
font-size: 14px;
&:first-child { &:first-child {
padding-left: 10px; padding-left: 10px;
border-top-left-radius: 12px; border-top-left-radius: 12px;
@ -28,9 +41,28 @@
} }
tbody { tbody {
display: grid;
max-height: 600px;
overflow-y: auto;
color: #000; color: #000;
&::-webkit-scrollbar {
width: 5px;
border-radius: 10px;
}
&::-webkit-scrollbar-thumb {
background: #cbd9f9;
border-radius: 5px;
}
tr { tr {
display: grid;
height: 65px;
align-items: center;
background-color: white; background-color: white;
grid-template-columns: 40% 20% 40%;
border-bottom: 1px solid rgba(241, 241, 241, 1);
&:nth-child(2n) { &:nth-child(2n) {
background-color: rgba(241, 241, 241, 0.23); background-color: rgba(241, 241, 241, 0.23);
@ -38,8 +70,7 @@
} }
td { td {
height: 65px; display: flex;
border-bottom: 1px solid rgba(241, 241, 241, 1);
&:first-child { &:first-child {
max-width: 275px; max-width: 275px;

View File

@ -22,7 +22,6 @@
&__main { &__main {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center;
width: 65%; width: 65%;
@media (max-width: 1106px) { @media (max-width: 1106px) {
@ -35,7 +34,7 @@
font-size: 35px; font-size: 35px;
line-height: 32px; line-height: 32px;
display: flex; display: flex;
justify-content: space-between; justify-content: center;
margin: 0; margin: 0;
@media (max-width: 960px) { @media (max-width: 960px) {
@ -162,7 +161,7 @@
&__about { &__about {
border-left: 1px solid #cdcdcd; border-left: 1px solid #cdcdcd;
padding: 0 20px 0 10px; padding: 0 20px 0 25px;
margin: 0 0 0 10px; margin: 0 0 0 10px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;

View File

@ -4,7 +4,7 @@ import close from "assets/icons/closeProjectPersons.svg";
import "./modalTrackerRegistration.scss"; import "./modalTrackerRegistration.scss";
export const ModalTrackerRegistration = ({ setModalReset }) => { export const ModalTrackerRegistration = ({ setModalReset, email }) => {
return ( return (
<div className="modalConfirmTracker"> <div className="modalConfirmTracker">
<h3 className="modalConfirmTracker__title"> <h3 className="modalConfirmTracker__title">
@ -14,9 +14,9 @@ export const ModalTrackerRegistration = ({ setModalReset }) => {
Мы отправили ссылку Мы отправили ссылку
<br /> <br />
для активации вашего аккаунта на почту для активации вашего аккаунта на почту
<br /> <span>nhw44308@mail.com</span> <br /> <span>{email}</span>
</p> </p>
<button className="modalConfirmTracker__btn">Перейти в почту</button> <button onClick={() => setModalReset(false)} className="modalConfirmTracker__btn">Понятно</button>
<img <img
onClick={() => setModalReset(false)} onClick={() => setModalReset(false)}
src={close} src={close}

View File

@ -131,6 +131,7 @@
width: 100%; width: 100%;
background: #ffffff; background: #ffffff;
padding: 27px 0 29px; padding: 27px 0 29px;
margin-bottom: 50px;
&__wrapper { &__wrapper {
max-width: 1160px; max-width: 1160px;

View File

@ -14,6 +14,9 @@ import "./trackerRegistration.scss";
export const TrackerRegistration = () => { export const TrackerRegistration = () => {
const [modalConfirmOpen, setModalConfirm] = useState(false); const [modalConfirmOpen, setModalConfirm] = useState(false);
const [inputs, setInputs] = useState({
email: ''
})
return ( return (
<div className="trackerRegistration"> <div className="trackerRegistration">
@ -36,7 +39,10 @@ export const TrackerRegistration = () => {
</div> </div>
<div className="trackerRegistration__inputContainer"> <div className="trackerRegistration__inputContainer">
<span>Ваш e-mail</span> <span>Ваш e-mail</span>
<input placeholder="E-mail" type="email" /> <input
placeholder="E-mail"
onChange={(e) => setInputs((prevState) => ({...prevState, email:e.target.value }))}
type="email" />
</div> </div>
<div className="trackerRegistration__inputContainer"> <div className="trackerRegistration__inputContainer">
<span>Придумайте пароль</span> <span>Придумайте пароль</span>
@ -66,7 +72,7 @@ export const TrackerRegistration = () => {
</div> </div>
{modalConfirmOpen && ( {modalConfirmOpen && (
<ModalLayout active={modalConfirmOpen} setActive={setModalConfirm}> <ModalLayout active={modalConfirmOpen} setActive={setModalConfirm}>
<ModalTrackerRegistration setModalReset={setModalConfirm} /> <ModalTrackerRegistration setModalReset={setModalConfirm} email={inputs.email} />
</ModalLayout> </ModalLayout>
)} )}
<Footer /> <Footer />