62 lines
2.1 KiB
TypeScript
62 lines
2.1 KiB
TypeScript
import { FunctionalComponent, h } from "preact";
|
|
import { useReducer } from "preact/hooks";
|
|
import * as style from "./style.css";
|
|
import { newProject } from "../../models/project";
|
|
import TaskTable from "./tasks-table";
|
|
import TimePreview from "./time-preview";
|
|
import FinancialPreview from "./financial-preview";
|
|
import { projectReducer, addTask, updateTaskEstimation, removeTask } from "../../hooks/project-reducer";
|
|
import { Task, TaskID, EstimationConfidence } from "../../models/task";
|
|
|
|
const Project: FunctionalComponent = () => {
|
|
const [project, dispatch] = useReducer(projectReducer, newProject());
|
|
|
|
const onTaskAdd = (task: Task) => {
|
|
dispatch(addTask(task));
|
|
};
|
|
|
|
const onTaskRemove = (taskId: TaskID) => {
|
|
dispatch(removeTask(taskId));
|
|
}
|
|
|
|
const onEstimationChange = (taskId: TaskID, confidence: EstimationConfidence, value: number) => {
|
|
dispatch(updateTaskEstimation(taskId, confidence, value));
|
|
};
|
|
|
|
return (
|
|
<div class={`container ${style.estimation}`}>
|
|
<div class="tabs">
|
|
<ul>
|
|
<li class="is-active">
|
|
<a>
|
|
<span class="icon is-small">📋</span>
|
|
Estimation
|
|
</a>
|
|
</li>
|
|
{/* <li>
|
|
<a disabled>
|
|
<span class="icon is-small">⚙️</span>
|
|
Paramètres
|
|
</a>
|
|
</li> */}
|
|
</ul>
|
|
</div>
|
|
<div class="columns">
|
|
<div class="column is-9">
|
|
<TaskTable
|
|
project={project}
|
|
onTaskAdd={onTaskAdd}
|
|
onTaskRemove={onTaskRemove}
|
|
onEstimationChange={onEstimationChange} />
|
|
</div>
|
|
<div class="column is-3">
|
|
<TimePreview project={project} />
|
|
<FinancialPreview project={project} />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default Project;
|