apuc/guild_front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

tracker fixes

Browse Source
This commit is contained in:
Николай Полтщук
2023-07-07 00:46:40 +03:00
parent e6689c315d
commit 7f0dc9612b
14 changed files with 226 additions and 97 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/components/AuthBox/authBox.scss
View File

@ -133,13 +133,14 @@
text-align: center;
border: 2px solid #6aaf5c;
margin-right: 1.5rem;
transition: 0.3s;
&:hover {
background-image: none;
background-color: #ffffff;
border: 2px solid #6aaf5c;
color: #6aaf5c !important;
transition: 0.3s;
transform: scale(1.03);
//background-image: none;
//background-color: #ffffff;
//border: 2px solid #6aaf5c;
//color: #6aaf5c !important;
.loader * {
fill: #6aaf5c;

10
src/components/Common/Loader/loader.scss
View File

@ -6,9 +6,9 @@
align-items: center;
position: relative;
&:hover {
path {
fill: #6aaf5c;
}
}
//&:hover {
// path {
// fill: #6aaf5c;
// }
//}
}

51
src/components/Common/ModalLayout/modalLayout.scss
View File

@ -15,11 +15,60 @@
position: relative;
background: linear-gradient(180deg, #ffffff 0%, #ebebeb 100%);
border-radius: 24px;
padding: 60px 60px 30px 60px;
padding: 20px 40px 30px 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.selectPerson {
align-items: start;
&__info {
font-size: 15px;
font-weight: 300;
margin: 12px 0 20px;
}
}
.invite__blocks {
display: flex;
column-gap: 20px;
span {
margin-top: 8px;
font-size: 15px;
font-weight: 300;
}
.invitePersonBlock {
display: flex;
flex-direction: column;
row-gap: 20px;
&__input {
margin: 0;
min-width: 320px;
height: 42px;
input {
height: 42px;
}
}
&__btn {
margin: 0 auto 0 0;
max-width: 242px;
width: 100%;
}
}
}
.select__person {
display: flex;
flex-direction: column;
row-gap: 10px;
padding: 39px 10px 29px 10px;
}
}
}

6
src/components/Modal/Tracker/ModalTicket/ModalTicket.jsx
View File

@ -363,9 +363,9 @@ export const ModalTiсket = ({
</h3>
<div className="content__task">
<span>Задача</span>
{editOpen ? (
<input
maxLength="100"
value={inputsValue.title}
onChange={(e) => {
setInputsValue((prevValue) => ({
@ -463,8 +463,8 @@ export const ModalTiсket = ({
</div>
<div className="workers">
<div className="workers_box task__info">
<span className="exit" onClick={() => setActive(false)}></span>
<span className="nameProject">{task.title}</span>
<span className="exit" onClick={() => setActive(false)}>
</span>
<p className="workers__creator">Создатель : {task.user?.fio}</p>
{executor ? (

27
src/components/Modal/Tracker/ModalTicket/modalTicket.scss
View File

@ -33,6 +33,9 @@
display: flex;
align-items: center;
flex-direction: row;
color: #1458DD;
font-weight: 700;
font-size: 22px;
&__category {
margin-right: 17px;
@ -104,9 +107,9 @@
h5 {
font-family: "Inter", sans-serif;
font-weight: 500;
font-weight: 600;
font-style: normal;
font-size: 16px;
font-size: 19px;
line-height: 24px;
color: #1a1919;
margin-bottom: 0;
@ -280,7 +283,7 @@
&__description {
display: flex;
flex-direction: column;
margin-top: 10px;
margin-top: 12px;
textarea {
min-height: 120px;
@ -405,6 +408,7 @@
display: flex;
flex-direction: column;
font-size: 14px;
margin-top: 8px;
&__list {
display: flex;
@ -420,13 +424,17 @@
.exit {
cursor: pointer;
position: absolute;
top: 35px;
right: 40px;
top: 25px;
right: 30px;
width: 13px;
height: 13px;
display: flex;
align-items: center;
justify-content: center;
&:before,
&:after {
content: "";
position: absolute;
width: 16px;
height: 2px;
background: #263238;
@ -459,6 +467,7 @@
align-items: center;
position: relative;
margin-bottom: 5px;
margin-top: 12px;
span {
color: #000000;
@ -552,6 +561,7 @@
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
margin-bottom: 8px;
span {
margin-left: 5px;
@ -585,7 +595,6 @@
.task__info {
display: flex;
flex-direction: column;
row-gap: 5px;
.delete {
cursor: pointer;
@ -669,6 +678,10 @@
align-items: center;
padding-left: 10px;
img {
width: 11px;
}
p {
margin: 0 0 0 12px;
}

9
src/components/Modal/Tracker/TicketFullScreen/TicketFullScreen.jsx
View File

@ -24,8 +24,7 @@ import { ProfileBreadcrumbs } from "@components/ProfileBreadcrumbs/ProfileBreadc
import { ProfileHeader } from "@components/ProfileHeader/ProfileHeader";
import TrackerTaskComment from "@components/TrackerTaskComment/TrackerTaskComment";
import archive from "assets/icons/archive.svg";
import archive2 from "assets/icons/archive.svg";
import archive from "assets/images/archiveIcon.png";
import arrow from "assets/icons/arrows/arrowCalendar.png";
import arrowStart from "assets/icons/arrows/arrowStart.png";
import close from "assets/icons/close.png";
@ -412,7 +411,7 @@ export const TicketFullScreen = () => {
<>
<div className="tracker__tabs__content content-tabs">
<div className="tasks__head">
<div className="tasks__head__wrapper">
<div className="tasks__head__wrapper tasks__head__wrapper__fullScreen">
<h5>Проект : {projectInfo.name}</h5>
<TrackerModal
@ -518,9 +517,9 @@ export const TicketFullScreen = () => {
<div className="modal-tiket__content ticket">
<div className="content ticket-whith">
<div className="content__task">
<span>Задача</span>
{editOpen ? (
<input
maxLength="100"
value={inputsValue.title}
onChange={(e) => {
setInputsValue((prevValue) => ({
@ -810,7 +809,7 @@ export const TicketFullScreen = () => {
<p onClick={copyTicketLink}>ссылка на задачу</p>
</div>
<div>
<img src={archive2} alt="arch"></img>
<img src={archive} alt="arch"></img>
<p>в архив</p>
</div>
<div onClick={deleteTask}>

128
src/components/Modal/Tracker/TrackerModal/TrackerModal.jsx
View File

@ -53,7 +53,7 @@ export const TrackerModal = ({
const [valueColumn, setValueColumn] = useState("");
const [nameProject, setNameProject] = useState("");
const [valueTiket, setValueTiket] = useState("");
const [descriptionTicket, setDescriptionTicket] = useState("Описание задачи");
const [descriptionTicket, setDescriptionTicket] = useState("");
const [workers, setWorkers] = useState([]);
const [selectWorkersOpen, setSelectWorkersOpen] = useState(false);
const [selectedWorker, setSelectedWorker] = useState(null);
@ -271,62 +271,78 @@ export const TrackerModal = ({
// }}
>
{modalType === "addWorker" && (
<div>
<div className="title-project">
<h4>Добавьте участника</h4>
{/*<div className="input-container">*/}
{/* <input*/}
{/* className="name-project"*/}
{/* value={emailWorker}*/}
{/* onChange={(e) => setEmailWorker(e.target.value)}*/}
{/* />*/}
{/*</div>*/}
<div
className={
selectWorkersOpen ? "select__worker open" : "select__worker"
}
onClick={() => setSelectWorkersOpen(!selectWorkersOpen)}
>
<p>
{selectedWorker
? selectedWorker.employee.fio
: "Выберите пользователя"}
</p>
<img className="arrow" src={arrowDown} alt="arrow" />
{Boolean(selectWorkersOpen) && (
<div className="select__worker__dropDown">
{Boolean(workers.length) ? (
workers.map((worker) => {
if (worker === selectedWorker) {
return;
}
return (
<div
className="worker"
key={worker.id}
onClick={() => {
setSelectedWorker(worker);
}}
>
<p>{worker.employee.fio}</p>
<img
src={urlForLocal(worker.employee.avatar)}
alt="avatar"
/>
</div>
);
})
) : (
<div>Нет пользователей</div>
)}
<>
<div className='select__person'>
<div className="title-project selectPerson">
<h4>Добавьте участника</h4>
{/*<div className="input-container">*/}
{/* <input*/}
{/* className="name-project"*/}
{/* value={emailWorker}*/}
{/* onChange={(e) => setEmailWorker(e.target.value)}*/}
{/* />*/}
{/*</div>*/}
<p className='selectPerson__info'>Выберите пользователя в проекте или добавьте по e- mail</p>
<div className='invite__blocks'>
<div className='addPersonBlock'>
<div
className={
selectWorkersOpen ? "select__worker open" : "select__worker"
}
onClick={() => setSelectWorkersOpen(!selectWorkersOpen)}
>
<p>
{selectedWorker
? selectedWorker.employee.fio
: "Выберите пользователя"}
</p>
<img className="arrow" src={arrowDown} alt="arrow" />
{Boolean(selectWorkersOpen) && (
<div className="select__worker__dropDown">
{Boolean(workers.length) ? (
workers.map((worker) => {
if (worker === selectedWorker) {
return;
}
return (
<div
className="worker"
key={worker.id}
onClick={() => {
setSelectedWorker(worker);
}}
>
<p>{worker.employee.fio}</p>
<img
src={urlForLocal(worker.employee.avatar)}
alt="avatar"
/>
</div>
);
})
) : (
<div>Нет пользователей</div>
)}
</div>
)}
</div>
<BaseButton styles={"button-add addPersonBtn"} onClick={addUserToProject}>
Добавить
</BaseButton>
</div>
)}
<span>или</span>
<div className='invitePersonBlock'>
<div className='input-container invitePersonBlock__input'>
<input className="name-project" placeholder='email' type="email" />
</div>
<BaseButton styles={"button-add invitePersonBlock__btn"}>
Отправить приглашение
</BaseButton>
</div>
</div>
</div>
</div>
<BaseButton styles={"button-add"} onClick={addUserToProject}>
Добавить
</BaseButton>
</div>
</>
)}
{modalType === "createTiketProject" && (
<>
@ -334,6 +350,7 @@ export const TrackerModal = ({
<h4>Введите название и описание задачи</h4>
<div className="input-container">
<input
maxLength="100"
className="name-project"
value={valueTiket}
onChange={(e) => setValueTiket(e.target.value)}
@ -355,6 +372,7 @@ export const TrackerModal = ({
"blockQuote",
],
removePlugins: ["BlockQuote"],
placeholder: "Описание задачи"
}}
onChange={(event, editor) => {
const data = editor.getData();
@ -443,6 +461,7 @@ export const TrackerModal = ({
<h4>{titleProject}</h4>
<div className="input-container">
<input
maxLength="30"
className="name-project"
value={nameProject}
onChange={(e) => setNameProject(e.target.value)}
@ -477,6 +496,7 @@ export const TrackerModal = ({
<h4>Введите название колонки</h4>
<div className="input-container">
<input
maxLength="100"
className="name-project"
value={valueColumn}
onChange={(e) => setValueColumn(e.target.value)}

28
src/components/Modal/Tracker/TrackerModal/trackerModal.scss
View File

@ -30,7 +30,6 @@
display: flex;
align-items: center;
flex-direction: column;
margin: 0 0 15px 0;
row-gap: 5px;
.select-priority {
@ -79,7 +78,7 @@
}
.input-container {
width: 320px;
width: 100%;
height: 35px;
background: #ffffff;
border-radius: 8px;
@ -91,7 +90,7 @@
}
.ck-editor {
max-width: 320px;
width: 100%;
}
.ck-editor__editable.ck-rounded-corners {
@ -104,6 +103,10 @@
border-radius: 8px 8px 0 0 !important;
}
.ck-placeholder {
display: block !important;
}
.ck-content {
border: none !important;
border-radius: 0 0 8px 8px !important;
@ -111,7 +114,7 @@
}
.select__executor {
width: 320px;
width: 100%;
background: white;
border-radius: 8px;
margin: 5px 0;
@ -215,6 +218,7 @@
cursor: pointer;
position: relative;
min-width: 320px;
height: 42px;
width: 100%;
p {
@ -237,7 +241,7 @@
position: absolute;
width: 100%;
padding: 9.5px 12px;
top: 35px;
top: 48px;
left: 0;
background: white;
border-radius: 5px;
@ -286,6 +290,11 @@
margin: 0 auto;
}
.addPersonBtn {
margin: 0 auto 0 0;
margin-top: 20px;
}
.modal-add.active {
transform: scale(1);
}
@ -293,8 +302,13 @@
.exit {
cursor: pointer;
position: absolute;
top: 35px;
right: 40px;
top: 15px;
right: 20px;
width: 13px;
height: 13px;
display: flex;
align-items: center;
justify-content: center;
&:before,
&:after {

6
src/components/Modal/TrackerModal/trackerModal.scss
View File

@ -153,11 +153,15 @@
position: absolute;
top: 35px;
right: 40px;
width: 13px;
height: 13px;
display: flex;
align-items: center;
justify-content: center;
&:before,
&:after {
content: "";
position: absolute;
width: 16px;
height: 2px;
background: #263238;