feat: добавление работы с пользователями
- добавление участников в канбан доску - назначение исполнителя на задачу - снятие исполнителя с задачи
This commit is contained in:
@@ -17,6 +17,9 @@ const KBBoard = () => {
|
||||
const [edCateg, setEdCateg] = useState(false);
|
||||
const [delTask, setDelTask] = useState(false);
|
||||
const [delCateg, setDelCateg] = useState(false);
|
||||
const [asgnMember, setAsgnMember] = useState(false);
|
||||
const [assignAction, setAssignAction] = useState(false);
|
||||
const [addMemb, setAddMemb] = useState(false);
|
||||
|
||||
const [categoryTitle, setCategoryTitle] = useState('');
|
||||
const [taskTitle, setTaskTitle] = useState('');
|
||||
@@ -27,6 +30,10 @@ const KBBoard = () => {
|
||||
const [editedCateg, setEditedCateg] = useState({});
|
||||
const [taskPosition, setTaskPosition] = useState(null);
|
||||
const [categoryPosition, setCategoryPosition] = useState(null);
|
||||
const [assignedMember, setAssignedMember] = useState(0);
|
||||
const [addedUsername, setAddedUsername] = useState('');
|
||||
|
||||
|
||||
|
||||
const {
|
||||
loadBoardData,
|
||||
@@ -35,7 +42,9 @@ const KBBoard = () => {
|
||||
editTask,
|
||||
editCategory,
|
||||
deleteCategory,
|
||||
deleteTask
|
||||
deleteTask,
|
||||
assignMember,
|
||||
addMember
|
||||
} = useBoardLogic(id, setError, setInfo, setCategories, setLoading);
|
||||
|
||||
useEffect(() => {
|
||||
@@ -60,6 +69,7 @@ const KBBoard = () => {
|
||||
setTaskDescription(task.description);
|
||||
setTaskPosition(task.position);
|
||||
setTaskCategory(task.category_id);
|
||||
//setAssignedMember(task.assigned_users.id)
|
||||
}
|
||||
const modalEditCateg = (categ) => () => {
|
||||
setEdCateg(!edCateg);
|
||||
@@ -73,7 +83,15 @@ const KBBoard = () => {
|
||||
const modalDelCateg = () => {
|
||||
setDelCateg(!delCateg);
|
||||
}
|
||||
const modalAssignMember = (action) => () => {
|
||||
setAsgnMember(!asgnMember);
|
||||
setAssignAction(action)
|
||||
}
|
||||
const modalAddMember = () => {
|
||||
setAddMemb(!addMemb);
|
||||
}
|
||||
|
||||
|
||||
const handleCreateCategory = async (e) => {
|
||||
e.preventDefault();
|
||||
await createCategory(categoryTitle, modalCrCateg);
|
||||
@@ -98,6 +116,16 @@ const KBBoard = () => {
|
||||
e.preventDefault();
|
||||
await deleteCategory(editedCateg.id, modalDelCateg, modalEditCateg);
|
||||
};
|
||||
const handleAssignMember = async (e) => {
|
||||
e.preventDefault();
|
||||
await assignMember(editedTask.id, assignedMember, assignAction, modalAssignMember);
|
||||
};
|
||||
const handleAddMember = async (e) => {
|
||||
e.preventDefault();
|
||||
await addMember(addedUsername, id, modalAddMember);
|
||||
};
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<div className="app-container">
|
||||
@@ -122,7 +150,9 @@ const KBBoard = () => {
|
||||
</div>
|
||||
</div>
|
||||
<div className="set-panel" >
|
||||
<p>SetingPanel:В разработке</p>
|
||||
<button onClick={modalAddMember}>
|
||||
Добавить участника
|
||||
</button>
|
||||
</div>
|
||||
<div className="board-panel" >
|
||||
{categories.map((category) => (
|
||||
@@ -142,7 +172,13 @@ const KBBoard = () => {
|
||||
category.tasks.map((task) => (
|
||||
<button className='task' onClick={modalEditTask(task, category.id)} key={task.id}>
|
||||
<div>{task.title}</div>
|
||||
<div>{task.description}</div>
|
||||
<div>{task.description}</div>
|
||||
<div>Исполнители
|
||||
{task.assigned_users.map((member) => (
|
||||
<img key={member.id} className='members-avatar' src={member.avatar_url}></img>
|
||||
|
||||
))}
|
||||
</div>
|
||||
</button>
|
||||
))
|
||||
) : (
|
||||
@@ -173,6 +209,7 @@ const KBBoard = () => {
|
||||
<div><h3>Новая категория</h3></div>
|
||||
<form onSubmit={handleCreateCategory}>
|
||||
<div>
|
||||
<label >Название:</label>
|
||||
<input
|
||||
type="text"
|
||||
value={categoryTitle}
|
||||
@@ -195,12 +232,14 @@ const KBBoard = () => {
|
||||
<div><h3>Новая задача</h3></div>
|
||||
<form onSubmit={handleCreateTask}>
|
||||
<div>
|
||||
<label >Название:</label>
|
||||
<input
|
||||
type="text"
|
||||
value={taskTitle}
|
||||
onChange={(e) => setTaskTitle(e.target.value)}
|
||||
required
|
||||
/>
|
||||
<label >Описание:</label>
|
||||
<input
|
||||
type="text"
|
||||
value={taskDescription}
|
||||
@@ -222,6 +261,7 @@ const KBBoard = () => {
|
||||
<div><h3>Изменение категории</h3></div>
|
||||
<form onSubmit={handleEditCategory}>
|
||||
<div>
|
||||
<label >Название:</label>
|
||||
<input
|
||||
type="text"
|
||||
value={categoryTitle}
|
||||
@@ -245,12 +285,14 @@ const KBBoard = () => {
|
||||
<div><h3>Изменение задачи</h3></div>
|
||||
<form onSubmit={handleEditTask}>
|
||||
<div>
|
||||
<label >Название:</label>
|
||||
<input
|
||||
type="text"
|
||||
value={taskTitle}
|
||||
onChange={(e) => setTaskTitle(e.target.value)}
|
||||
required
|
||||
/>
|
||||
<label >Описание:</label>
|
||||
<input
|
||||
type="text"
|
||||
value={taskDescription}
|
||||
@@ -267,6 +309,11 @@ const KBBoard = () => {
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label >Исполнитель:</label>
|
||||
<button type="button" onClick={modalAssignMember(true)}>Назначить</button>
|
||||
<button type="button" onClick={modalAssignMember(false)}>Снять</button>
|
||||
</div>
|
||||
</div>
|
||||
<button type="submit" disabled={loading}>
|
||||
{loading ? 'Изменение...' : 'Изменить'}
|
||||
@@ -307,7 +354,86 @@ const KBBoard = () => {
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{addMemb && (
|
||||
<div className="confirm-modal">
|
||||
<div className="modal-content">
|
||||
<div><h3>Удаление категории</h3></div>
|
||||
<form onSubmit={handleAddMember}>
|
||||
<label >Введите логин человека которого хотитепригласить</label>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Поиск по названию..."
|
||||
value={addedUsername}
|
||||
onChange={(e) => setAddedUsername(e.target.value)}
|
||||
/>
|
||||
<button onClick={modalAddMember}>Отменить</button>
|
||||
<button type="submit" disabled={loading}>
|
||||
{loading ? 'Добавление...' : 'Добавить'}
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
|
||||
{asgnMember && (
|
||||
<div className="confirm-modal">
|
||||
{assignAction ? (
|
||||
<div className="modal-content">
|
||||
<div><h3>Назначение пользователя</h3></div>
|
||||
<form onSubmit={handleAssignMember}>
|
||||
<div>
|
||||
<div>
|
||||
<label >Исполнитель:</label>
|
||||
<select value={assignedMember} onChange={(e) => setAssignedMember(e.target.value)}>
|
||||
<option value={0}>
|
||||
Выберите пользователя
|
||||
</option>
|
||||
{info.members.map((member) => (
|
||||
<option key={member.display_name} value={member.id}>
|
||||
{member.display_name}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<button type="submit" disabled={loading}>
|
||||
{loading ? 'Назначение...' : 'Назначить'}
|
||||
</button>
|
||||
</form>
|
||||
<button onClick={modalAssignMember(null)}>Отменить</button>
|
||||
</div>
|
||||
) : (
|
||||
<div className="modal-content">
|
||||
<div><h3>Снятие пользователя</h3></div>
|
||||
<form onSubmit={handleAssignMember}>
|
||||
<div>
|
||||
<div>
|
||||
<label >Исполнитель:</label>
|
||||
<select value={assignedMember} onChange={(e) => setAssignedMember(e.target.value)}>
|
||||
<option value={0}>
|
||||
Выберите пользователя
|
||||
</option>
|
||||
{info.members.map((member) => (
|
||||
<option key={member.display_name} value={member.id}>
|
||||
{member.display_name}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<button type="submit" disabled={loading}>
|
||||
{loading ? 'Снятие...' : 'Снять'}
|
||||
</button>
|
||||
</form>
|
||||
<button onClick={modalAssignMember(null)}>Отменить</button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user