Browse Source

Merge branch 'staging' of https://git.oslog.id/ordo/adw-frontend into Dev-Farhan

pull/2/head
farhan048 1 year ago
parent
commit
6a20e77aa5
  1. 2
      src/routes.js
  2. 17
      src/views/Dashboard/DashboardBOD.js
  3. 33
      src/views/Dashboard/DashboardCustomer.js
  4. 28
      src/views/Dashboard/DashboardProject.js
  5. 23
      src/views/Pages/Login/Login.js
  6. 16
      src/views/SimproV2/CreatedProyek/AsignCustProject.js
  7. 21
      src/views/SimproV2/CreatedProyek/AsignHrProject.js
  8. 290
      src/views/SimproV2/CreatedProyek/AssignK3Project.js
  9. 688
      src/views/SimproV2/CreatedProyek/DialogDocument.js
  10. 41
      src/views/SimproV2/CreatedProyek/DialogGantt.js
  11. 14
      src/views/SimproV2/CreatedProyek/DialogHierarchy.js
  12. 173
      src/views/SimproV2/CreatedProyek/ReportAnalysis.js
  13. 62
      src/views/SimproV2/CreatedProyek/index.js
  14. 24
      src/views/SimproV2/Gantt/GanttFrame.js
  15. 28
      src/views/SimproV2/Gantt/index.js
  16. 12
      src/views/SimproV2/ResourceWorker/index.js

2
src/routes.js

@ -54,7 +54,7 @@ const routes = [
{ path: '/', exact: true, name: 'Home' }, { path: '/', exact: true, name: 'Home' },
// { path: '/dashboard', name: 'Dashboard', component: Dashboard}, // { path: '/dashboard', name: 'Dashboard', component: Dashboard},
{ path: '/dashboard', name: 'DashboardBOD', component: DashboardBOD }, { path: '/dashboard', name: 'DashboardBOD', component: DashboardBOD },
{ path: '/dashboard-customer/:PROJECT_ID/:GANTT_ID', name: 'DashboardCustomer', component: DashboardCustomer }, // { path: '/dashboard-customer/:PROJECT_ID/:GANTT_ID', name: 'DashboardCustomer', component: DashboardCustomer },
{ path: '/dashboard-customer/:PROJECT_ID/:GANTT_ID/:SCURVE', name: 'DashboardCustomer', component: DashboardCustomer }, { path: '/dashboard-customer/:PROJECT_ID/:GANTT_ID/:SCURVE', name: 'DashboardCustomer', component: DashboardCustomer },
{ path: '/dashboard-project/:PROJECT_ID/:GANTT_ID', exact: true, name: 'Dashboard Project', component: DashboardProject }, { path: '/dashboard-project/:PROJECT_ID/:GANTT_ID', exact: true, name: 'Dashboard Project', component: DashboardProject },
{ path: '/dashboard-project/:PROJECT_ID/:GANTT_ID/:SCURVE', exact: true, name: 'Dashboard Project', component: DashboardProject }, { path: '/dashboard-project/:PROJECT_ID/:GANTT_ID/:SCURVE', exact: true, name: 'Dashboard Project', component: DashboardProject },

17
src/views/Dashboard/DashboardBOD.js

@ -13,8 +13,21 @@ import toRupiah from '@develoka/angka-rupiah-js';
import Icon from '@iconify/react'; import Icon from '@iconify/react';
import { HealthByBudget, HealthBySchedule } from './Components'; import { HealthByBudget, HealthBySchedule } from './Components';
const DashboardBOD = () => { const DashboardBOD = (props) => {
const token = localStorage.getItem("token") let role_id = '', user_id='',isLogin='',token='';
if (props.location.state && props.location.state.role_id && props.location.state.user_id) {
role_id = props.location.state.role_id;
user_id = props.location.state.user_id;
token = props.location.state.token;
isLogin = props.location.state.isLogin;
console.log('props.location.state success');
} else {
role_id = localStorage.getItem("role_id");
user_id = localStorage.getItem("user_id");
token = localStorage.getItem("token");
isLogin = localStorage.getItem("isLogin");
console.error('undefined in props.location.state');
}
const HEADER = { const HEADER = {
headers: { headers: {
"Content-Type": "application/json", "Content-Type": "application/json",

33
src/views/Dashboard/DashboardCustomer.js

@ -25,8 +25,21 @@ const center = {
lng: 106.816666 lng: 106.816666
} }
const DashboardCustomer = () => { const DashboardCustomer = (props) => {
const token = localStorage.getItem("token") let role_id = '', user_id='',isLogin='',token='';
if (props.location.state && props.location.state.role_id && props.location.state.user_id) {
role_id = props.location.state.role_id;
user_id = props.location.state.user_id;
token = props.location.state.token;
isLogin = props.location.state.isLogin;
console.log('props.location.state success');
} else {
role_id = localStorage.getItem("role_id");
user_id = localStorage.getItem("user_id");
token = localStorage.getItem("token");
isLogin = localStorage.getItem("isLogin");
console.error('Undefined in props.location.state');
}
const HEADER = { const HEADER = {
headers: { headers: {
"Content-Type": "application/json", "Content-Type": "application/json",
@ -34,8 +47,7 @@ const DashboardCustomer = () => {
} }
} }
const { PROJECT_ID, GANTT_ID, SCURVE } = useParams(); const { PROJECT_ID, GANTT_ID, SCURVE } = useParams();
const URL_GANTT = `https://adw-gantt.ospro.id/view-mode/index.html?base_url=${BASE_OSPRO}/api&gantt_id=${GANTT_ID}&proyek_id=${PROJECT_ID}&token=${token}&ro=1`; const URL_GANTT = `https://adw-gantt.ospro.id/view-mode/index.html?base_url=${BASE_OSPRO}/api&gantt_id=${GANTT_ID}&proyek_id=${PROJECT_ID}&token=${token}&ro=1`; const mapRef = useRef()
const mapRef = useRef()
const [projectName, setProjectName] = useState(""); const [projectName, setProjectName] = useState("");
const [projectManagerName, setProjectManagerName] = useState(''); const [projectManagerName, setProjectManagerName] = useState('');
const [customerName, setCustomerName] = useState(""); const [customerName, setCustomerName] = useState("");
@ -101,8 +113,11 @@ const DashboardCustomer = () => {
const getProjectDetail = async () => { const getProjectDetail = async () => {
setIsReadyProjectDetail(false); setIsReadyProjectDetail(false);
const URL = `${BASE_OSPRO}/api/project/detail/${PROJECT_ID}`; let URL = `${BASE_OSPRO}/api/project/detail/${PROJECT_ID}`;
const result = await axios.get(URL, HEADER).then(res => res).catch(err => err.response) URL = `${BASE_OSPRO}/api/project/detail/${PROJECT_ID}/${GANTT_ID}/1`
const result = await axios.get(URL, HEADER)
.then(res => res)
.catch(err => err.response)
console.log('getProjectDetail', result); console.log('getProjectDetail', result);
if (!result) { if (!result) {
NotificationManager.error(`Could not connect to internet.`, "Failed"); NotificationManager.error(`Could not connect to internet.`, "Failed");
@ -195,7 +210,9 @@ const DashboardCustomer = () => {
const URL = `${BASE_OSPRO}/api/project/get-overdue-activities`; const URL = `${BASE_OSPRO}/api/project/get-overdue-activities`;
const payload = { const payload = {
"id": PROJECT_ID.toString(), "id": PROJECT_ID.toString(),
"till_date": moment(new Date()).format('YYYY-MM-DD') "till_date": moment(new Date()).format('YYYY-MM-DD'),
'gantt': GANTT_ID.toString(),
'scurve': SCURVE ? SCURVE.toString() : null
} }
const result = await axios.post(URL, payload, HEADER).then(res => res).catch(err => err.response) const result = await axios.post(URL, payload, HEADER).then(res => res).catch(err => err.response)
console.log('getOverdueActivities', result); console.log('getOverdueActivities', result);
@ -431,7 +448,7 @@ const DashboardCustomer = () => {
<div style={{ display: 'flex', flexDirection: 'row', marginBottom: 10 }}> <div style={{ display: 'flex', flexDirection: 'row', marginBottom: 10 }}>
<div style={{ flex: 20, display: 'flex', flexDirection: 'column' }}> <div style={{ flex: 20, display: 'flex', flexDirection: 'column' }}>
<div style={{fontSize: 16, fontWeight: 'bold', marginBottom: 10}}>Project</div> <div style={{fontSize: 16, fontWeight: 'bold', marginBottom: 10}}>Project</div>
<div style={{fontSize: 14}}>{isReadyProjectDetail <div style={{fontSize: 14}}>{isReadyProjectDetail
? projectName ? projectName
? calculationStatus ? calculationStatus
? projectName + " - S-Curve Ready" ? projectName + " - S-Curve Ready"

28
src/views/Dashboard/DashboardProject.js

@ -124,12 +124,11 @@ const DashboardProject = () => {
const [dataGanttParents, setDataGanttParents] = useState({}); const [dataGanttParents, setDataGanttParents] = useState({});
const [isReadyGanttParents, setIsReadyGanttParents] = useState(false); const [isReadyGanttParents, setIsReadyGanttParents] = useState(false);
const [calculationStatus, setCalculationStatus] = useState(false); const [calculationStatus, setCalculationStatus] = useState(false);
const [isHierarchy, setIsHierarchy] = useState(false); const [isHierarchy, setIsHierarchy] = useState(null);
let history = useHistory(); let history = useHistory();
useEffect(() => { useEffect(() => {
getProjectDetail(); getProjectDetail();
getSCurve();
getOverdueActivities(); getOverdueActivities();
getReportDistribution(); getReportDistribution();
getComments(); getComments();
@ -140,6 +139,17 @@ const DashboardProject = () => {
}; };
}, []); }, []);
useEffect(() => {
if (isHierarchy != null) {
getSCurve();
}
window.addEventListener("message", handleIframeMessage);
return () => {
window.removeEventListener("message", handleIframeMessage);
};
}, [isHierarchy]);
useEffect(() => { useEffect(() => {
if (activeTabIdx === 1) { if (activeTabIdx === 1) {
initMap(); initMap();
@ -187,6 +197,8 @@ const DashboardProject = () => {
setDataGantt(response); setDataGantt(response);
if (response.data.data.hierarchy_ftth_id) { if (response.data.data.hierarchy_ftth_id) {
setIsHierarchy(true); setIsHierarchy(true);
} else {
setIsHierarchy(false);
} }
setIsReadyGantt(true); setIsReadyGantt(true);
} catch (error) { } catch (error) {
@ -313,12 +325,14 @@ const DashboardProject = () => {
); );
setPlannedFinish( setPlannedFinish(
SCURVE SCURVE
? result.data.data.akhir_proyek ? result.data.data.type_proyek_id === 9
? result.data.data.akhir_proyek ? result.data.data.akhir_proyek
: null ? result.data.data.akhir_proyek
: null
: result.data.data.header?.planned_end : result.data.data.header?.planned_end
? result.data.data.header?.planned_end : result.data.data.header?.planned_end
: null ? result.data.data.header?.planned_end
: null
); );
setActualStart( setActualStart(
result.data.data.header?.start_date result.data.data.header?.start_date
@ -709,7 +723,7 @@ const DashboardProject = () => {
// Send the URL back to the iframe // Send the URL back to the iframe
event.source.postMessage( event.source.postMessage(
{ action: "sendUrl", url: childUrl }, { action: "sendUrl", url: childUrl, isHierarchy: isHierarchy },
event.origin event.origin
); );
} }

23
src/views/Pages/Login/Login.js

@ -133,7 +133,7 @@ class Login extends Component {
} }
} }
getDataMenu = async (token, role_id) => { getDataMenu = async (token, role_id, user_id) => {
const config = { const config = {
headers: headers:
{ {
@ -157,15 +157,28 @@ class Login extends Component {
this.props.history.push("/dashboard-customer/58/63"); this.props.history.push("/dashboard-customer/58/63");
} }
else { else {
this.props.history.push("/dashboard"); this.props.history.push({
pathname: "/dashboard",
state: { role_id: role_id, user_id: user_id, token: token, isLogin: true }
});
} }
if (this.state.defaultPage) { if (this.state.defaultPage) {
this.props.history.push(this.state.defaultPage); if (role_id === 44) {
this.props.history.push({
pathname: this.state.defaultPage,
state: { role_id: role_id, user_id: user_id, token: token, isLogin: true }
});
} else {
this.props.history.push(this.state.defaultPage);
}
} else if (role_id == 28) { } else if (role_id == 28) {
this.props.history.push("/dashboard-customer/58/63"); this.props.history.push("/dashboard-customer/58/63");
} }
else { else {
this.props.history.push("/dashboard"); this.props.history.push({
pathname: "/dashboard",
state: { role_id: role_id, user_id: user_id, token: token, isLogin: true }
});
} }
} else { } else {
NotificationManager.error('Login Failed', 'Failed'); NotificationManager.error('Login Failed', 'Failed');
@ -209,7 +222,7 @@ class Login extends Component {
if (doLogin && doLogin.data && doLogin.data.code === 200) { if (doLogin && doLogin.data && doLogin.data.code === 200) {
const { access_token, data_user } = doLogin.data.data const { access_token, data_user } = doLogin.data.data
this.getDataRole(access_token, data_user.role_id) this.getDataRole(access_token, data_user.role_id)
this.getDataMenu(access_token, data_user.role_id) this.getDataMenu(access_token, data_user.role_id, data_user.id)
window.localStorage.setItem('isLogin', true); window.localStorage.setItem('isLogin', true);
window.localStorage.setItem('token', access_token); window.localStorage.setItem('token', access_token);
window.localStorage.setItem('user_id', data_user.id); window.localStorage.setItem('user_id', data_user.id);

16
src/views/SimproV2/CreatedProyek/AsignCustProject.js

@ -1,7 +1,7 @@
import React, { useEffect, useState, useMemo } from 'react' import React, { useEffect, useState, useMemo } from 'react'
import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap'; import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
import { Button, Form } from 'reactstrap'; import { Button, Form } from 'reactstrap';
import { Table, Tooltip } from 'antd'; import { Table, Tooltip, Spin } from 'antd';
import 'antd/dist/antd.css'; import 'antd/dist/antd.css';
import moment from 'moment'; import moment from 'moment';
import { import {
@ -25,9 +25,11 @@ const AssignCustProject = ({ openDialog, closeDialog, toggleDialog, idTask, proy
const [alertDelete, setAlertDelete] = useState(false) const [alertDelete, setAlertDelete] = useState(false)
const [idDelete, setIdDelete] = useState(0) const [idDelete, setIdDelete] = useState(0)
const [openDialogFormTools, setOpenDialogFormTools] = useState(false) const [openDialogFormTools, setOpenDialogFormTools] = useState(false)
const [loading, setLoading] = useState(true);
useEffect(() => { useEffect(() => {
if (idTask > 0) { if (idTask > 0) {
setLoading(true);
getDataAssignHr(); getDataAssignHr();
} }
}, [openDialog]); }, [openDialog]);
@ -63,8 +65,10 @@ const AssignCustProject = ({ openDialog, closeDialog, toggleDialog, idTask, proy
if (result && result.data && result.data.code == 200) { if (result && result.data && result.data.code == 200) {
let dataRes = result.data.data || [] let dataRes = result.data.data || []
const filteredData = dataRes.filter(item => item.is_customer === true); const filteredData = dataRes.filter(item => item.is_customer === true);
setdataUserToProject(filteredData); setdataUserToProject(filteredData);
setLoading(false);
} else { } else {
setLoading(false);
NotificationManager.error('Gagal Mengambil Data!!', 'Failed'); NotificationManager.error('Gagal Mengambil Data!!', 'Failed');
} }
} }
@ -185,8 +189,10 @@ const AssignCustProject = ({ openDialog, closeDialog, toggleDialog, idTask, proy
<div>Assign Customer - {proyekName}</div> <Button onClick={handleOpenDialogFormTools} size='sm' color="primary"><i className='fa fa-plus'></i></Button> <div>Assign Customer - {proyekName}</div> <Button onClick={handleOpenDialogFormTools} size='sm' color="primary"><i className='fa fa-plus'></i></Button>
</ModalHeader> </ModalHeader>
<ModalBody> <ModalBody>
{renderForm()} <Spin tip="Loading..." spinning={loading}>
{renderForm()}
</Spin>
</ModalBody> </ModalBody>
</Modal> </Modal>
<FormAsignCust <FormAsignCust

21
src/views/SimproV2/CreatedProyek/AsignHrProject.js

@ -1,7 +1,7 @@
import React, { useEffect, useState, useMemo } from 'react' import React, { useEffect, useState, useMemo } from 'react'
import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap'; import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
import { Button, Form } from 'reactstrap'; import { Button, Form } from 'reactstrap';
import { Table, Tooltip } from 'antd'; import { Table, Tooltip, Spin } from 'antd';
import 'antd/dist/antd.css'; import 'antd/dist/antd.css';
import moment from 'moment'; import moment from 'moment';
import { API_ADW, TOKEN_ADW, ASSIGN_HR_PROJECT_SEARCH, ASSIGN_HR_PROJECT_DELETE, USER_LIST, PROJECT_ROLE_SEARCH, ASSIGN_HR_PROJECT_ADD, ASSIGN_HR_PROJECT_EDIT } from '../../../const/ApiConst'; import { API_ADW, TOKEN_ADW, ASSIGN_HR_PROJECT_SEARCH, ASSIGN_HR_PROJECT_DELETE, USER_LIST, PROJECT_ROLE_SEARCH, ASSIGN_HR_PROJECT_ADD, ASSIGN_HR_PROJECT_EDIT } from '../../../const/ApiConst';
@ -25,16 +25,18 @@ const AssignHrProject = ({ openDialog, closeDialog, toggleDialog, idTask, toolsR
const [openDialogFormTools, setOpenDialogFormTools] = useState(false) const [openDialogFormTools, setOpenDialogFormTools] = useState(false)
const [dataEdit, setDataEdit] = useState(null) const [dataEdit, setDataEdit] = useState(null)
const [listUser, setListUser] = useState([]) const [listUser, setListUser] = useState([])
const [listRole, setListRole] = useState([]) const [listRole, setListRole] = useState([])
const [loading, setLoading] = useState(true);
useEffect(() => { useEffect(() => {
if (idTask > 0) { if (idTask > 0) {
setLoading(true);
getDataAssignHr(); getDataAssignHr();
} }
}, [openDialog]); }, [openDialog]);
useEffect(() => { useEffect(() => {
if (openDialog) { if (openDialog) {
getDataProjectRole(); getDataProjectRole();
getDataUser(); getDataUser();
} }
@ -70,9 +72,10 @@ const AssignHrProject = ({ openDialog, closeDialog, toggleDialog, idTask, toolsR
if (result && result.data && result.data.code == 200) { if (result && result.data && result.data.code == 200) {
let dataRes = result.data.data || [] let dataRes = result.data.data || []
setdataUserToProject(dataRes);
setdataUserToProject(dataRes); setLoading(false);
} else { } else {
setLoading(false);
NotificationManager.error('Gagal Mengambil Data!!', 'Failed'); NotificationManager.error('Gagal Mengambil Data!!', 'Failed');
} }
} }
@ -158,7 +161,7 @@ const AssignHrProject = ({ openDialog, closeDialog, toggleDialog, idTask, toolsR
} }
const handleOpenDialogFormTools = () => { const handleOpenDialogFormTools = () => {
setOpenDialogFormTools(true) setOpenDialogFormTools(true)
} }
const handleCancel = () => { const handleCancel = () => {
@ -280,8 +283,10 @@ const AssignHrProject = ({ openDialog, closeDialog, toggleDialog, idTask, toolsR
<div>Assign Human Resource - {proyekName}</div> <Button onClick={handleOpenDialogFormTools} size='sm' color="primary"><i className='fa fa-plus'></i></Button> <div>Assign Human Resource - {proyekName}</div> <Button onClick={handleOpenDialogFormTools} size='sm' color="primary"><i className='fa fa-plus'></i></Button>
</ModalHeader> </ModalHeader>
<ModalBody> <ModalBody>
{renderForm()} <Spin tip="Loading..." spinning={loading}>
{renderForm()}
</Spin>
</ModalBody> </ModalBody>
{/* <ModalFooter> {/* <ModalFooter>
<Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Close</Button> <Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Close</Button>

290
src/views/SimproV2/CreatedProyek/AssignK3Project.js

@ -1,141 +1,149 @@
import React, { useEffect, useState } from 'react' import React, { useEffect, useState } from 'react'
import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap'; import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
import { Button, Form } from 'reactstrap'; import { Button, Form } from 'reactstrap';
import axios from "../../../const/interceptorApi"; import axios from "../../../const/interceptorApi";
import { PROJECT_TO_CHECKLIST_K3_ADDS, PROJECT_TO_CHECKLIST_K3_SEARCH } from '../../../const/ApiConst'; import { PROJECT_TO_CHECKLIST_K3_ADDS, PROJECT_TO_CHECKLIST_K3_SEARCH } from '../../../const/ApiConst';
import { Transfer } from 'antd'; import { Transfer, Spin } from 'antd';
import 'antd/dist/antd.css'; import 'antd/dist/antd.css';
import { NotificationManager } from 'react-notifications';
const AssignK3Project = ({ openDialog, closeDialog, toggleDialog, idTask, dataK3, proyekName }) => {
const token = localStorage.getItem("token") const AssignK3Project = ({ openDialog, closeDialog, toggleDialog, idTask, dataK3, proyekName }) => {
const HEADER = { const token = localStorage.getItem("token")
headers: { const [loading, setLoading] = useState(true);
"Content-Type": "application/json",
"Authorization": `Bearer ${token}` const HEADER = {
} headers: {
} "Content-Type": "application/json",
const [id, setId] = useState(0) "Authorization": `Bearer ${token}`
const [targetKeys, setTargetKeys] = useState([]) }
}
const [id, setId] = useState(0)
const handleClearData = () => { const [targetKeys, setTargetKeys] = useState([])
setId(0)
setTargetKeys([])
} const handleClearData = () => {
setId(0)
useEffect(() => { setTargetKeys([])
if(!openDialog){ }
handleClearData()
} useEffect(() => {
}, [openDialog]) if(!openDialog){
handleClearData()
useEffect(() => { }
if(idTask && idTask > 0){ }, [openDialog])
getK3toProject()
} useEffect(() => {
}, [idTask]) if (idTask && idTask > 0) {
setLoading(true);
const getK3toProject = async () => { getK3toProject()
const payload = { }
"columns": [ }, [idTask])
{ "name": "proyek_id", "logic_operator": "=", "value": idTask, "operator": "AND" }
] const getK3toProject = async () => {
} const payload = {
const result = await axios "columns": [
.post(PROJECT_TO_CHECKLIST_K3_SEARCH, payload, HEADER) { "name": "proyek_id", "logic_operator": "=", "value": idTask, "operator": "AND" }
.then(res => res) ]
.catch((error) => error.response); }
const result = await axios
if(result && result.status==200){ .post(PROJECT_TO_CHECKLIST_K3_SEARCH, payload, HEADER)
console.log("cek get project to checklist k3",result.data.data) .then(res => res)
let data = result.data.data || [] .catch((error) => error.response);
let newTargetKeys = []
if (data.length > 0) { if(result && result.status==200){
data.map((val,index)=> { console.log("cek get project to checklist k3",result.data.data)
newTargetKeys.push(val.checklist_k3_id) let data = result.data.data || []
}); let newTargetKeys = []
} if (data.length > 0) {
setTargetKeys(newTargetKeys) data.map((val,index)=> {
}else{ newTargetKeys.push(val.checklist_k3_id)
});
} }
} setTargetKeys(newTargetKeys)
setLoading(false);
const handleSave = async () => { }else{
await saveAssign() setLoading(false);
handleClearData() NotificationManager.error('Gagal Mengambil Data!!', 'Failed');
} }
}
const saveAssign= async () => {
const handleSave = async () => {
const formData = { await saveAssign()
checklist_k3_id:targetKeys, handleClearData()
proyek_id:idTask }
}
const saveAssign= async () => {
const result = await axios
.post(PROJECT_TO_CHECKLIST_K3_ADDS, formData, HEADER) const formData = {
.then(res => res) checklist_k3_id:targetKeys,
.catch((error) => error.response); proyek_id:idTask
}
if(result && result.status==200){ const result = await axios
closeDialog('success') .post(PROJECT_TO_CHECKLIST_K3_ADDS, formData, HEADER)
}else{ .then(res => res)
closeDialog('failed') .catch((error) => error.response);
}
}
if(result && result.status==200){
const handleCancel = () => { closeDialog('success')
closeDialog('cancel') }else{
handleClearData() closeDialog('failed')
} }
}
const handleChange = targetKeys => {
setTargetKeys(targetKeys) const handleCancel = () => {
}; closeDialog('cancel')
handleClearData()
const renderForm = () => { }
return (
<div style={{ const handleChange = targetKeys => {
alignContent: "center", setTargetKeys(targetKeys)
justifyContent: "center !imporant", };
paddingLeft: 20,
paddingRight: 20, const renderForm = () => {
overflow: "auto" return (
}}> <div style={{
<Transfer alignContent: "center",
showSearch justifyContent: "center !imporant",
titles={['Available K3', 'Assigned to Project']} paddingLeft: 20,
dataSource={dataK3} paddingRight: 20,
targetKeys={targetKeys} overflow: "auto"
onChange={handleChange} }}>
render={item => item.title} <Transfer
listStyle={{ showSearch
width: 250, titles={['Available K3', 'Assigned to Project']}
height: 300, dataSource={dataK3}
}} targetKeys={targetKeys}
/> onChange={handleChange}
</div> render={item => item.title}
) listStyle={{
} width: 250,
height: 300,
}}
return ( />
<> </div>
<Modal size="lg" style={{maxWidth: '600px', width: '100%'}} isOpen={openDialog} toggle={toggleDialog}> )
<ModalHeader className="capitalize" toggle={closeDialog}>Assign K3 to Project {proyekName !== '' ? `- ${proyekName}` : ''}</ModalHeader> }
<ModalBody>
{renderForm()}
</ModalBody> return (
<ModalFooter> <>
<Button color="primary" onClick={() => handleSave()}>Save</Button>{' '} <Modal size="lg" style={{maxWidth: '600px', width: '100%'}} isOpen={openDialog} toggle={toggleDialog}>
<Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Cancel</Button> <ModalHeader className="capitalize" toggle={closeDialog}>Assign K3 to Project {proyekName !== '' ? `- ${proyekName}` : ''}</ModalHeader>
</ModalFooter> <ModalBody>
</Modal> <Spin tip="Loading..." spinning={loading}>
</> {renderForm()}
) </Spin>
</ModalBody>
} <ModalFooter>
<Button color="primary" onClick={() => handleSave()}>Save</Button>{' '}
export default AssignK3Project; <Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Cancel</Button>
</ModalFooter>
</Modal>
</>
)
}
export default AssignK3Project;

688
src/views/SimproV2/CreatedProyek/DialogDocument.js

@ -1,341 +1,347 @@
import React, { useEffect, useState, useMemo } from 'react' import React, { useEffect, useState, useMemo } from 'react'
import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap'; import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
import { Button } from 'reactstrap'; import { Button } from 'reactstrap';
import { Table, Tooltip, Popover } from 'antd'; import { Table, Tooltip, Popover, Spin } 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 { DOCUMENT_DOWNLOAD, DOCUMENT_GET, BASE_SIMPRO_LUMEN_FILE, REQUEST_MATERIAL_EDIT, DOCUMENT_DELETE, DOCUMENT_SEARCH, FOLDER_DOCUMENT_PROYEK_GET_TREE, FOLDER_DOCUMENT_PROYEK_DELETE } from '../../../const/ApiConst'; import { DOCUMENT_DOWNLOAD, DOCUMENT_GET, BASE_SIMPRO_LUMEN_FILE, REQUEST_MATERIAL_EDIT, DOCUMENT_DELETE, DOCUMENT_SEARCH, FOLDER_DOCUMENT_PROYEK_GET_TREE, FOLDER_DOCUMENT_PROYEK_DELETE } 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 DialogRequest from './FormDocument'; import DialogRequest from './FormDocument';
import DialogRequestFolder from './FormFolderDocument'; import DialogRequestFolder from './FormFolderDocument';
const DialogDocument = ({ openDialog, closeDialog, toggleDialog, idTask, proyekName }) => { const DialogDocument = ({ openDialog, closeDialog, toggleDialog, idTask, proyekName }) => {
const token = localStorage.getItem("token") const token = localStorage.getItem("token")
const HEADER = { const HEADER = {
headers: { headers: {
"Content-Type": "application/json", "Content-Type": "application/json",
"Authorization": `Bearer ${token}` "Authorization": `Bearer ${token}`
} }
} }
const config = { const config = {
headers: headers:
{ {
Authorization: `Bearer ${token}`, Authorization: `Bearer ${token}`,
"Content-type": `application/json` "Content-type": `application/json`
} }
}; };
const [dataDocument, setDataDocument] = useState([]) const [dataDocument, setDataDocument] = useState([])
const [openDialogReq, setOpenDialogReq] = useState(false) const [openDialogReq, setOpenDialogReq] = useState(false)
const [openDialogNewFolder, setOpenDialogNewFolder] = useState(false) const [openDialogNewFolder, setOpenDialogNewFolder] = useState(false)
const [alertDelete, setAlertDelete] = useState(false) const [alertDelete, setAlertDelete] = useState(false)
const [alertDeleteFolder, setAlertDeleteFolder] = useState(false) const [alertDeleteFolder, setAlertDeleteFolder] = useState(false)
const [idDelete, setIdDelete] = useState(0) const [idDelete, setIdDelete] = useState(0)
const [dataEdit, setDataEdit] = useState(null) const [dataEdit, setDataEdit] = useState(null)
const [parentIdNewFolder, setParentIdNewFolder] = useState(0) const [parentIdNewFolder, setParentIdNewFolder] = useState(0)
const [loading, setLoading] = useState(true);
useEffect(() => {
if (idTask > 0) { useEffect(() => {
getDataDocument(); if (idTask > 0) {
} setLoading(true);
}, [idTask, openDialog]) getDataDocument();
}
useEffect(() => { }, [idTask, openDialog])
if (!openDialog) {
setDataDocument([]); useEffect(() => {
} else { if (!openDialog) {
setDataDocument([]);
} } else {
}, [openDialog])
}
}, [openDialog])
const getDataDocument = async () => {
const url = FOLDER_DOCUMENT_PROYEK_GET_TREE(idTask)
const result = await axios const getDataDocument = async () => {
.get(url, config) const url = FOLDER_DOCUMENT_PROYEK_GET_TREE(idTask)
.then(res => res) const result = await axios
.catch((error) => error.response); .get(url, config)
if (result && result.data && result.data.code == 200) { .then(res => res)
setDataDocument(result.data.data); .catch((error) => error.response);
} else { if (result && result.data && result.data.code == 200) {
NotificationManager.error('Gagal mengambil data, Silahkan coba lagi!!', 'Failed'); setDataDocument(result.data.data);
} setLoading(false);
} } else {
setLoading(false);
const handleCancel = () => { NotificationManager.error('Gagal mengambil data, Silahkan coba lagi!!', 'Failed');
setDataDocument([]); }
closeDialog('cancel', 'none') }
}
const handleCancel = () => {
const handleDelete = (id) => { setDataDocument([]);
setIdDelete(id) closeDialog('cancel', 'none')
setAlertDelete(true) }
}
const handleDelete = (id) => {
const handleDeleteFolder = (id) => { setIdDelete(id)
setIdDelete(id) setAlertDelete(true)
setAlertDeleteFolder(true) }
}
const handleDeleteFolder = (id) => {
const handleDownload = (id, file) => { setIdDelete(id)
fetch(DOCUMENT_DOWNLOAD(id), { setAlertDeleteFolder(true)
headers: new Headers({ }
'Content-Type': 'application/json',
'Authorization': `Bearer ${token}` const handleDownload = (id, file) => {
}) fetch(DOCUMENT_DOWNLOAD(id), {
}) headers: new Headers({
.then(response => { 'Content-Type': 'application/json',
response.blob().then(blob => { 'Authorization': `Bearer ${token}`
const url = window.URL.createObjectURL(new Blob([blob])); })
let a = document.createElement('a'); })
a.href = url; .then(response => {
a.download = file; response.blob().then(blob => {
a.click(); const url = window.URL.createObjectURL(new Blob([blob]));
a.remove(); let a = document.createElement('a');
}); a.href = url;
//window.location.href = response.url; a.download = file;
}); a.click();
// const urlDownload = DOCUMENT_DOWNLOAD(id); a.remove();
// window.open(urlDownload); });
} //window.location.href = response.url;
});
const handleShow = (file) => { // const urlDownload = DOCUMENT_DOWNLOAD(id);
const urlShow = `${BASE_SIMPRO_LUMEN_FILE}/${file}` // window.open(urlDownload);
window.open(urlShow); }
}
const handleShow = (file) => {
const handleNewFolderParent = (folderId) => { const urlShow = `${BASE_SIMPRO_LUMEN_FILE}/${file}`
setParentIdNewFolder(folderId) window.open(urlShow);
setOpenDialogNewFolder(true) }
}
const handleNewFolderParent = (folderId) => {
const handleNewFolderWOParent = () => { setParentIdNewFolder(folderId)
setParentIdNewFolder(0) setOpenDialogNewFolder(true)
setOpenDialogNewFolder(true) }
}
const handleNewFolderWOParent = () => {
const handleNewFileParent = (folderId) => { setParentIdNewFolder(0)
setParentIdNewFolder(folderId) setOpenDialogNewFolder(true)
openDialogRequest() }
}
const handleNewFileParent = (folderId) => {
const handleNewFileWOParent = () => { setParentIdNewFolder(folderId)
setParentIdNewFolder(0) openDialogRequest()
openDialogRequest() }
}
const handleNewFileWOParent = () => {
const renderShowDokumen = (file) => { setParentIdNewFolder(0)
let arrayFile = file.split(".") openDialogRequest()
let length = arrayFile.length }
length = length - 1
const fileExt = arrayFile[length]; const renderShowDokumen = (file) => {
if (fileExt == "pdf" || fileExt == "png" || fileExt == "jpg" || fileExt == "jpeg" || fileExt == "gif") { let arrayFile = file.split(".")
return ( let length = arrayFile.length
<Tooltip title="View Document"> length = length - 1
<Button size={"sm"} color='info' style={{ color: "#FFFFFF" }} onClick={() => handleShow(file)}><i className="fa fa-eye"></i></Button> const fileExt = arrayFile[length];
</Tooltip> if (fileExt == "pdf" || fileExt == "png" || fileExt == "jpg" || fileExt == "jpeg" || fileExt == "gif") {
) return (
} <Tooltip title="View Document">
} <Button size={"sm"} color='info' style={{ color: "#FFFFFF" }} onClick={() => handleShow(file)}><i className="fa fa-eye"></i></Button>
const RenderTable = useMemo(() => { </Tooltip>
const columns = [ )
{ }
title: 'Action', }
dataIndex: '', const RenderTable = useMemo(() => {
key: 'id', const columns = [
className: "nowrap", {
render: (text, record) => title: 'Action',
<> dataIndex: '',
{!record.isDir && <Tooltip title="Delete Document"> key: 'id',
<Button size={"sm"} color='danger' onClick={() => handleDelete(text.id)}><i className="fa fa-trash"></i></Button> className: "nowrap",
</Tooltip>}{" "} render: (text, record) =>
{record.isDir && <Tooltip title="Delete Folder"> <>
<Button size={"sm"} color='danger' onClick={() => handleDeleteFolder(text.id)}><i className="fa fa-trash"></i></Button> {!record.isDir && <Tooltip title="Delete Document">
</Tooltip>}{" "} <Button size={"sm"} color='danger' onClick={() => handleDelete(text.id)}><i className="fa fa-trash"></i></Button>
{!record.isDir && <Tooltip title="Download Document"> </Tooltip>}{" "}
<Button size={"sm"} color='primary' onClick={() => handleDownload(text.id, text.file)}><i className="fa fa-download"></i></Button> {record.isDir && <Tooltip title="Delete Folder">
</Tooltip>}{" "} <Button size={"sm"} color='danger' onClick={() => handleDeleteFolder(text.id)}><i className="fa fa-trash"></i></Button>
{record.isDir && <Tooltip title="New Folder"> </Tooltip>}{" "}
<Button size="sm" color="success" onClick={() => handleNewFolderParent(record.id)}><i className="fa fa-folder"></i></Button> {!record.isDir && <Tooltip title="Download Document">
</Tooltip>}{" "} <Button size={"sm"} color='primary' onClick={() => handleDownload(text.id, text.file)}><i className="fa fa-download"></i></Button>
{record.isDir && <Tooltip title="New File"> </Tooltip>}{" "}
<Button size="sm" color="primary" onClick={() => handleNewFileParent(record.id)}><i className="fa fa-file"></i></Button> {record.isDir && <Tooltip title="New Folder">
</Tooltip>}{" "} <Button size="sm" color="success" onClick={() => handleNewFolderParent(record.id)}><i className="fa fa-folder"></i></Button>
{text.file ? renderShowDokumen(text.file) : ""} </Tooltip>}{" "}
</> {record.isDir && <Tooltip title="New File">
, <Button size="sm" color="primary" onClick={() => handleNewFileParent(record.id)}><i className="fa fa-file"></i></Button>
}, </Tooltip>}{" "}
{ title: 'Document Name', dataIndex: 'name_folder', key: 'name_folder', render: (text, record) => record.isDir ? record.name_folder : record.file }, {text.file ? renderShowDokumen(text.file) : ""}
{ title: 'Type', dataIndex: 'isDir', key: 'isDir', render: (text, record) => record.isDir ? 'Folder' : 'File' }, </>
{ title: 'Upload Date', dataIndex: 'created_at', key: 'created_at', render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{text ? moment(text).format("D-M-YYYY") : "-"}</div>) } ,
]; },
{ title: 'Document Name', dataIndex: 'name_folder', key: 'name_folder', render: (text, record) => record.isDir ? record.name_folder : record.file },
return ( { title: 'Type', dataIndex: 'isDir', key: 'isDir', render: (text, record) => record.isDir ? 'Folder' : 'File' },
<Table { title: 'Upload Date', dataIndex: 'created_at', key: 'created_at', render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{text ? moment(text).format("D-M-YYYY") : "-"}</div>) }
size="small" ];
columns={columns}
rowKey={"id"} return (
dataSource={dataDocument} <Table
pagination={{ position: ["bottomLeft"] }} size="small"
/> columns={columns}
) rowKey={"id"}
}, [dataDocument]) dataSource={dataDocument}
pagination={{ position: ["bottomLeft"] }}
const closeDialogReq = (type) => { />
if (type == "upload") { )
getDataDocument(); }, [dataDocument])
}
setOpenDialogReq(false); const closeDialogReq = (type) => {
} if (type == "upload") {
getDataDocument();
const toggleDialogReq = () => { }
setOpenDialogReq(!openDialogReq) setOpenDialogReq(false);
} }
const openDialogRequest = () => { const toggleDialogReq = () => {
setOpenDialogReq(true) setOpenDialogReq(!openDialogReq)
} }
const cancelDelete = () => { const openDialogRequest = () => {
setAlertDelete(false) setOpenDialogReq(true)
setIdDelete(0) }
}
const cancelDelete = () => {
const cancelDeleteFolder = () => { setAlertDelete(false)
setAlertDeleteFolder(false) setIdDelete(0)
setIdDelete(0) }
}
const cancelDeleteFolder = () => {
const onConfirmDelete = async () => { setAlertDeleteFolder(false)
let urlDel = DOCUMENT_DELETE(idDelete) setIdDelete(0)
const result = await axios.delete(urlDel, HEADER) }
.then(res => res)
.catch((error) => error.response); const onConfirmDelete = async () => {
let urlDel = DOCUMENT_DELETE(idDelete)
if (result && result.data && result.data.code === 200) { const result = await axios.delete(urlDel, HEADER)
getDataDocument() .then(res => res)
setIdDelete(0) .catch((error) => error.response);
setAlertDelete(false)
NotificationManager.success(`Dokumen project berhasil dihapus`, 'Success!!'); if (result && result.data && result.data.code === 200) {
} else { getDataDocument()
setIdDelete(0) setIdDelete(0)
setAlertDelete(false) setAlertDelete(false)
NotificationManager.error(`Dokumen project gagal dihapus`, 'Failed!!'); NotificationManager.success(`Dokumen project berhasil dihapus`, 'Success!!');
} } else {
} setIdDelete(0)
setAlertDelete(false)
const onConfirmDeleteFolder = async () => { NotificationManager.error(`Dokumen project gagal dihapus`, 'Failed!!');
let urlDel = FOLDER_DOCUMENT_PROYEK_DELETE(idDelete) }
const result = await axios.delete(urlDel, HEADER) }
.then(res => res)
.catch((error) => error.response); const onConfirmDeleteFolder = async () => {
let urlDel = FOLDER_DOCUMENT_PROYEK_DELETE(idDelete)
if (result && result.data && result.data.code === 200) { const result = await axios.delete(urlDel, HEADER)
getDataDocument() .then(res => res)
setIdDelete(0) .catch((error) => error.response);
setAlertDeleteFolder(false)
NotificationManager.success(`Folder berhasil dihapus`, 'Success!!'); if (result && result.data && result.data.code === 200) {
} else { getDataDocument()
setIdDelete(0) setIdDelete(0)
setAlertDeleteFolder(false) setAlertDeleteFolder(false)
NotificationManager.error(`Folder gagal dihapus`, 'Failed!!'); NotificationManager.success(`Folder berhasil dihapus`, 'Success!!');
} } else {
} setIdDelete(0)
setAlertDeleteFolder(false)
const closeDialogNewFolder = (type) => { NotificationManager.error(`Folder gagal dihapus`, 'Failed!!');
if (type == "upload") { }
getDataDocument(); }
}
setOpenDialogNewFolder(false); const closeDialogNewFolder = (type) => {
setParentIdNewFolder(0); if (type == "upload") {
} getDataDocument();
}
const toggleDialogNewFolder = () => { setOpenDialogNewFolder(false);
setOpenDialogNewFolder(!openDialogNewFolder) setParentIdNewFolder(0);
} }
return ( const toggleDialogNewFolder = () => {
<> setOpenDialogNewFolder(!openDialogNewFolder)
<Modal size="xl" isOpen={openDialog} toggle={toggleDialog}> }
<ModalHeader className="capitalize withBtn" toggle={closeDialog} style={{ width: "100%" }}>
<div>Project Documents - {proyekName} </div> return (
{/* <Button onClick={openDialogRequest} size='sm' color="primary"><i className='fa fa-plus'></i></Button> */} <>
{/* <Popover placement="bottom" title="Add" content={popupAddDoc()} trigger="click"> <Modal size="xl" isOpen={openDialog} toggle={toggleDialog}>
<Button size='sm' color="primary"><i className='fa fa-plus'></i></Button> <ModalHeader className="capitalize withBtn" toggle={closeDialog} style={{ width: "100%" }}>
</Popover> */} <div>Project Documents - {proyekName} </div>
<div> {/* <Button onClick={openDialogRequest} size='sm' color="primary"><i className='fa fa-plus'></i></Button> */}
<Tooltip title="New Folder"> {/* <Popover placement="bottom" title="Add" content={popupAddDoc()} trigger="click">
<Button size="sm" color="success" onClick={handleNewFolderWOParent}><i className="fa fa-folder"></i></Button> <Button size='sm' color="primary"><i className='fa fa-plus'></i></Button>
</Tooltip> </Popover> */}
<span style={{ marginLeft: 5, marginRight: 5 }}></span> <div>
<Tooltip title="New File"> <Tooltip title="New Folder">
<Button size="sm" color="primary" onClick={handleNewFileWOParent}><i className="fa fa-file"></i></Button> <Button size="sm" color="success" onClick={handleNewFolderWOParent}><i className="fa fa-folder"></i></Button>
</Tooltip> </Tooltip>
</div> <span style={{ marginLeft: 5, marginRight: 5 }}></span>
{/* <Button onClick={openDialogRequest} size='sm' color="primary"><i className='fa fa-folder'></i></Button> */} <Tooltip title="New File">
</ModalHeader> <Button size="sm" color="primary" onClick={handleNewFileWOParent}><i className="fa fa-file"></i></Button>
<ModalBody> </Tooltip>
<div style={{ width: '100%', overflow: "auto" }}> </div>
{RenderTable} {/* <Button onClick={openDialogRequest} size='sm' color="primary"><i className='fa fa-folder'></i></Button> */}
</div> </ModalHeader>
</ModalBody> <ModalBody>
{/* <ModalFooter> <Spin tip="Loading..." spinning={loading}>
<Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Batal</Button> <div style={{ width: '100%', overflow: "auto" }}>
</ModalFooter> */} {RenderTable}
</Modal> </div>
<NotificationContainer /> </Spin>
<SweetAlert </ModalBody>
show={alertDelete} {/* <ModalFooter>
warning <Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Batal</Button>
showCancel </ModalFooter> */}
confirmBtnText="Delete" </Modal>
confirmBtnBsStyle="danger" <NotificationContainer />
title={`Are you sure?`} <SweetAlert
onConfirm={onConfirmDelete} show={alertDelete}
onCancel={() => cancelDelete()} warning
focusCancelBtn showCancel
> confirmBtnText="Delete"
Delete this data confirmBtnBsStyle="danger"
</SweetAlert> title={`Are you sure?`}
onConfirm={onConfirmDelete}
<SweetAlert onCancel={() => cancelDelete()}
show={alertDeleteFolder} focusCancelBtn
warning >
showCancel Delete this data
confirmBtnText="Delete" </SweetAlert>
confirmBtnBsStyle="danger"
title={`Are you sure?`} <SweetAlert
onConfirm={onConfirmDeleteFolder} show={alertDeleteFolder}
onCancel={() => cancelDeleteFolder()} warning
focusCancelBtn showCancel
> confirmBtnText="Delete"
Delete this folder confirmBtnBsStyle="danger"
</SweetAlert> title={`Are you sure?`}
onConfirm={onConfirmDeleteFolder}
<DialogRequest onCancel={() => cancelDeleteFolder()}
openDialog={openDialogReq} focusCancelBtn
closeDialog={closeDialogReq} >
toggleDialog={toggleDialogReq} Delete this folder
idTask={idTask} </SweetAlert>
parentIdNewFolder={parentIdNewFolder}
dataEdit={dataEdit} <DialogRequest
/> openDialog={openDialogReq}
closeDialog={closeDialogReq}
<DialogRequestFolder toggleDialog={toggleDialogReq}
openDialog={openDialogNewFolder} idTask={idTask}
closeDialog={closeDialogNewFolder} parentIdNewFolder={parentIdNewFolder}
toggleDialog={toggleDialogNewFolder} dataEdit={dataEdit}
idTask={idTask} />
parentIdNewFolder={parentIdNewFolder}
dataEdit={dataEdit} <DialogRequestFolder
/> openDialog={openDialogNewFolder}
</> closeDialog={closeDialogNewFolder}
) toggleDialog={toggleDialogNewFolder}
idTask={idTask}
} parentIdNewFolder={parentIdNewFolder}
dataEdit={dataEdit}
export default DialogDocument; />
</>
)
}
export default DialogDocument;

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

@ -1,7 +1,7 @@
import React, { useEffect, useState, useMemo } from 'react' import React, { useEffect, useState, useMemo } from 'react'
import { Modal, ModalHeader, ModalBody, ModalFooter, Breadcrumb, BreadcrumbItem} from 'reactstrap'; import { Modal, ModalHeader, ModalBody, ModalFooter, Breadcrumb, BreadcrumbItem} from 'reactstrap';
import { Button } from 'reactstrap'; import { Button } from 'reactstrap';
import { Table, Tooltip } from 'antd'; import { Table, Tooltip, Spin } 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';
@ -13,8 +13,20 @@ import DialogUserGantt from './DialogUserGantt';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
const DialogGantt = ({ openDialog, closeDialog, toggleDialog, idTask, proyekName, hierarchyId, hierarchyName, openDialogHierarchy }) => { const DialogGantt = ({ openDialog, closeDialog, toggleDialog, idTask, proyekName, hierarchyId, hierarchyName, openDialogHierarchy, isLogin, token, role_id, user_id }) => {
const token = localStorage.getItem("token") if (role_id && user_id && token && isLogin) {
role_id = role_id;
user_id = user_id;
token = token;
isLogin = isLogin;
console.log('props.location.state success');
} else {
role_id = localStorage.getItem("role_id");
user_id = localStorage.getItem("user_id");
token = localStorage.getItem("token");
isLogin = localStorage.getItem("isLogin");
console.error('Undefined in props.location.state');
}
const HEADER = { const HEADER = {
headers: { headers: {
"Content-Type": "application/json", "Content-Type": "application/json",
@ -31,9 +43,11 @@ const DialogGantt = ({ openDialog, closeDialog, toggleDialog, idTask, proyekName
const [humanResource, setHumanResource] = useState([]) const [humanResource, setHumanResource] = useState([])
const [dataEdit, setDataEdit] = useState([]) const [dataEdit, setDataEdit] = useState([])
const [typeDialog, setTypeDialog] = useState('') const [typeDialog, setTypeDialog] = useState('')
const [loading, setLoading] = useState(true);
useEffect(() => { useEffect(() => {
if (openDialog && hierarchyId > 0 || idTask > 0 && !openDialogHierarchy) { if (openDialog && hierarchyId > 0 || idTask > 0 && !openDialogHierarchy) {
setLoading(true);
getdataGantt(); getdataGantt();
} }
if (!openDialog) { if (!openDialog) {
@ -92,8 +106,13 @@ const DialogGantt = ({ openDialog, closeDialog, toggleDialog, idTask, proyekName
.catch((error) => error.response); .catch((error) => error.response);
if (result && result.status == 200) { if (result && result.status == 200) {
setDataGantt(result.data.data); const sortedData = result.data.data.sort((a, b) => {
return a.name_version.toLowerCase().localeCompare(b.name_version.toLowerCase());
});
setDataGantt(sortedData);
setLoading(false);
} else { } else {
setLoading(false);
NotificationManager.error(`Data gantt project gagal terload silahkan coba lagi!`, 'Failed!!'); NotificationManager.error(`Data gantt project gagal terload silahkan coba lagi!`, 'Failed!!');
} }
} }
@ -144,7 +163,15 @@ const DialogGantt = ({ openDialog, closeDialog, toggleDialog, idTask, proyekName
</Tooltip>{" "} </Tooltip>{" "}
</Link> </Link>
<Link to={`/projects/${text.id}/${idTask}/gantt`}> <Link to={{
pathname: `/projects/${text.id}/${idTask}/gantt`,
state: {
isLogin: isLogin,
token: token,
role_id: role_id,
user_id: user_id,
}
}}>
<Tooltip title="Gantt"> <Tooltip title="Gantt">
<Button 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>{" "}
@ -251,7 +278,9 @@ const DialogGantt = ({ openDialog, closeDialog, toggleDialog, idTask, proyekName
</ModalHeader> </ModalHeader>
<ModalBody> <ModalBody>
<div style={{ width: '100%', overflow: "auto" }}> <div style={{ width: '100%', overflow: "auto" }}>
{RenderTable} <Spin tip="Loading..." spinning={loading}>
{RenderTable}
</Spin>
</div> </div>
</ModalBody> </ModalBody>
{/* <ModalFooter> {/* <ModalFooter>

14
src/views/SimproV2/CreatedProyek/DialogHierarchy.js

@ -1,7 +1,7 @@
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 { Space, Table, Tooltip } from 'antd'; import { Space, Table, Tooltip, Spin } 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';
@ -41,8 +41,10 @@ const DialogHierarchy = ({ openDialog, closeDialog, toggleDialog, idTask, proyek
const [idGantt, setIdGantt] = useState(0) const [idGantt, setIdGantt] = useState(0)
const [humanResource, setHumanResource] = useState([]) const [humanResource, setHumanResource] = useState([])
const { t } = useTranslation(); const { t } = useTranslation();
const [loading, setLoading] = useState(true);
useEffect(() => { useEffect(() => {
if (idTask > 0) { if (idTask > 0) {
setLoading(true);
getdataHierarchy(); getdataHierarchy();
} }
}, [saveHierarchy, idTask, openDialog, closeDialog, openDialogFormGantt]) }, [saveHierarchy, idTask, openDialog, closeDialog, openDialogFormGantt])
@ -157,7 +159,9 @@ const DialogHierarchy = ({ openDialog, closeDialog, toggleDialog, idTask, proyek
if (result && result.status == 200) { if (result && result.status == 200) {
const sortedData = _.orderBy(result.data.data, ['name'], ['asc']); const sortedData = _.orderBy(result.data.data, ['name'], ['asc']);
setDataHierarchy(sortedData); setDataHierarchy(sortedData);
setLoading(false);
} else { } else {
setLoading(false);
NotificationManager.error(`Data gantt project gagal terload silahkan coba lagi!`, 'Failed!!'); NotificationManager.error(`Data gantt project gagal terload silahkan coba lagi!`, 'Failed!!');
} }
} }
@ -285,9 +289,11 @@ const DialogHierarchy = ({ openDialog, closeDialog, toggleDialog, idTask, proyek
</Tooltip> </Tooltip>
</ModalHeader> </ModalHeader>
<ModalBody> <ModalBody>
<div style={{ width: '100%', overflow: "auto" }}> <Spin tip="Loading..." spinning={loading}>
{RenderTable} <div style={{ width: '100%', overflow: "auto" }}>
</div> {RenderTable}
</div>
</Spin>
</ModalBody> </ModalBody>
{/* <ModalFooter> {/* <ModalFooter>
<Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Batal</Button> <Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Batal</Button>

173
src/views/SimproV2/CreatedProyek/ReportAnalysis.js

@ -1,7 +1,21 @@
import React, {useState, useEffect} from 'react' import React, {useState, useEffect} from 'react'
import { Modal, ModalHeader, ModalBody, ModalFooter, Card, CardHeader, CardBody } from 'reactstrap'; import {
import { TabContent, TabPane, Nav, NavItem, NavLink, Row, Col, Input } from 'reactstrap'; Modal,
import { Button } from 'reactstrap'; ModalHeader,
ModalBody,
ModalFooter,
Card,
CardHeader,
CardBody,
TabContent,
TabPane,
Nav,
NavItem,
NavLink,
Row,
Col,
Button
} from 'reactstrap';
import axios from "../../../const/interceptorApi"; import axios from "../../../const/interceptorApi";
import { import {
NotificationManager, NotificationManager,
@ -9,7 +23,7 @@ import {
import { BASE_SIMPRO_LUMEN } from "../../../const/ApiConst"; import { BASE_SIMPRO_LUMEN } from "../../../const/ApiConst";
import 'antd/dist/antd.css'; import 'antd/dist/antd.css';
import './style.css' import './style.css'
import { Select, Table, Tooltip } from 'antd'; import { Select, Table, Tooltip, Spin } from 'antd';
import DialogFormAnalysis from './DialogFormAnalysis'; import DialogFormAnalysis from './DialogFormAnalysis';
import moment from "moment"; import moment from "moment";
const { Option } = Select const { Option } = Select
@ -21,12 +35,15 @@ const ReportAnalysis = ({ openDialog, closeDialog, toggleDialog, projectId }) =>
const [openDialogFormAnalysis, setOpenDialogFormAnalysis] = useState(false); const [openDialogFormAnalysis, setOpenDialogFormAnalysis] = useState(false);
const [dataDetail, setDataDetail] = useState(null); const [dataDetail, setDataDetail] = useState(null);
const [avgActivityHr, setAvgActivityHr] = useState(0); const [avgActivityHr, setAvgActivityHr] = useState(0);
const [sumVolPlan, setSumVolPlan] = useState(0);
const [sumVolAct, setSumVolAct] = useState(0);
const [avgActivity, setAvgActivity] = useState(0); const [avgActivity, setAvgActivity] = useState(0);
const [dataTable, setDatatable] = useState([]); const [dataTable, setDatatable] = useState([]);
const [dataTableActivityToHr, setDataTableActivityToHr] = useState([]); const [dataTableActivityToHr, setDataTableActivityToHr] = useState([]);
const [hrList, setHrList] = useState([]); const [hrList, setHrList] = useState([]);
const [groupedActivity, setGroupedActivity] = useState([]); const [groupedActivity, setGroupedActivity] = useState([]);
const [selectedHr, setSelectedHr] = useState(null); const [selectedHr, setSelectedHr] = useState(null);
const [loading, setLoading] = useState(false);
const toggle = (tab) => { const toggle = (tab) => {
if (activeTab !== tab) { if (activeTab !== tab) {
@ -57,7 +74,57 @@ const ReportAnalysis = ({ openDialog, closeDialog, toggleDialog, projectId }) =>
const columns = [ const columns = [
{title: "Gantt", dataIndex: "name_version", key: "name_version"}, {title: "Gantt", dataIndex: "name_version", key: "name_version"},
{title: "Assign HR", dataIndex: "user_name", key: "user_name"}, {title: "Baseline Start", dataIndex: "planned_start", key: "planned_start",
render: (text, record) => (
<>
{record.planned_start ? moment(record.planned_start).format("DD-MM-YY") : ''}
</>
),
},
{title: "Baseline Finish", dataIndex: "planned_end", key: "planned_end",
render: (text, record) => (
<>
{record.planned_end ? moment(record.planned_end).format("DD-MM-YY") : ''}
</>
),
},
{title: "Early Start", dataIndex: "start_date", key: "start_date",
render: (text, record) => (
<>
{moment(record.start_date).format("DD-MM-YY")}
</>
),
},
{title: "Early Finish", dataIndex: "end_date", key: "end_date",
render: (text, record) => (
<>
{moment(record.end_date).format("DD-MM-YY")}
</>
),
},
{title: "Actual Start", dataIndex: "actual_start", key: "actual_start",
render: (text, record) => (
<>
{record.actual_start ? moment(record.actual_start).format("DD-MM-YY") : ""}
</>
),
},
{title: "Actual Finish", dataIndex: "actual_end", key: "actual_end",
render: (text, record) => (
<>
{record.actual_end ? moment(record.actual_end).format("DD-MM-YY") : ""}
</>
),
},
{title: "Assign HR", dataIndex: "user_name", key: "user_name", width: "8%",
ellipsis:{
showTitle: true
},
render: (text) =>
<Tooltip placement="topLeft" title={text}>
{text}
</Tooltip>
},
{title: "Volume Plan", dataIndex: "qty_planning", key: "qty_planning", {title: "Volume Plan", dataIndex: "qty_planning", key: "qty_planning",
render: (text, record) => render: (text, record) =>
<> <>
@ -81,7 +148,7 @@ const ReportAnalysis = ({ openDialog, closeDialog, toggleDialog, projectId }) =>
); );
}, },
}, },
{title: "Progress Actual (%)", dataIndex: "persentase_progress", key: "persentase_progress"}, {title: "Progress Actual (%)", dataIndex: "persentase_progress", key: "persentase_progress", width: "8%"},
{ {
title: 'Action', title: 'Action',
dataIndex: '', dataIndex: '',
@ -100,17 +167,45 @@ const ReportAnalysis = ({ openDialog, closeDialog, toggleDialog, projectId }) =>
const columnActivityToHr = [ const columnActivityToHr = [
{title: "Activity", dataIndex: "join_second_name", key: "join_second_name"}, {title: "Activity", dataIndex: "join_second_name", key: "join_second_name"},
{title: "Gantt", dataIndex: "join_fourth_name_version", key: "join_fourth_name_version"}, {title: "Gantt", dataIndex: "join_fourth_name_version", key: "join_fourth_name_version"},
{title: "Start Date", dataIndex: "start_date", key: "start_date", {title: "Baseline Start", dataIndex: "join_second_planned_start", key: "join_second_planned_start",
render: (text, record) => (
<>
{moment(record.join_second_planned_start).format("DD-MM-YY")}
</>
),
},
{title: "Baseline Finish", dataIndex: "join_second_planned_end", key: "join_second_planned_end",
render: (text, record) => ( render: (text, record) => (
<> <>
{moment(record.start_date).format("DD-MM-YYYY")} {moment(record.join_second_planned_end).format("DD-MM-YY")}
</> </>
), ),
}, },
{title: "End Date", dataIndex: "end_date", key: "end_date", {title: "Early Start", dataIndex: "join_second_start_date", key: "join_second_start_date",
render: (text, record) => ( render: (text, record) => (
<> <>
{moment(record.end_date).format("DD-MM-YYYY")} {moment(record.join_second_start_date).format("DD-MM-YY")}
</>
),
},
{title: "Early Finish", dataIndex: "join_second_end_date", key: "join_second_end_date",
render: (text, record) => (
<>
{moment(record.join_second_end_date).format("DD-MM-YY")}
</>
),
},
{title: "Actual Start", dataIndex: "join_second_actual_start", key: "join_second_actual_start",
render: (text, record) => (
<>
{record.join_second_actual_start ? moment(record.join_second_actual_start).format("DD-MM-YY") : ""}
</>
),
},
{title: "Actual Finish", dataIndex: "join_second_actual_end", key: "join_second_actual_end",
render: (text, record) => (
<>
{record.join_second_actual_end ? moment(record.join_second_actual_end).format("DD-MM-YY") : ""}
</> </>
), ),
}, },
@ -155,12 +250,14 @@ const ReportAnalysis = ({ openDialog, closeDialog, toggleDialog, projectId }) =>
useEffect(() => { useEffect(() => {
if (search) { if (search) {
setLoading(true);
getDataActivity() getDataActivity()
} }
}, [search]); }, [search]);
useEffect(() => { useEffect(() => {
if (selectedHr) { if (selectedHr) {
setLoading(true);
getDataActivityToHr() getDataActivityToHr()
} }
}, [selectedHr]); }, [selectedHr]);
@ -279,7 +376,7 @@ const ReportAnalysis = ({ openDialog, closeDialog, toggleDialog, projectId }) =>
{ {
name: "m_activity", name: "m_activity",
column_join: "activity_id", column_join: "activity_id",
column_results: ["name", "persentase_progress", "start_date", "end_date", "duration"] column_results: ["name", "persentase_progress", "actual_start", "actual_end", "planned_start", "planned_end", "start_date", "end_date", "duration"]
}, },
{ {
name1: "m_activity", name1: "m_activity",
@ -318,7 +415,9 @@ const ReportAnalysis = ({ openDialog, closeDialog, toggleDialog, projectId }) =>
}); });
setAvgActivityHr(sum / dataRes.length); setAvgActivityHr(sum / dataRes.length);
setDataTableActivityToHr(dataRes); setDataTableActivityToHr(dataRes);
setLoading(false);
} else { } else {
setLoading(false);
NotificationManager.error("Gagal Mengambil Data!!", "Failed"); NotificationManager.error("Gagal Mengambil Data!!", "Failed");
} }
}; };
@ -352,8 +451,12 @@ const ReportAnalysis = ({ openDialog, closeDialog, toggleDialog, projectId }) =>
const getDataActivity = async () => { const getDataActivity = async () => {
setAvgActivity(0); setAvgActivity(0);
setSumVolPlan(0);
setSumVolAct(0);
setDatatable([]); setDatatable([]);
let sum = 0; let sum = 0;
let sumPlan = 0;
let sumAct = 0;
const payload = { const payload = {
columns: [ columns: [
{ {
@ -383,10 +486,16 @@ const ReportAnalysis = ({ openDialog, closeDialog, toggleDialog, projectId }) =>
dataRes.forEach(element => { dataRes.forEach(element => {
element.persentase_progress ? sum += parseInt(element.persentase_progress) : sum += 0; element.persentase_progress ? sum += parseInt(element.persentase_progress) : sum += 0;
element.qty_planning ? sumPlan += parseInt(element.qty_planning) : sumPlan += 0;
element.qty ? sumAct += parseInt(element.qty) : sumAct += 0;
}); });
setAvgActivity(sum / dataRes.length); setAvgActivity(sum / dataRes.length);
setSumVolPlan(sumPlan);
setSumVolAct(sumAct);
setDatatable(dataRes); setDatatable(dataRes);
setLoading(false);
} else { } else {
setLoading(false);
NotificationManager.error("Gagal Mengambil Data!!", "Failed"); NotificationManager.error("Gagal Mengambil Data!!", "Failed");
} }
}; };
@ -434,21 +543,25 @@ const ReportAnalysis = ({ openDialog, closeDialog, toggleDialog, projectId }) =>
</Col> </Col>
</Row> </Row>
</CardHeader> </CardHeader>
<CardBody> <CardBody style={{ width: '100%' }}>
<div style={{ textAlign: 'center' }}> <div style={{ textAlign: 'center' }}>
<h1> <h1>
{ {
search && avgActivity ? `Activity ${search} adalah ${avgActivity.toFixed(2)} %` : null search ? `Activity ${search}, Total Plan = ${sumVolPlan ? sumVolPlan.toFixed(0) : 0} dan Total Actual = ${sumVolAct ? sumVolAct.toFixed(0) : 0}` : null
} }
</h1> </h1>
</div> </div>
<Table <div style={{ width: '100%', overflowX: 'auto' }}>
size="small" <Spin tip="Loading..." spinning={loading}>
columns={columns} <Table
dataSource={dataTable} size="small"
pagination={false} columns={columns}
rowKey={"id"} dataSource={dataTable}
/> pagination={false}
rowKey="id"
/>
</Spin>
</div>
</CardBody> </CardBody>
</Card> </Card>
</TabPane> </TabPane>
@ -467,14 +580,18 @@ const ReportAnalysis = ({ openDialog, closeDialog, toggleDialog, projectId }) =>
</Col> </Col>
</Row> </Row>
</CardHeader> </CardHeader>
<CardBody> <CardBody style={{ width: '100%' }}>
<Table <div style={{ width: '100%', overflowX: 'auto' }}>
size="small" <Spin tip="Loading..." spinning={loading}>
columns={columnActivityToHr} <Table
dataSource={dataTableActivityToHr} size="small"
pagination={false} columns={columnActivityToHr}
rowKey={"id"} dataSource={dataTableActivityToHr}
/> pagination={false}
rowKey={"id"}
/>
</Spin>
</div>
</CardBody> </CardBody>
</Card> </Card>
</TabPane> </TabPane>

62
src/views/SimproV2/CreatedProyek/index.js

@ -89,19 +89,29 @@ import AssignK3Project from "./AssignK3Project";
import ViewProject from "./ViewProject"; import ViewProject from "./ViewProject";
import ReportAnalysis from "./ReportAnalysis"; import ReportAnalysis from "./ReportAnalysis";
import { Icon } from "@iconify/react"; import { Icon } from "@iconify/react";
// import { Link } from 'react-router-dom';
// import SubProyekComp from './SubProyekComp'; // import SubProyekComp from './SubProyekComp';
import { Link, useHistory } from "react-router-dom"; import { Link, useHistory, withRouter } from "react-router-dom";
const url = ""; const url = "";
const proyek_id = localStorage.getItem("proyek_id");
const role_id = localStorage.getItem("role_id");
const user_id = localStorage.getItem("user_id");
const format = "DD-MM-YYYY"; const format = "DD-MM-YYYY";
const CreatedProyek = ({ params, ...props }) => { const CreatedProyek = ({ params, ...props }) => {
let role_id = '', user_id='',proyek_id='',isLogin='',token='';
if (props.location.state && props.location.state.role_id && props.location.state.user_id) {
role_id = props.location.state.role_id;
user_id = props.location.state.user_id;
token = props.location.state.token;
isLogin = props.location.state.isLogin;
console.log('props.location.state success');
} else {
role_id = localStorage.getItem("role_id");
proyek_id = localStorage.getItem("proyek_id");
user_id = localStorage.getItem("user_id");
token = localStorage.getItem("token");
isLogin = localStorage.getItem("isLogin");
console.error('Undefined in props.location.state');
}
const history = useHistory(); const history = useHistory();
const token = localStorage.getItem("token");
const HEADER = { const HEADER = {
headers: { headers: {
"Content-Type": "application/json", "Content-Type": "application/json",
@ -200,7 +210,7 @@ const CreatedProyek = ({ params, ...props }) => {
}, [openDialogProyek]); }, [openDialogProyek]);
useEffect(() => { useEffect(() => {
role_id !== "44" ? getDataProyek() : getDataProyekByCustomer(); parseInt(role_id) !== 44 ? getDataProyek() : getDataProyekByCustomer();
}, [search, rowsPerPage, currentPage]); }, [search, rowsPerPage, currentPage]);
useEffect(() => { useEffect(() => {
@ -266,8 +276,8 @@ const CreatedProyek = ({ params, ...props }) => {
} }
}; };
const handleDashboard = async (text) => { const handleDashboard = async (id) => {
const URL = `${BASE_OSPRO}/api/project/detail/${text.id}`; const URL = `${BASE_OSPRO}/api/project/detail/${id}`;
const result = await axios const result = await axios
.get(URL, HEADER) .get(URL, HEADER)
.then((res) => res) .then((res) => res)
@ -284,9 +294,10 @@ const CreatedProyek = ({ params, ...props }) => {
); );
return; return;
} else if (result.status == 200 && result.data.data) { } else if (result.status == 200 && result.data.data) {
history.push( history.push({
`dashboard-customer/${text.id}/${result.data.gantt}/1` pathname: `/dashboard-customer/${id}/${result.data.gantt}/1`,
); state: { role_id: role_id, user_id: user_id, token: token, isLogin: true }
});
} }
}; };
@ -527,6 +538,7 @@ const CreatedProyek = ({ params, ...props }) => {
}; };
const handleOpenDialogViewDetail = async (data) => { const handleOpenDialogViewDetail = async (data) => {
setLoading(true);
setidTask(data.id); setidTask(data.id);
// setDataView(data) // setDataView(data)
await getDataProject(data.id); await getDataProject(data.id);
@ -598,6 +610,10 @@ const CreatedProyek = ({ params, ...props }) => {
getProjectDetail(data.id); getProjectDetail(data.id);
}; };
const handleDashboardCustomer = async (data) => {
handleDashboard(data.id);
};
const handleOpenReport = async (data) => { const handleOpenReport = async (data) => {
setOpenDialogRA(true); setOpenDialogRA(true);
setProjectId(data.id); setProjectId(data.id);
@ -696,7 +712,10 @@ const CreatedProyek = ({ params, ...props }) => {
.then((res) => res) .then((res) => res)
.catch((err) => err.response); .catch((err) => err.response);
if (result && result.data && result.data.code === 200) { if (result && result.data && result.data.code === 200) {
setLoading(false)
setProjectImage(result.data.data); setProjectImage(result.data.data);
}else{
setLoading(false)
} }
} }
@ -888,7 +907,7 @@ const CreatedProyek = ({ params, ...props }) => {
.catch((error) => error.response); .catch((error) => error.response);
if (result && result.data && result.data.code === 200) { if (result && result.data && result.data.code === 200) {
role_id !== "44" ? getDataProyek() : getDataProyekByCustomer(); parseInt(role_id) !== 44 ? getDataProyek() : getDataProyekByCustomer();
getProjectImage(idDelete); getProjectImage(idDelete);
deleteImage(idDelete); deleteImage(idDelete);
setIdDelete(0); setIdDelete(0);
@ -959,7 +978,7 @@ const CreatedProyek = ({ params, ...props }) => {
NotificationManager.success(`${result.data.message}`, "Success!!"); NotificationManager.success(`${result.data.message}`, "Success!!");
} }
role_id !== "44" ? getDataProyek() : getDataProyekByCustomer(); parseInt(role_id) !== 44 ? getDataProyek() : getDataProyekByCustomer();
} else { } else {
NotificationManager.error(`${result.data.message}`, "Failed!!"); NotificationManager.error(`${result.data.message}`, "Failed!!");
} }
@ -1138,7 +1157,7 @@ const CreatedProyek = ({ params, ...props }) => {
); );
} }
if (result && result.status === 200) { if (result && result.status === 200) {
role_id !== "44" ? getDataProyek() : getDataProyekByCustomer(); parseInt(role_id) !== 44 ? getDataProyek() : getDataProyekByCustomer();
NotificationManager.success(`Data proyek berhasil Ubah`, "Success!!"); NotificationManager.success(`Data proyek berhasil Ubah`, "Success!!");
} else { } else {
NotificationManager.error(`${result.data.message}`, "Failed!!"); NotificationManager.error(`${result.data.message}`, "Failed!!");
@ -1612,12 +1631,12 @@ const CreatedProyek = ({ params, ...props }) => {
dataIndex: "", dataIndex: "",
key: "x", key: "x",
render: (text, record) => render: (text, record) =>
role_id == "44" ? ( parseInt(role_id) == 44 ? (
<> <>
<Tooltip title="Dashboard Project"> <Tooltip title="Dashboard Project">
<Button <Button
size="small" size="small"
onClick={() => handleDashboard(text)} onClick={() => handleDashboardCustomer(text)}
type="link" type="link"
style={{ color: "green" }} style={{ color: "green" }}
> >
@ -1926,6 +1945,10 @@ const CreatedProyek = ({ params, ...props }) => {
closeDialog={closeDialogGantt} closeDialog={closeDialogGantt}
toggleDialog={toggleDialogGantt} toggleDialog={toggleDialogGantt}
idTask={idTask} idTask={idTask}
role_id={role_id}
user_id={user_id}
token={token}
isLogin={isLogin}
proyekName={proyekName} proyekName={proyekName}
/> />
), ),
@ -1991,7 +2014,7 @@ const CreatedProyek = ({ params, ...props }) => {
/> />
</Col> </Col>
<Col> <Col>
{role_id == "44" ? null : ( // role kustomer {parseInt(role_id) == 44 ? null : ( // role kustomer
<Tooltip title="Add Project"> <Tooltip title="Add Project">
<Button <Button
style={{ background: "#4caf50", color: "#fff" }} style={{ background: "#4caf50", color: "#fff" }}
@ -2062,5 +2085,4 @@ const CreatedProyek = ({ params, ...props }) => {
</div> </div>
); );
}; };
export default withRouter(CreatedProyek);
export default CreatedProyek;

24
src/views/SimproV2/Gantt/GanttFrame.js

@ -1,16 +1,30 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { useHistory } from 'react-router-dom'; import { useHistory, withRouter } from 'react-router-dom';
import { BASE_SIMPRO_LUMEN } from '../../../const/ApiConst'; import { BASE_SIMPRO_LUMEN } from '../../../const/ApiConst';
const GanttFrame = React.memo((props) => { const GanttFrame = React.memo((props) => {
let role_id = '', user_id='',proyek_id='',isLogin='',token='';
if (props.location.state && props.location.state.role_id && props.location.state.user_id) {
role_id = props.location.state.role_id;
user_id = props.location.state.user_id;
isLogin = props.location.state.isLogin;
token = props.location.state.token;
console.log('props.location.state success');
} else {
role_id = localStorage.getItem("role_id");
proyek_id = localStorage.getItem("proyek_id");
user_id = localStorage.getItem("user_id");
isLogin = localStorage.getItem("isLogin");
token = localStorage.getItem("token");
console.error('Undefined in props.location.state');
}
const history = useHistory(); const history = useHistory();
const { versionGanttId, idProject, token, ro, timestamp } = props; const { versionGanttId, idProject, ro, timestamp } = props;
const iframeSrc = `https://adw-gantt.ospro.id/edit-mode/index.html?base_url=${BASE_SIMPRO_LUMEN}&gantt_id=${versionGanttId}&proyek_id=${idProject}&token=${token}&ro=${ro}&timestamp=${timestamp}`; const iframeSrc = `https://adw-gantt.ospro.id/edit-mode/index.html?base_url=${BASE_SIMPRO_LUMEN}&gantt_id=${versionGanttId}&proyek_id=${idProject}&token=${token}&ro=${ro}&timestamp=${timestamp}`;
const [batchEntityData, setBatchEntityData] = useState(null); const [batchEntityData, setBatchEntityData] = useState(null);
useEffect(() => { useEffect(() => {
const handleMessage = (event) => { const handleMessage = (event) => {
if (event.data && event.data.batchEntity) { if (event.data && event.data.batchEntity) {
@ -46,4 +60,4 @@ const GanttFrame = React.memo((props) => {
); );
}); });
export default GanttFrame; export default withRouter(GanttFrame);

28
src/views/SimproV2/Gantt/index.js

@ -11,18 +11,30 @@ import { Fab, Action } from "react-tiny-fab";
import "react-tiny-fab/dist/styles.css"; import "react-tiny-fab/dist/styles.css";
import { useHistory } from "react-router-dom"; import { useHistory } from "react-router-dom";
import GanttFrame from "./GanttFrame"; import GanttFrame from "./GanttFrame";
const token = localStorage.getItem("token");
const userId = parseInt(localStorage.getItem("user_id"));
const HEADER = {
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${token}`,
},
};
let roCount = 0; let roCount = 0;
const Gantt = (props) => { const Gantt = (props) => {
let role_id = '', userId='',isLogin='',token='';
if (props.location.state && props.location.state.role_id && props.location.state.user_id) {
role_id = props.location.state.role_id;
userId = props.location.state.user_id;
token = props.location.state.token;
isLogin = props.location.state.isLogin;
console.log('props.location.state success');
} else {
role_id = localStorage.getItem("role_id");
userId = localStorage.getItem("user_id");
token = localStorage.getItem("token");
isLogin = localStorage.getItem("isLogin");
console.error('Undefined in props.location.state');
}
const HEADER = {
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${token}`,
},
};
const versionGanttId = props.match.params ? props.match.params.id : 0; const versionGanttId = props.match.params ? props.match.params.id : 0;
const idProject = props.match.params.project ? props.match.params.project : 0; const idProject = props.match.params.project ? props.match.params.project : 0;
const timestamp = props.match.params.timestamp const timestamp = props.match.params.timestamp

12
src/views/SimproV2/ResourceWorker/index.js

@ -8,7 +8,7 @@ import moment from 'moment'
import { Card, CardBody, CardHeader, Col, Row, Input } from 'reactstrap'; import { Card, CardBody, CardHeader, Col, Row, Input } from 'reactstrap';
import { DownloadOutlined } from '@ant-design/icons'; import { DownloadOutlined } from '@ant-design/icons';
import { NotificationContainer, NotificationManager } from 'react-notifications'; import { NotificationContainer, NotificationManager } from 'react-notifications';
import { Pagination, Table, Button, Tooltip } from 'antd'; import { Pagination, Table, Button, Tooltip, Spin } from 'antd';
import { import {
PROYEK_SEARCH, USER_ADD, USER_SEARCH, USER_EDIT, USER_DELETE, ROLE_SEARCH, DIVISI_SEARCH, USER_SHIFT_ADD, USER_SYNC PROYEK_SEARCH, USER_ADD, USER_SEARCH, USER_EDIT, USER_DELETE, ROLE_SEARCH, DIVISI_SEARCH, USER_SHIFT_ADD, USER_SYNC
} from '../../../const/ApiConst'; } from '../../../const/ApiConst';
@ -18,6 +18,7 @@ const proyek_id = localStorage.getItem('proyek_id');
const role_id = localStorage.getItem('role_id'); const role_id = localStorage.getItem('role_id');
const format = "DD-MM-YYYY"; const format = "DD-MM-YYYY";
const token = window.localStorage.getItem('token'); const token = window.localStorage.getItem('token');
const config = { const config = {
headers: headers:
{ {
@ -55,12 +56,15 @@ const ResourceWorker = ({ params }) => {
const [typeDialogShift, setTypeDialogShift] = useState('Save') const [typeDialogShift, setTypeDialogShift] = useState('Save')
const pageName = params.name; const pageName = params.name;
const { t } = useTranslation(); const { t } = useTranslation();
const [loading, setLoading] = useState(true);
useEffect(() => { useEffect(() => {
getRoleList() getRoleList()
getDivisiList() getDivisiList()
}, []) }, [])
useEffect(() => { useEffect(() => {
setLoading(true);
getDataUser() getDataUser()
}, [search, rowsPerPage, currentPage]) }, [search, rowsPerPage, currentPage])
@ -218,7 +222,9 @@ const ResourceWorker = ({ params }) => {
if (result && result.data && result.data.code == 200) { if (result && result.data && result.data.code == 200) {
setDatatable(result.data.data); setDatatable(result.data.data);
setTotalPage(result.data.totalRecord); setTotalPage(result.data.totalRecord);
setLoading(false);
} else { } else {
setLoading(false);
NotificationManager.error('Gagal Mengambil Data!!', 'Failed'); NotificationManager.error('Gagal Mengambil Data!!', 'Failed');
} }
} }
@ -583,7 +589,9 @@ const ResourceWorker = ({ params }) => {
</Row> </Row>
</CardHeader> </CardHeader>
<CardBody> <CardBody>
{RenderTable} <Spin tip="Loading..." spinning={loading}>
{RenderTable}
</Spin>
<Pagination <Pagination
style={{ marginTop: "25px" }} style={{ marginTop: "25px" }}
showSizeChanger showSizeChanger

Loading…
Cancel
Save