Browse Source

hierarcy gantt

pull/2/head
farhan048 2 years ago
parent
commit
99d780f70f
  1. 3
      src/const/ApiConst.js
  2. 8
      src/views/SimproV2/CreatedProyek/DIalogFormHierarchy.js
  3. 93
      src/views/SimproV2/CreatedProyek/DIalogHierarchy.js
  4. 73
      src/views/SimproV2/CreatedProyek/DialogFormGantt.js
  5. 43
      src/views/SimproV2/CreatedProyek/DialogGantt.js

3
src/const/ApiConst.js

@ -466,6 +466,5 @@ export const HIERARCHY_FTTH_SEARCH = `${BASE_SIMPRO_LUMEN}/hierarchy-ftths/searc
export const HIERARCHY_FTTH_SHOW = (id) => { return `${BASE_SIMPRO_LUMEN}/hierarchy-ftths/${id}` }
export const HIERARCHY_FTTH_UPDATE = (id) => { return `${BASE_SIMPRO_LUMEN}/hierarchy-ftths/${id}` }
export const HIERARCHY_FTTH_DELETE = (id) => { return `${BASE_SIMPRO_LUMEN}/hierarchy-ftths/${id}` }
export const HIERARCHY_FTTH_TREE = (id) => { return `${BASE_SIMPRO_LUMEN}/hierarchy-ftths/${id}` }
export const HIERARCHY_FTTH_TREE = (id) => { return `${BASE_SIMPRO_LUMEN}/hierarchy-ftths/tree/${id}` }
export const WAYPOINT_SEARCH = `${BASE_SIMPRO_LUMEN}/waypoint/search`

8
src/views/SimproV2/CreatedProyek/DIalogFormHierarchy.js

@ -10,7 +10,6 @@ import 'antd/dist/antd.css';
import { useTranslation } from 'react-i18next';
const DialogFormHierarchy = ({ openDialog, closeDialog, toggleDialog, typeDialog, parentId, idProject }) => {
console.log('parentId', parentId);
const [id, setId] = useState(0)
const [nameDaerah, setNameDaerah] = useState('')
const [nameArea, setNameArea] = useState('')
@ -22,7 +21,6 @@ const DialogFormHierarchy = ({ openDialog, closeDialog, toggleDialog, typeDialog
project_id: idProject,
name: nameDaerah,
}
console.log('data', data);
closeDialog('save', data);
} else {
data = {
@ -38,10 +36,12 @@ const DialogFormHierarchy = ({ openDialog, closeDialog, toggleDialog, typeDialog
if (typeDialog === "SaveArea") {
data = {
project_id: idProject,
parent_id: parentId,
name: nameArea,
}
console.log('data', data);
if (parentId && parentId > 0) {
data['parent_id'] = parentId
}
closeDialog('save', data);
} else {
data = {

93
src/views/SimproV2/CreatedProyek/DIalogHierarchy.js

@ -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}

73
src/views/SimproV2/CreatedProyek/DialogFormGantt.js

@ -6,7 +6,7 @@ import { VERSION_GANTT_ADD } from '../../../const/ApiConst';
import { Select } from 'antd';
import 'antd/dist/antd.css';
const DialogFormGantt = ({ openDialog, closeDialog, toggleDialog, idTask }) => {
const DialogFormGantt = ({ openDialog, closeDialog, toggleDialog, idTask, parentId }) => {
const token = localStorage.getItem("token")
const HEADER = {
headers: {
@ -18,7 +18,7 @@ const DialogFormGantt = ({ openDialog, closeDialog, toggleDialog, idTask }) => {
const [name, setName] = useState("")
const [description, setDesctription] = useState("")
const [calculationType, setCalculationType] = useState("detail")
console.log('parentId', parentId);
const handleCLearData = () => {
setId(0)
setName("")
@ -34,23 +34,26 @@ const DialogFormGantt = ({ openDialog, closeDialog, toggleDialog, idTask }) => {
handleCLearData()
}
const saveVersionGantt= async () => {
const saveVersionGantt = async () => {
const formData = {
name_version:name,
description,
calculation_type: calculationType,
proyek_id:idTask
name_version: name,
description,
calculation_type: calculationType,
proyek_id: idTask,
id_hierarcy_ftth: parentId
}
console.log('formData', formData);
const result = await axios
.post(VERSION_GANTT_ADD, formData, HEADER)
.then(res => res)
.catch((error) => error.response);
if(result && result.status==200){
if (result && result.status == 200) {
closeDialog('success')
}else{
} else {
closeDialog('failed')
}
}
@ -64,35 +67,35 @@ const DialogFormGantt = ({ openDialog, closeDialog, toggleDialog, idTask }) => {
return (
<Form>
<FormGroup>
<Label className="capitalize">Nama <span style={{ color: "red" }}>*</span> </Label>
<Input type="text" value={name} onChange={(e) => setName(e.target.value)} placeholder='' />
<Label className="capitalize">Nama <span style={{ color: "red" }}>*</span> </Label>
<Input type="text" value={name} onChange={(e) => setName(e.target.value)} placeholder='' />
</FormGroup>
<FormGroup>
<Label className="capitalize">Deskripsi </Label>
<Input type="textarea" value={description} onChange={(e) => setDesctription(e.target.value)} placeholder='' />
</FormGroup>
<FormGroup>
<Label className="capitalize">Deskripsi </Label>
<Input type="textarea" value={description} onChange={(e) => setDesctription(e.target.value)} placeholder='' />
<Label className="capitalize">Tipe Kalkulasi </Label>
<div>
<Select
defaultValue="detail"
style={{
width: 120,
}}
onChange={(v) => setCalculationType(v)}
options={[
{
value: 'detail',
label: 'Detail',
},
{
value: 'simple',
label: 'Simple',
},
]}
/>
</div>
</FormGroup>
<FormGroup>
<Label className="capitalize">Tipe Kalkulasi </Label>
<div>
<Select
defaultValue="detail"
style={{
width: 120,
}}
onChange={(v) => setCalculationType(v)}
options={[
{
value: 'detail',
label: 'Detail',
},
{
value: 'simple',
label: 'Simple',
},
]}
/>
</div>
</FormGroup>
<FormGroup>
<div>
Notes:

43
src/views/SimproV2/CreatedProyek/DialogGantt.js

@ -13,7 +13,7 @@ import DialogUserGantt from './DialogUserGantt';
import { Link } from 'react-router-dom';
const DialogGantt = ({ openDialog, closeDialog, toggleDialog, idTask, proyekName }) => {
const DialogGantt = ({ openDialog, closeDialog, toggleDialog, idTask, proyekName, hierarchyId }) => {
const token = localStorage.getItem("token")
const HEADER = {
headers: {
@ -34,7 +34,10 @@ const DialogGantt = ({ openDialog, closeDialog, toggleDialog, idTask, proyekName
if (idTask > 0) {
getdataGantt();
}
}, [idTask, openDialog])
if (hierarchyId > 0) {
getdataGantt();
}
}, [hierarchyId, idTask, openDialog])
useEffect(() => {
getDataHumanResource();
@ -75,11 +78,19 @@ const DialogGantt = ({ openDialog, closeDialog, toggleDialog, idTask, proyekName
const getdataGantt = async () => {
const payload = {
"columns": [
{ "name": "proyek_id", "logic_operator": "=", "value": idTask, "operator": "AND" }
]
let payload;
if (hierarchyId) {
payload = {
"columns": [
{ "name": "hierarchy_ftth_id", "logic_operator": "=", "value": hierarchyId, "operator": "AND" }
]
}
} else {
payload = {
"columns": [
{ "name": "proyek_id", "logic_operator": "=", "value": idTask, "operator": "AND" }
]
}
}
const result = await axios
.post(VERSION_GANTT_SEARCH, payload, HEADER)
@ -118,21 +129,22 @@ const DialogGantt = ({ openDialog, closeDialog, toggleDialog, idTask, proyekName
render: (text, record) =>
<>
<Tooltip title="Delete Gantt">
<Button size="small" size={"sm"} color='danger' onClick={() => handleDelete(text.id)}><i className="fa fa-trash"></i></Button>
<Button size={"sm"} color='danger' onClick={() => handleDelete(text.id)}><i className="fa fa-trash"></i></Button>
</Tooltip>{" "}
<Tooltip title="Gantt Permission">
<Button size="small" size={"sm"} color='success' onClick={() => handleUserGant(text.id)}><i className="fa fa-users"></i></Button>
<Button size={"sm"} color='success' onClick={() => handleUserGant(text.id)}><i className="fa fa-users"></i></Button>
</Tooltip>{" "}
<Link to={`/projects/${text.id}/import/activity`}>
{" "}<Tooltip title="Import Activity">
<Button size={"sm"} color='success'>
<i className="fa fa-file-excel-o"></i>
</Button>
<i className="fa fa-file-excel-o"></i>
</Button>
</Tooltip>{" "}
</Link>
<Link to={`/projects/${text.id}/${idTask}/gantt`}>
<Tooltip title="Gantt">
<Button size="small" size={"sm"} color='primary'><i className="fa fa-gears"></i></Button>
<Button size={"sm"} color='primary'><i className="fa fa-gears"></i></Button>
</Tooltip></Link>{" "}
</>
,
@ -141,6 +153,7 @@ const DialogGantt = ({ openDialog, closeDialog, toggleDialog, idTask, proyekName
{ title: 'Tipe kalkulasi', dataIndex: 'calculation_type', key: 'calculation_type' },
{ title: 'Deskripsi', dataIndex: 'description', key: 'description' },
{ 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: 'progress', key: 'progress' }
];
@ -217,7 +230,11 @@ const DialogGantt = ({ openDialog, closeDialog, toggleDialog, idTask, proyekName
<>
<Modal size="xl" isOpen={openDialog} toggle={toggleDialog}>
<ModalHeader className="capitalize withBtn" toggle={closeDialog} style={{ width: "100%" }}>
<div>Gantt Project {proyekName} </div> <Button onClick={handleOpenDialogForm} size='sm' color="primary"><i className='fa fa-plus'></i></Button>
<div>Gantt Project {proyekName} </div> {!hierarchyId && (<> <Button onClick={handleOpenDialogForm} size='sm' color="primary"><i className='fa fa-plus'></i></Button>
</>
)}
</ModalHeader>
<ModalBody>
<div style={{ width: '100%', overflow: "auto" }}>

Loading…
Cancel
Save