Skip to content

Commit

Permalink
Merge pull request #175 from TEAM-DAWM/feat/#173/task-get-targetarea
Browse files Browse the repository at this point in the history
[FEAT] task get api TargetArea 연동
  • Loading branch information
wrryu09 authored Jul 17, 2024
2 parents ab867ca + 1cc7883 commit f002b58
Show file tree
Hide file tree
Showing 4 changed files with 50 additions and 31 deletions.
2 changes: 1 addition & 1 deletion src/apis/tasks/getTask/GetTasksType.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
export interface GetTasksType {
isTotal?: boolean;
sortOrder?: string;
targetDate?: Date;
targetDate?: string;
}
4 changes: 2 additions & 2 deletions src/components/targetArea/TargetArea.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ interface TargetAreaProps {
tasks: TaskType[];
}

function TargetArea({ handleSelectedTarget, selectedTarget, tasks }: TargetAreaProps) {
function TargetArea({ handleSelectedTarget, selectedTarget }: TargetAreaProps) {
const [targetDate, setTargetDate] = useState(new Date());

const handlePrevBtn = () => {
Expand Down Expand Up @@ -59,7 +59,7 @@ function TargetArea({ handleSelectedTarget, selectedTarget, tasks }: TargetAreaP
<TargetTaskSection
handleSelectedTarget={handleSelectedTarget}
selectedTarget={selectedTarget}
tasks={tasks}
selectedDate={targetDate}
/>
{provided.placeholder}
</div>
Expand Down
63 changes: 35 additions & 28 deletions src/components/targetArea/TargetTaskSection.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,43 +3,50 @@ import { Draggable } from 'react-beautiful-dnd';
import BtnTask from '../common/BtnTask/BtnTask';
import BtnTaskContainer from '../common/BtnTaskContainer';

import useGetTasks from '@/apis/tasks/getTask/query';
import { TaskType } from '@/types/tasks/taskType';
import formatDatetoLocalDate from '@/utils/formatDatetoLocalDate';

interface TargetTaskSectionProps {
handleSelectedTarget: (task: TaskType | null) => void;
selectedTarget: TaskType | null;
tasks: TaskType[];
selectedDate: Date | null;
}
function TargetTaskSection(props: TargetTaskSectionProps) {
const { handleSelectedTarget, selectedTarget, tasks } = props;

const { handleSelectedTarget, selectedTarget, selectedDate } = props;
const targetDate = formatDatetoLocalDate(selectedDate);
const { isFetched, data } = useGetTasks({ targetDate });
return (
<BtnTaskContainer type="target">
{tasks.map((task, index) => (
<Draggable key={task.id} draggableId={task.id.toString()} index={index}>
{(provided, snapshot) => (
<div
ref={provided.innerRef}
{...provided.draggableProps}
{...provided.dragHandleProps}
style={{ userSelect: 'none', ...provided.draggableProps.style }}
>
<BtnTask
iconType="active"
key={task.id}
hasDescription={task.hasDescription}
name={task.name}
deadLine={task.deadLine}
status={task.status}
id={task.id}
handleSelectedTarget={handleSelectedTarget}
selectedTarget={selectedTarget}
isDragging={snapshot.isDragging}
/>
</div>
)}
</Draggable>
))}
{isFetched && (
<>
{data.data.tasks.map((task: TaskType, index: number) => (
<Draggable key={task.id} draggableId={task.id.toString()} index={index}>
{(provided, snapshot) => (
<div
ref={provided.innerRef}
{...provided.draggableProps}
{...provided.dragHandleProps}
style={{ userSelect: 'none', ...provided.draggableProps.style }}
>
<BtnTask
iconType="active"
key={task.id}
hasDescription={task.hasDescription}
name={task.name}
deadLine={task.deadLine}
status={task.status}
id={task.id}
handleSelectedTarget={handleSelectedTarget}
selectedTarget={selectedTarget}
isDragging={snapshot.isDragging}
/>
</div>
)}
</Draggable>
))}
</>
)}
</BtnTaskContainer>
);
}
Expand Down
12 changes: 12 additions & 0 deletions src/utils/formatDatetoLocalDate.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
/** Date 형식을 0000-00-00 형식 string 으로 반환합니다 */
const formatDatetoLocalDate = (date: Date | null) => {
if (date) {
const year = date.getFullYear();
const month = '0'.concat((date.getMonth() + 1).toString()).slice(-2);
const day = '0'.concat(date.getDate().toString()).slice(-2);
return `${year}-${month}-${day}`;
}
return '';
};

export default formatDatetoLocalDate;

0 comments on commit f002b58

Please sign in to comment.