improve ui

src/views/SimproV2/Gantt/index.js

@@ -7,91 +7,91 @@ import axios from "../../../const/interceptorApi"
 const token = localStorage.getItem("token")
 const userId = parseInt(localStorage.getItem("user_id"));
 const HEADER = {
-  headers: {
+	headers: {
-    "Content-Type": "application/json",
+		"Content-Type": "application/json",
-    "Authorization": `Bearer ${token}`
+		"Authorization": `Bearer ${token}`
-  }
+	}
 }
 
 let roCount = 0;
 
 const Gantt = (props) => {
-  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 [ro, setRo] = useState(1)
+	const [ro, setRo] = useState(1)
-  const [listUserGant, setListUserGantt] = useState([])
+	const [listUserGant, setListUserGantt] = useState([])
-  const [ready, setReady] = useState(false)
+	const [ready, setReady] = useState(false)
 
-  useEffect(() => {
+	useEffect(() => {
-    document.getElementsByClassName("breadcrumb-item active").innerHTML = "Gantt Project";
+		document.getElementsByClassName("breadcrumb-item active").innerHTML = "Gantt Project";
+		getDataUserGantt();
+	}, []);
 
-    getDataUserGantt();
+	useEffect(() => {
-  }, []);
+		cekPermission();
+	}, [listUserGant])
 
-  useEffect(() => {
+	useEffect(() => {
-    cekPermission();
+	}, [ro])
-  }, [listUserGant])
 
-  useEffect(() => {
+	const getDataUserGantt = async () => {
-  }, [ro])
+		const payload = {
+			"columns": [
+				{ "name": "version_gantt_id", "logic_operator": "=", "value": versionGanttId, "operator": "AND" }
+			]
+		}
+		const result = await axios
+			.post(USER_VERSION_GANTT_SEARCH, payload, HEADER)
+			.then(res => res)
+			.catch((error) => error.response);
 
-  const getDataUserGantt = async () => {
+		if (result && result.status == 200) {
-    const payload = {
+			setUserGantt(result.data.data);
-      "columns": [
+		} else {
-        { "name": "version_gantt_id", "logic_operator": "=", "value": versionGanttId, "operator": "AND" }
+			cekPermission()
-      ]
+		}
-    }
+	}
-    const result = await axios
-      .post(USER_VERSION_GANTT_SEARCH, payload, HEADER)
-      .then(res => res)
-      .catch((error) => error.response);
 
-    if (result && result.status == 200) {
+	const setUserGantt = (data) => {
-      setUserGantt(result.data.data);
+		let newTargetKeys = []
-    } else {
+		data.map((val, index) => {
-      cekPermission()
+			newTargetKeys.push(val.user_id)
-    }
+		});
-  }
+		setListUserGantt(newTargetKeys)
+	}
 
-  const setUserGantt = (data) => {
+	const cekPermission = () => {
-    let newTargetKeys = []
+		let check = listUserGant.includes(userId)
-    data.map((val, index) => {
+		if (check) {
-      newTargetKeys.push(val.user_id)
+			setRo(0)
-    });
+		} else {
-    setListUserGantt(newTargetKeys)
+			setRo(1)
-  }
+		}
+		if (roCount >= 1) {
+			setReady(true)
+		}
+		roCount = roCount + 1;
+	}
+	const RenderGantt = () => (
+		<iframe
+			id="frame-gantt"
+			src={`https://adw-gantt.ospro.id/index.html?base_url=${BASE_SIMPRO_LUMEN}&gantt_id=${versionGanttId}&proyek_id=${idProject}&token=${localStorage.getItem('token')}&ro=${ro}`}
+			style={{
+				width: '100%',
+				height: '95vh',
+			}}
+			scrolling="no"
+			frameBorder="0"
+			allow="fullscreen"
+		></iframe>
+	)
 
-  const cekPermission = () => {
+	return (
-    let check = listUserGant.includes(userId)
+		<div style={{ margin: "-15px", marginBottom: "-30px" }}>
-    if (check) {
+			{ready && <RenderGantt />}
-      setRo(0)
+		</div>
-    } else {
+	);
-      setRo(1)
-    }
-    if (roCount >= 1) {
-      setReady(true)
-    }
-    roCount = roCount + 1;
-  }
-  const RenderGantt = () => (
-    <iframe
-      id="frame-gantt"
-      src={`https://adw-gantt.ospro.id/index.html?base_url=${BASE_SIMPRO_LUMEN}&gantt_id=${versionGanttId}&proyek_id=${idProject}&token=${localStorage.getItem('token')}&ro=${ro}`}
-      style={{
-        width: '100%',
-        height: '75vh',
-      }}
-      scrolling="no"
-      frameBorder="0"
-    ></iframe>
-  )
-
-  return (
-    <div style={{ margin: "-15px", marginBottom: "-30px" }}>
-      {ready && <RenderGantt />}
-    </div>
-  );
 }
 
 export default Gantt;