diff --git a/src/containers/DefaultLayout/DefaultLayout.js b/src/containers/DefaultLayout/DefaultLayout.js
index a737e45..f056a50 100644
--- a/src/containers/DefaultLayout/DefaultLayout.js
+++ b/src/containers/DefaultLayout/DefaultLayout.js
@@ -67,6 +67,7 @@ class DefaultLayout extends Component {
if (!localStorage.getItem("token")) {
this.signOut();
}
+ this.getQueryParams();
window.myData = "Data dari komponen React";
try {
const storedData = localStorage.getItem('configApp');
@@ -133,6 +134,12 @@ class DefaultLayout extends Component {
LayoutHelper.sidebarToggle(!this.state.minimized);
};
+ getQueryParams() {
+ const searchParams = new URLSearchParams(this.props.location.search);
+ const dashboardGantt = searchParams.get('dashboardGantt');
+ this.setState({ dashboardGantt });
+ }
+
setFinalRoutes = () => {
const { routes2 } = this.state;
if (routes2) {
@@ -263,7 +270,7 @@ class DefaultLayout extends Component {
}
getAppBreadcrumb = () => {
- const { u_group } = this.state;
+ const { u_group, dashboardGantt } = this.state;
if (u_group == 'kominfo') {
routes.map((route, idx) => {
if (route.path == '/dashboard-kominfo') {
@@ -275,7 +282,7 @@ class DefaultLayout extends Component {
});
}
else {
- if (!window.location.href.includes("dashboard")) {
+ if (!window.location.href.includes("dashboard") || window.location.href.includes("dashboard-project") && !dashboardGantt) {
return
}
}
@@ -295,12 +302,11 @@ class DefaultLayout extends Component {
const { location } = this.props;
const { pathname } = location;
let renderSidebar = false
-
+ const isDashboardProject = this.props.location.pathname.startsWith('/dashboard-project/');
if (pathname.includes("/dashboard-project")) {
// Remove the base URL and hash
const path = pathname.replace("/dashboard-project/", "");
-
- // Split the remaining path by "/"
+ // Split the remaining path by "/"
const parts = path.split("/");
if (parts[2] == "1") {
renderSidebar = true
@@ -309,37 +315,33 @@ class DefaultLayout extends Component {
return (
- {!window.location.href.includes("false-header") && (
-
-
-
- )
- }
- {!window.location.href.includes("dashboard-project") || renderSidebar ? (
-
-
-
-
-
+ {(isDashboardProject ? true : !window.location.href.includes("dashboard-project")) || renderSidebar ? (
+ (!this.state.dashboardGantt ? (
+
+
+
+
+
{this.getMenu()}
-
-
- {this.state.minimized ? null :
+
+
+ {this.state.minimized ? null :
- {localStorage.getItem('user_name')}
+ {localStorage.getItem('user_name')}
- handleChangeLng("id")}>ID
- handleChangeLng("en")}>EN
- Profile
- this.signOut(e)}> Logout
+ handleChangeLng("id")}>ID
+ handleChangeLng("en")}>EN
+ Profile
+ this.signOut(e)}> Logout
}
-
-
+
+
+ ) : null)
) : null}
{this.state.breadrCrumbReady ? this.getAppBreadcrumb() : null}
diff --git a/src/routes.js b/src/routes.js
index 8f4040b..93dc146 100644
--- a/src/routes.js
+++ b/src/routes.js
@@ -68,7 +68,7 @@ const routes = [
{ path: '/dashboard', name: 'DashboardBOD', component: DashboardBOD },
{ path: '/dashboard-dyna', name: 'DashboardBOD', component: DashboardDyna },
{ path: '/dashboard-customer/:PROJECT_ID/:GANTT_ID/:SCURVE', name: 'DashboardCustomer', component: DashboardCustomer },
- { path: '/dashboard-project/:PROJECT_ID/:GANTT_ID/:Header', exact: true, name: 'Dashboard Project', component: DashboardProject },
+ { path: '/dashboard-project/:PROJECT_ID/:GANTT_ID', exact: true, name: 'Dashboard Project', component: DashboardProject },
{ path: '/dashboard-perproject', exact: true, name: 'Dashboard Project Carousell', component: DashboardProjectCarousell },
{ path: '/dashboard-project/:PROJECT_ID/:GANTT_ID/:SCURVE', exact: true, name: 'Dashboard Project', component: DashboardProject },
{ path: '/projects', exact: true, name: 'Projects', component: CreatedProyek },
diff --git a/src/views/Dashboard/DashboardProject.js b/src/views/Dashboard/DashboardProject.js
index cc6fe8b..551d630 100644
--- a/src/views/Dashboard/DashboardProject.js
+++ b/src/views/Dashboard/DashboardProject.js
@@ -31,34 +31,15 @@ import {
import { Fab, Action } from "react-tiny-fab";
import "react-tiny-fab/dist/styles.css";
import { useHistory, useLocation, useParams } from "react-router-dom";
+import { Icon } from '@iconify/react';
+import arrowLeft from '@iconify/icons-ion/ios-arrow-back';
+
const { TextArea } = Input;
-const styles = {
- cardContainer: {
- backgroundColor: "#F8F8F8",
- margin: 2,
- paddingLeft: 20,
- paddingRight: 20,
- paddingTop: 10,
- },
- cardHeaderContainer: {
- display: "flex",
- flexDirection: "row",
- marginBottom: 10,
- },
- cardChartContainer: {
- position: "relative",
- height: "21vh",
- margin: "auto",
- paddingBottom: 10,
- justifyContent: "center",
- },
- cardTitle: { color: "#444444", fontSize: 16, fontWeight: "bold" },
- cardSubtitle: { color: "#888888", fontSize: 12 },
-};
const center = {
lat: -6.2,
lng: 106.816666,
};
+
const DashboardProject = (props) => {
let role_id = 0, user_id = 0, isLogin = false, token = '', all_project = null, role_name = '', hierarchy = [], user_name = '';
if (props && props.role_id && props.user_id) {
@@ -72,12 +53,14 @@ const DashboardProject = (props) => {
hierarchy = props.hierarchy;
user_name = props.user_name;
}
+
const HEADER = {
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${token}`,
},
};
+
const { PROJECT_ID, GANTT_ID, SCURVE } = useParams();
const URL_GANTT = `https://project-gantt.ospro.id/view-mode/index.html?base_url=${BASE_OSPRO}/api&gantt_id=${GANTT_ID}&proyek_id=${PROJECT_ID}&token=${token}&ro=1&role_name=${role_name}`;
// const URL_GANTT = `http://localhost:8444/generic-ospro-gantt/view-mode/index.html?base_url=${BASE_OSPRO}/api&gantt_id=${GANTT_ID}&proyek_id=${PROJECT_ID}&token=${token}&ro=1&role_name=${role_name}`;
@@ -97,6 +80,7 @@ const DashboardProject = (props) => {
const [activeTabIdx, setActiveTabIdx] = useState(0);
const [activeTabCommentIdx, setActiveTabCommentIdx] = useState(0);
const [planningProgress, setPlanningProgress] = useState(0);
+ const [planningProgressToDay, setPlanningProgressToDay] = useState(0);
const [actualProgress, setActualProgress] = useState(0);
const [currentBudget, setCurrentBudget] = useState(null);
const [addCostToComplete, setAddCostToComplete] = useState(null);
@@ -134,6 +118,7 @@ const DashboardProject = (props) => {
const [isReadyGanttParents, setIsReadyGanttParents] = useState(false);
const [calculationStatus, setCalculationStatus] = useState(false);
const [isHierarchy, setIsHierarchy] = useState(null);
+ const [dashboardGantt, setDashboardStatus] = useState(false);
let history = useHistory();
useEffect(() => {
getProjectDetail();
@@ -142,9 +127,11 @@ const DashboardProject = (props) => {
getComments();
getGantt();
getGanttParents();
+ getQueryParams();
return () => {
};
}, []);
+
useEffect(() => {
if (isHierarchy != null) {
getSCurve();
@@ -154,11 +141,13 @@ const DashboardProject = (props) => {
window.removeEventListener("message", handleIframeMessage);
};
}, [isHierarchy]);
+
useEffect(() => {
if (activeTabIdx === 1) {
initMap();
}
}, [activeTabIdx]);
+
useEffect(() => {
async function fetchData() {
await Promise.all([
@@ -169,6 +158,7 @@ const DashboardProject = (props) => {
}
fetchData();
}, []);
+
useEffect(() => {
let deviation = 0;
if (plannedCost && totalCost) {
@@ -176,9 +166,11 @@ const DashboardProject = (props) => {
}
setRemToComplete(deviation.toString());
}, [plannedCost, totalCost]);
+
const handleRedirect = () => {
history.push("/projects/" + GANTT_ID + "/" + PROJECT_ID + "/gantt");
};
+
const getManpower = async () => {
const url = `${BASE_OSPRO}/api/project/manpower/${PROJECT_ID}`;
try {
@@ -187,6 +179,7 @@ const DashboardProject = (props) => {
} catch (error) {
}
};
+
const getGantt = async () => {
setIsReadyGantt(false);
const url = `${BASE_OSPRO}/api/version-gantt/edit/${GANTT_ID}`;
@@ -203,6 +196,7 @@ const DashboardProject = (props) => {
setIsReadyGantt(true);
}
};
+
const getGanttParents = async () => {
setIsReadyGanttParents(false);
const url = `${BASE_OSPRO}/api/hierarchy-ftths/tree-gantt/${GANTT_ID}`;
@@ -214,6 +208,7 @@ const DashboardProject = (props) => {
setIsReadyGanttParents(true);
}
};
+
const getAssignedHR = async () => {
const url = `${BASE_OSPRO}/api/project/manpower/assigned/${GANTT_ID}`;
try {
@@ -229,6 +224,7 @@ const DashboardProject = (props) => {
} catch (error) {
}
};
+
const getActualHR = async () => {
const dateStart = moment().startOf("day").toDate();
const dateEnd = moment().endOf("day").toDate();
@@ -268,6 +264,7 @@ const DashboardProject = (props) => {
console.error("Failed to get actual HR:", error);
}
};
+
const getProjectDetail = async () => {
setIsReadyProjectDetail(false);
let URL = `${BASE_OSPRO}/api/project/detail/${PROJECT_ID}`;
@@ -352,6 +349,7 @@ const DashboardProject = (props) => {
}
}
};
+
const getSCurve = async () => {
setIsReadySCurve(false);
let URL = `${BASE_OSPRO}/api/project/get-s-curve`;
@@ -384,6 +382,7 @@ const DashboardProject = (props) => {
let selisihProgress = 0;
let planningProgress = 0;
let actualProgress = 0;
+ let progressPlanToDay = 0;
let statusHealthBySchedule = "behind-schedule";
if (
result.data.data.length > 0 &&
@@ -423,6 +422,14 @@ const DashboardProject = (props) => {
planningProgress = result.data.data[0].data?.percentagePlan[n];
setPlanningProgress(planningProgress);
}
+ if (
+ result.data.data.length > 0 &&
+ result.data.data[0].data?.progressPlanToDay &&
+ result.data.data[0].data?.progressPlanToDay != null
+ ) {
+ progressPlanToDay = result.data.data[0].data?.progressPlanToDay;
+ setPlanningProgressToDay(+(Math.round(progressPlanToDay + "e+2") + "e-2"));
+ }
if (
result.data.data.length > 0 &&
result.data.data[0].data?.percentageReal &&
@@ -444,6 +451,7 @@ const DashboardProject = (props) => {
setIsReadySCurve(true);
}
};
+
const getOverdueActivities = async () => {
setIsReadyOverdueActivities(false);
const URL = `${BASE_OSPRO}/api/project/get-overdue-activities`;
@@ -477,6 +485,7 @@ const DashboardProject = (props) => {
setIsReadyOverdueActivities(true);
}
};
+
const getIntegrationInvoice = async (kode_sortname, id, gantt_id = null) => {
setIsReadyIntegrationInvoice(false);
const URL = `${BASE_OSPRO}/api/project/get-integration-invoice`;
@@ -520,6 +529,7 @@ const DashboardProject = (props) => {
setIsReadyIntegrationInvoice(true);
}
};
+
const getReportDistribution = async () => {
setIsReadyReportDistribution(false);
const URL = `${BASE_OSPRO}/api/project/get-report-distribution`;
@@ -552,6 +562,7 @@ const DashboardProject = (props) => {
setIsReadyReportDistribution(true);
}
};
+
const getComments = async () => {
setIsReadyComments(false);
const URL = `${BASE_OSPRO}/api/project-comment/search`;
@@ -580,6 +591,7 @@ const DashboardProject = (props) => {
orders: { columns: ["created_at"], ascending: false },
paging: { start: 0, length: -1 },
};
+
const result = await axios
.post(URL, payload, HEADER)
.then((res) => res)
@@ -601,6 +613,7 @@ const DashboardProject = (props) => {
setIsReadyComments(true);
}
};
+
const handleSendComment = async () => {
setIsSendingComment(true);
if (comment === "") {
@@ -640,10 +653,23 @@ const DashboardProject = (props) => {
getComments();
}
};
+
const resetInputComment = () => {
setComment("");
setIsSendingComment(false);
};
+
+ const getQueryParams = () => {
+ const searchParams = new URLSearchParams(props.location.search);
+ const dashboardGantt = searchParams.get('dashboardGantt');
+ setDashboardStatus(dashboardGantt);
+ }
+
+ const handleBack = async () => {
+ const domainUrl = window.location.origin;
+ !SCURVE ? (dashboardGantt ? window.parent.location.reload() : window.location.replace(`${domainUrl}/#/projects/${GANTT_ID}/${PROJECT_ID}/gantt`)) : window.history.go(-1);
+ };
+
const initMap = () => {
let mymap = L.map("map-area", {
center: center,
@@ -655,6 +681,7 @@ const DashboardProject = (props) => {
'© OpenStreetMap contributors',
}).addTo(mymap);
};
+
useEffect(() => {
if (mymap) {
if (reportDistribution.length > 0) {
@@ -666,6 +693,7 @@ const DashboardProject = (props) => {
}
}
}, [mymap, reportDistribution]);
+
useEffect(() => {
// Add event listener for receiving messages from the iframe
window.addEventListener("message", handleIframeMessage);
@@ -674,6 +702,7 @@ const DashboardProject = (props) => {
window.removeEventListener("message", handleIframeMessage);
};
}, []);
+
const handleIframeMessage = (event) => {
if (event.data && event.data.action === "getUrl") {
const childUrl = window.location.href;
@@ -684,6 +713,7 @@ const DashboardProject = (props) => {
);
}
};
+
const RenderGantt = useMemo(
() => (