Docker/planka
Docker/planka
1
0
Fork 0
mirror of https://github.com/plankanban/planka.git synced 2025-07-18 20:59:44 +02:00
Code Issues Releases Activity

fix: Add task counter in card modal (#525)

Browse source 
Closes #467
This commit is contained in:
Vishnu Kaushik 2023-10-21 00:50:04 +05:30 • committed by GitHub
parent d820d5e5d0
commit e3d3130797
2 changed files with 32 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

7
client/src/components/CardModal/Tasks/Tasks.jsx
View file

@ -48,6 +48,8 @@ const Tasks = React.memo(({ items, canEdit, onCreate, onUpdate, onMove, onDelete
return ( return (
<> <>
{items.length > 0 && ( {items.length > 0 && (
<>
<span className={styles.progressWrapper}>
<Progress <Progress
autoSuccess autoSuccess
value={completedItems.length} value={completedItems.length}
@ -56,6 +58,11 @@ const Tasks = React.memo(({ items, canEdit, onCreate, onUpdate, onMove, onDelete
size="tiny" size="tiny"
className={styles.progress} className={styles.progress}
/> />
</span>
<span className={styles.count}>
{completedItems.length}/{items.length}
</span>
</>
)} )}
<DragDropContext onDragStart={handleDragStart} onDragEnd={handleDragEnd}> <DragDropContext onDragStart={handleDragStart} onDragEnd={handleDragEnd}>
<Droppable droppableId="tasks" type={DroppableTypes.TASK}> <Droppable droppableId="tasks" type={DroppableTypes.TASK}>

17
client/src/components/CardModal/Tasks/Tasks.module.scss
View file

@ -3,6 +3,23 @@
margin: 0 0 16px; margin: 0 0 16px;
} }
.progressWrapper {
display: inline-block;
padding: 3px 0;
vertical-align: top;
width: calc(100% - 50px);
}
.count {
color: #8c8c8c;
display: inline-block;
font-size: 14px;
line-height: 14px;
text-align: right;
vertical-align: top;
width: 50px;
}
.taskButton { .taskButton {
background: transparent; background: transparent;
border: none; border: none;