|
|
|
@ -1,15 +1,16 @@
|
|
|
|
|
import React, { useEffect, useState, useMemo } from 'react' |
|
|
|
|
import { Modal, ModalHeader, ModalBody, } from 'reactstrap'; |
|
|
|
|
import { Button } from 'reactstrap'; |
|
|
|
|
import { Table, Tooltip } from 'antd'; |
|
|
|
|
import { Space, Table, Tooltip } from 'antd'; |
|
|
|
|
import 'antd/dist/antd.css'; |
|
|
|
|
import moment from 'moment'; |
|
|
|
|
import SweetAlert from 'react-bootstrap-sweetalert'; |
|
|
|
|
import { HIERARCHY_FTTH_DELETE, HIERARCHY_FTTH_SEARCH, HIERARCHY_FTTH_ADD, USER_LIST } from '../../../const/ApiConst'; |
|
|
|
|
import { HIERARCHY_FTTH_DELETE, HIERARCHY_FTTH_TREE, VERSION_GANTT_SEARCH, HIERARCHY_FTTH_ADD, USER_LIST } from '../../../const/ApiConst'; |
|
|
|
|
import axios from "../../../const/interceptorApi" |
|
|
|
|
import { NotificationContainer, NotificationManager } from 'react-notifications'; |
|
|
|
|
import DialogUserGantt from './DialogUserGantt'; |
|
|
|
|
import DialogForm from './DIalogFormHierarchy' |
|
|
|
|
import DialogFormGantt from './DialogFormGantt'; |
|
|
|
|
import { useTranslation } from 'react-i18next'; |
|
|
|
|
import { async } from '@dabeng/react-orgchart'; |
|
|
|
|
import { Link } from 'react-router-dom'; |
|
|
|
@ -25,8 +26,10 @@ const DialogHierarchy = ({ openDialog, closeDialog, toggleDialog, idTask, proyek
|
|
|
|
|
|
|
|
|
|
const [id, setId] = useState(0) |
|
|
|
|
const [parentId, setParentId] = useState(0) |
|
|
|
|
const [dataGantt, setDataGantt] = useState([]) |
|
|
|
|
const [typeDialog, setTypeDialog] = useState("add") |
|
|
|
|
const [openDialogForm, setOpenDialogForm] = useState(false) |
|
|
|
|
const [openDialogFormGantt, setOpenDialogFormGantt] = useState(false) |
|
|
|
|
const [openDialogUserGantt, setOpenDialogUserGantt] = useState(false) |
|
|
|
|
const [dataHierarchy, setDataHierarchy] = useState([]) |
|
|
|
|
const [alertDelete, setAlertDelete] = useState(false) |
|
|
|
@ -81,23 +84,39 @@ const DialogHierarchy = ({ openDialog, closeDialog, toggleDialog, idTask, proyek
|
|
|
|
|
await setTypeDialog("Save") |
|
|
|
|
setOpenDialogForm(true) |
|
|
|
|
} |
|
|
|
|
const handleAddArea = async (id) => { |
|
|
|
|
const handleAddWithParent = async (id) => { |
|
|
|
|
setParentId(id) |
|
|
|
|
await setTypeDialog("SaveArea") |
|
|
|
|
setOpenDialogForm(true) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const handleAddGant = (id) => { |
|
|
|
|
|
|
|
|
|
setParentId(id) |
|
|
|
|
setOpenDialogFormGantt(true) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const toggleDialogFormGantt = () => { |
|
|
|
|
setOpenDialogFormGantt(!openDialogFormGantt) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const closeDialogFromGantt = (status) => { |
|
|
|
|
if (status == "success") { |
|
|
|
|
NotificationManager.success(`Gantt berhasil dibuat!`, 'Success!!'); |
|
|
|
|
} else if (status == "failed") { |
|
|
|
|
NotificationManager.error(`Gantt gagal dibuat!`, 'Failed!!'); |
|
|
|
|
} |
|
|
|
|
setOpenDialogFormGantt(false) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const closeDialogFromHierarchy = (type, data) => { |
|
|
|
|
if (type == 'save') { |
|
|
|
|
saveHierarchy(data) |
|
|
|
|
setId(0); |
|
|
|
|
setOpenDialogForm(false); |
|
|
|
|
} else { |
|
|
|
|
updateHierarchy(data) |
|
|
|
|
setId(0); |
|
|
|
|
setOpenDialogForm(false); |
|
|
|
|
} |
|
|
|
|
setId(0); |
|
|
|
|
setOpenDialogForm(false); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const saveHierarchy = async (data) => { |
|
|
|
@ -116,15 +135,17 @@ const DialogHierarchy = ({ openDialog, closeDialog, toggleDialog, idTask, proyek
|
|
|
|
|
const updateHierarchy = async (data) => { |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const getdataHierarchy = async () => { |
|
|
|
|
|
|
|
|
|
const payload = { |
|
|
|
|
"columns": [ |
|
|
|
|
{ "name": "project_id", "logic_operator": "=", "value": idTask, "operator": "AND" } |
|
|
|
|
] |
|
|
|
|
"columns": [{ "name": "project_id", "logic_operator": "=", "value": idTask, "operator": "AND" }], |
|
|
|
|
"joins": [{ "name": "m_version_gantt", "column_join": "hierarchy_ftth_id", "column_results": "progress" }], |
|
|
|
|
} |
|
|
|
|
const url = HIERARCHY_FTTH_TREE(idTask) |
|
|
|
|
const result = await axios |
|
|
|
|
.post(HIERARCHY_FTTH_SEARCH, payload, HEADER) |
|
|
|
|
.get(url, HEADER) |
|
|
|
|
.then(res => res) |
|
|
|
|
.catch((error) => error.response); |
|
|
|
|
|
|
|
|
@ -162,31 +183,47 @@ const DialogHierarchy = ({ openDialog, closeDialog, toggleDialog, idTask, proyek
|
|
|
|
|
<Tooltip title="Delete"> |
|
|
|
|
<Button size={"sm"} color='danger' onClick={() => handleDelete(text.id)}><i className="fa fa-trash"></i></Button> |
|
|
|
|
</Tooltip>{" "} |
|
|
|
|
<Tooltip title="Tambah Area"> |
|
|
|
|
<Button size={"sm"} color='success' onClick={() => handleAddArea(text.id)}><i className="fa fa-plus"></i></Button> |
|
|
|
|
<Tooltip title="Tambah Data"> |
|
|
|
|
<Button size={"sm"} color='success' onClick={() => handleAddWithParent(text.id)}><i className="fa fa-plus"></i></Button> |
|
|
|
|
</Tooltip>{" "} |
|
|
|
|
<Link to={`/projects/${text.id}/${idTask}/gantt`}> |
|
|
|
|
<Tooltip title="Gantt"> |
|
|
|
|
<Button size={"sm"} color='primary'><i className="fa fa-gears"></i></Button> |
|
|
|
|
</Tooltip></Link>{" "} |
|
|
|
|
<Tooltip title="Gantt"> |
|
|
|
|
<Button size={"sm"} color='primary' onClick={() => handleAddGant(text.id)}><i className="fa fa-gears"></i></Button> |
|
|
|
|
</Tooltip> |
|
|
|
|
</> |
|
|
|
|
, |
|
|
|
|
}, |
|
|
|
|
{ title: 'Nama', dataIndex: 'name', key: 'name' }, |
|
|
|
|
{ |
|
|
|
|
title: 'Nama', dataIndex: 'name', key: 'name' |
|
|
|
|
}, |
|
|
|
|
{ title: 'Tanggal dibuat', dataIndex: 'created_at', key: 'created_at', render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{text ? moment(text).format("D-M-YYYY") : "-"}</div>) }, |
|
|
|
|
{ title: 'Progress', dataIndex: '-', key: '-' }, |
|
|
|
|
{ title: 'Progress', dataIndex: 'progress', key: 'progress' }, |
|
|
|
|
|
|
|
|
|
]; |
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
|
<Table |
|
|
|
|
size="small" |
|
|
|
|
columns={columns} |
|
|
|
|
rowKey={"id"} |
|
|
|
|
columns={[Table.EXPAND_COLUMN, ...columns]} |
|
|
|
|
expandable={{ |
|
|
|
|
expandedRowRender: (record) => { |
|
|
|
|
if (Array.isArray(record.dataGantt)) { |
|
|
|
|
return record.dataGantt.map((data) => ( |
|
|
|
|
<Link to={`/projects/${data.id}/${idTask}/gantt`}> |
|
|
|
|
<Space align="center"> |
|
|
|
|
<p style={{ marginLeft: 15, width: "100%" }}>{data.name_version}</p> |
|
|
|
|
</Space> |
|
|
|
|
</Link> |
|
|
|
|
)); |
|
|
|
|
} else { |
|
|
|
|
return null; // or some default content if dataGantt is not an array
|
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
}} |
|
|
|
|
rowKey="id" |
|
|
|
|
dataSource={dataHierarchy} |
|
|
|
|
pagination={{ position: ["bottomLeft"] }} |
|
|
|
|
/> |
|
|
|
|
) |
|
|
|
|
); |
|
|
|
|
}, [dataHierarchy]) |
|
|
|
|
|
|
|
|
|
const cancelDelete = () => { |
|
|
|
@ -212,10 +249,6 @@ const DialogHierarchy = ({ openDialog, closeDialog, toggleDialog, idTask, proyek
|
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const handleOpenDialogForm = () => { |
|
|
|
|
setOpenDialogForm(true) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const toggleDialogForm = () => { |
|
|
|
|
setOpenDialogForm(!openDialogForm) |
|
|
|
|
} |
|
|
|
@ -279,6 +312,14 @@ const DialogHierarchy = ({ openDialog, closeDialog, toggleDialog, idTask, proyek
|
|
|
|
|
> |
|
|
|
|
Delete this data |
|
|
|
|
</SweetAlert> |
|
|
|
|
|
|
|
|
|
<DialogFormGantt |
|
|
|
|
idTask={idTask} |
|
|
|
|
openDialog={openDialogFormGantt} |
|
|
|
|
toggleDialog={toggleDialogFormGantt} |
|
|
|
|
closeDialog={closeDialogFromGantt} |
|
|
|
|
parentId={parentId} /> |
|
|
|
|
|
|
|
|
|
<DialogForm |
|
|
|
|
openDialog={openDialogForm} |
|
|
|
|
closeDialog={closeDialogFromHierarchy} |
|
|
|
|