ordo
/
surveyor_indonesia_frontend
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

hierarcy gantt

pull/2/head
farhan048 2 years ago
parent
0b06c6b524
commit
99d780f70f
5 changed files with 140 additions and 80 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  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
Unescape View File

@ -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_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_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_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` export const WAYPOINT_SEARCH = `${BASE_SIMPRO_LUMEN}/waypoint/search`

8
src/views/SimproV2/CreatedProyek/DIalogFormHierarchy.js
Unescape View File

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

93
src/views/SimproV2/CreatedProyek/DIalogHierarchy.js
Unescape View File

@ -1,15 +1,16 @@
import React, { useEffect, useState, useMemo } from 'react' import React, { useEffect, useState, useMemo } from 'react'
import { Modal, ModalHeader, ModalBody, } from 'reactstrap'; import { Modal, ModalHeader, ModalBody, } from 'reactstrap';
import { Button } from 'reactstrap'; import { Button } from 'reactstrap';
import { Table, Tooltip } from 'antd'; import { Space, Table, Tooltip } from 'antd';
import 'antd/dist/antd.css'; import 'antd/dist/antd.css';
import moment from 'moment'; import moment from 'moment';
import SweetAlert from 'react-bootstrap-sweetalert'; 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 axios from "../../../const/interceptorApi"
import { NotificationContainer, NotificationManager } from 'react-notifications'; import { NotificationContainer, NotificationManager } from 'react-notifications';
import DialogUserGantt from './DialogUserGantt'; import DialogUserGantt from './DialogUserGantt';
import DialogForm from './DIalogFormHierarchy' import DialogForm from './DIalogFormHierarchy'
import DialogFormGantt from './DialogFormGantt';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { async } from '@dabeng/react-orgchart'; import { async } from '@dabeng/react-orgchart';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
@ -25,8 +26,10 @@ const DialogHierarchy = ({ openDialog, closeDialog, toggleDialog, idTask, proyek
const [id, setId] = useState(0) const [id, setId] = useState(0)
const [parentId, setParentId] = useState(0) const [parentId, setParentId] = useState(0)
const [dataGantt, setDataGantt] = useState([])
const [typeDialog, setTypeDialog] = useState("add") const [typeDialog, setTypeDialog] = useState("add")
const [openDialogForm, setOpenDialogForm] = useState(false) const [openDialogForm, setOpenDialogForm] = useState(false)
const [openDialogFormGantt, setOpenDialogFormGantt] = useState(false)
const [openDialogUserGantt, setOpenDialogUserGantt] = useState(false) const [openDialogUserGantt, setOpenDialogUserGantt] = useState(false)
const [dataHierarchy, setDataHierarchy] = useState([]) const [dataHierarchy, setDataHierarchy] = useState([])
const [alertDelete, setAlertDelete] = useState(false) const [alertDelete, setAlertDelete] = useState(false)
@ -81,23 +84,39 @@ const DialogHierarchy = ({ openDialog, closeDialog, toggleDialog, idTask, proyek
await setTypeDialog("Save") await setTypeDialog("Save")
setOpenDialogForm(true) setOpenDialogForm(true)
} }
const handleAddArea = async (id) => { const handleAddWithParent = async (id) => {
setParentId(id) setParentId(id)
await setTypeDialog("SaveArea") await setTypeDialog("SaveArea")
setOpenDialogForm(true) 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) => { const closeDialogFromHierarchy = (type, data) => {
if (type == 'save') { if (type == 'save') {
saveHierarchy(data) saveHierarchy(data)
setId(0);
setOpenDialogForm(false);
} else { } else {
updateHierarchy(data) updateHierarchy(data)
setId(0);
setOpenDialogForm(false);
} }
setId(0);
setOpenDialogForm(false);
} }
const saveHierarchy = async (data) => { const saveHierarchy = async (data) => {
@ -116,15 +135,17 @@ const DialogHierarchy = ({ openDialog, closeDialog, toggleDialog, idTask, proyek
const updateHierarchy = async (data) => { const updateHierarchy = async (data) => {
} }
const getdataHierarchy = async () => { const getdataHierarchy = async () => {
const payload = { const payload = {
"columns": [ "columns": [{ "name": "project_id", "logic_operator": "=", "value": idTask, "operator": "AND" }],
{ "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 const result = await axios
.post(HIERARCHY_FTTH_SEARCH, payload, HEADER) .get(url, HEADER)
.then(res => res) .then(res => res)
.catch((error) => error.response); .catch((error) => error.response);
@ -162,31 +183,47 @@ const DialogHierarchy = ({ openDialog, closeDialog, toggleDialog, idTask, proyek
<Tooltip title="Delete"> <Tooltip title="Delete">
<Button 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>{" "}
<Tooltip title="Tambah Area"> <Tooltip title="Tambah Data">
<Button size={"sm"} color='success' onClick={() => handleAddArea(text.id)}><i className="fa fa-plus"></i></Button> <Button size={"sm"} color='success' onClick={() => handleAddWithParent(text.id)}><i className="fa fa-plus"></i></Button>
</Tooltip>{" "} </Tooltip>{" "}
<Link to={`/projects/${text.id}/${idTask}/gantt`}> <Tooltip title="Gantt">
<Tooltip title="Gantt"> <Button size={"sm"} color='primary' onClick={() => handleAddGant(text.id)}><i className="fa fa-gears"></i></Button>
<Button size={"sm"} color='primary'><i className="fa fa-gears"></i></Button> </Tooltip>
</Tooltip></Link>{" "}
</> </>
, ,
}, },
{ 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: '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 ( return (
<Table <Table
size="small" size="small"
columns={columns} columns={[Table.EXPAND_COLUMN, ...columns]}
rowKey={"id"} 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} dataSource={dataHierarchy}
pagination={{ position: ["bottomLeft"] }} pagination={{ position: ["bottomLeft"] }}
/> />
) );
}, [dataHierarchy]) }, [dataHierarchy])
const cancelDelete = () => { const cancelDelete = () => {
@ -212,10 +249,6 @@ const DialogHierarchy = ({ openDialog, closeDialog, toggleDialog, idTask, proyek
} }
} }
const handleOpenDialogForm = () => {
setOpenDialogForm(true)
}
const toggleDialogForm = () => { const toggleDialogForm = () => {
setOpenDialogForm(!openDialogForm) setOpenDialogForm(!openDialogForm)
} }
@ -279,6 +312,14 @@ const DialogHierarchy = ({ openDialog, closeDialog, toggleDialog, idTask, proyek
> >
Delete this data Delete this data
</SweetAlert> </SweetAlert>
<DialogFormGantt
idTask={idTask}
openDialog={openDialogFormGantt}
toggleDialog={toggleDialogFormGantt}
closeDialog={closeDialogFromGantt}
parentId={parentId} />
<DialogForm <DialogForm
openDialog={openDialogForm} openDialog={openDialogForm}
closeDialog={closeDialogFromHierarchy} closeDialog={closeDialogFromHierarchy}

73
src/views/SimproV2/CreatedProyek/DialogFormGantt.js
Unescape View File

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

43
src/views/SimproV2/CreatedProyek/DialogGantt.js
Unescape View File

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

Write Preview
Loading…
Cancel
Save