diff --git a/src/views/SimproV2/CreatedProyek/DialogForm.js b/src/views/SimproV2/CreatedProyek/DialogForm.js index b09b127..bac0696 100644 --- a/src/views/SimproV2/CreatedProyek/DialogForm.js +++ b/src/views/SimproV2/CreatedProyek/DialogForm.js @@ -2,330 +2,324 @@ import React, { useEffect, useState } from "react"; import { Modal, ModalHeader, ModalBody, ModalFooter } from "reactstrap"; import { Button, Form, FormGroup, Label, Input, Col, Row } from "reactstrap"; import { DatePicker, Tooltip, Select } from "antd"; -// import { Language } from 'src/const/LanguageConst'; import axios from "../../../const/interceptorApi"; import moment from "moment"; import { - NotificationContainer, - NotificationManager, + NotificationContainer, + NotificationManager, } from "react-notifications"; import "antd/dist/antd.css"; import { formatNumber } from "../../../const/CustomFunc"; import { - TYPE_PROYEK, - USER_LIST, - BASE_SIMPRO_LUMEN, + TYPE_PROYEK, + USER_LIST, + BASE_SIMPRO_LUMEN, } from "../../../const/ApiConst"; const { Option } = Select; -// import DialogMap from './DialogMap'; const DialogForm = ({ - openDialog, - closeDialog, - toggleDialog, - idTask, - dataTypeProyek, - dataPM, + openDialog, + closeDialog, + toggleDialog, + idTask, + dataTypeProyek, + dataPM, }) => { - const token = localStorage.getItem("token"); - const HEADER = { - headers: { - "Content-Type": "application/json", - Authorization: `Bearer ${token}`, - }, - }; - const [id, setId] = useState(0); - const [name, setName] = useState(""); - const [shortName, setShortName] = useState(""); - const [description, setDescription] = useState(""); - const [biaya, setBiaya] = useState(""); - const [typeProject, setTypeproject] = useState(null); - const [sdm, setSdm] = useState(0); - const [pic, setPic] = useState(null); - const [startDate, setStartDate] = useState(moment()); - const [endDate, setEndDate] = useState(moment()); - const [workArea, setWorkArea] = useState(""); - const [finance, setFinance] = useState(""); - const [investor, setInvestor] = useState(""); - const [company, setCompany] = useState(""); + const token = localStorage.getItem("token"); + const HEADER = { + headers: { + "Content-Type": "application/json", + Authorization: `Bearer ${token}`, + }, + }; + const [id, setId] = useState(0); + const [name, setName] = useState(""); + const [shortName, setShortName] = useState(""); + const [description, setDescription] = useState(""); + const [biaya, setBiaya] = useState(""); + const [typeProject, setTypeproject] = useState(null); + const [sdm, setSdm] = useState(0); + const [pic, setPic] = useState(null); + const [startDate, setStartDate] = useState(moment()); + const [endDate, setEndDate] = useState(moment()); + const [workArea, setWorkArea] = useState(""); + const [finance, setFinance] = useState(""); + const [investor, setInvestor] = useState(""); + const [company, setCompany] = useState(""); - const handleGetdataIdproyek = async (id) => { - const URL = `${BASE_SIMPRO_LUMEN}/project/edit/${id}`; - const result = await axios - .get(URL, HEADER) - .then((res) => res) - .catch((err) => err.response); - console.log("proyek by id", result); - if (result && result.data && result.data.code === 200) { - const val = result.data.data; - setName(val.nama); - setShortName(val.kode_sortname); - setDescription(val.keterangan); - setBiaya(val.rencana_biaya ? formatNumber(val.rencana_biaya) : ""); - setTypeproject(val.type_proyek_id); - setPic(val.pm_id); - setStartDate(moment(val.mulai_proyek)); - setEndDate(moment(val.akhir_proyek)); - setWorkArea(val.area_kerja); - setInvestor(val.investor); - setCompany(val.company); - setFinance(val.finance); - } else { - NotificationManager.error(`Data proyek gagal di edit`, `Failed!!`); - } - }; + const handleGetdataIdproyek = async (id) => { + const URL = `${BASE_SIMPRO_LUMEN}/project/edit/${id}`; + const result = await axios + .get(URL, HEADER) + .then((res) => res) + .catch((err) => err.response); + if (result && result.data && result.data.code === 200) { + const val = result.data.data; + setName(val.nama); + setShortName(val.kode_sortname); + setDescription(val.keterangan); + setBiaya(val.rencana_biaya ? formatNumber(val.rencana_biaya) : ""); + setTypeproject(val.type_proyek_id); + setPic(val.pm_id); + setStartDate(moment(val.mulai_proyek)); + setEndDate(moment(val.akhir_proyek)); + setWorkArea(val.area_kerja); + setInvestor(val.investor); + setCompany(val.company); + setFinance(val.finance); + } else { + NotificationManager.error(`Data proyek gagal di edit`, `Failed!!`); + } + }; - const handleCLearData = () => { - setName(""); - setShortName(""); - setBiaya(""); - setTypeproject(null); - setPic(null); - setStartDate(moment()); - setEndDate(moment()); - setDescription(""); - setInvestor(""); - setFinance(""); - setWorkArea(""); - setCompany(""); - }; + const handleCLearData = () => { + setName(""); + setShortName(""); + setBiaya(""); + setTypeproject(null); + setPic(null); + setStartDate(moment()); + setEndDate(moment()); + setDescription(""); + setInvestor(""); + setFinance(""); + setWorkArea(""); + setCompany(""); + }; - useEffect(() => { - if (idTask && idTask > 0) { - console.log("cel data Edit"); - handleGetdataIdproyek(idTask); - } else { - handleCLearData(); - } - }, [openDialog]); + useEffect(() => { + if (idTask && idTask > 0) { + handleGetdataIdproyek(idTask); + } else { + handleCLearData(); + } + }, [openDialog]); - const handleSave = () => { - let data = ""; - if (idTask) { - data = { - id: idTask, - nama: name, - kode_sortname: shortName, - rencana_biaya: biaya.replace(".", ""), - mulai_proyek: startDate, - akhir_proyek: endDate, - type_proyek_id: parseInt(typeProject), - pm_id: pic, - investor, - finance, - company, - area_kerja: workArea, - keterangan: description, - }; + const handleSave = () => { + let data = ""; + if (idTask) { + data = { + id: idTask, + nama: name, + kode_sortname: shortName, + rencana_biaya: biaya.replace(".", ""), + mulai_proyek: startDate, + akhir_proyek: endDate, + type_proyek_id: parseInt(typeProject), + pm_id: pic, + investor, + finance, + company, + area_kerja: workArea, + keterangan: description, + }; - closeDialog("edit", data); - } else { - data = { - nama: name, - kode_sortname: shortName, - rencana_biaya: biaya.replace(".", ""), - mulai_proyek: startDate, - akhir_proyek: endDate, - type_proyek_id: parseInt(typeProject), - pm_id: pic, - investor, - finance, - company, - area_kerja: workArea, - keterangan: description, - }; - console.log(data); - closeDialog("add", data); - } - handleCLearData(); - }; + closeDialog("edit", data); + } else { + data = { + nama: name, + kode_sortname: shortName, + rencana_biaya: biaya.replace(".", ""), + mulai_proyek: startDate, + akhir_proyek: endDate, + type_proyek_id: parseInt(typeProject), + pm_id: pic, + investor, + finance, + company, + area_kerja: workArea, + keterangan: description, + }; + closeDialog("add", data); + } + handleCLearData(); + }; - const handleCancel = () => { - closeDialog("cancel", "none"); - handleCLearData(); - }; + const handleCancel = () => { + closeDialog("cancel", "none"); + handleCLearData(); + }; - const onChangeTypeProject = (val) => { - setTypeproject(val); - }; + const onChangeTypeProject = (val) => { + setTypeproject(val); + }; - const onChangePm = (val) => { - console.log("chnage pm", val); - setPic(val); - }; + const onChangePm = (val) => { + setPic(val); + }; - const handleDatePickerStart = (date, dateString) => { - setStartDate(date); - }; + const handleDatePickerStart = (date, dateString) => { + setStartDate(date); + }; - const handleDatePickerEnd = (date, dateString) => { - setEndDate(date); - }; + const handleDatePickerEnd = (date, dateString) => { + setEndDate(date); + }; - const renderForm = () => { - return ( -
- - - - - setName(e.target.value)} - placeholder={`Input project name...`} - /> - - - - - - setShortName(e.target.value)} - placeholder={`Input code / short name...`} - /> - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - setWorkArea(e.target.value)} - placeholder={`Input work area...`} - /> - - - - - - setCompany(e.target.value)} - placeholder={`Input company...`} - /> - - - - - - - - setBiaya(formatNumber(e.target.value))} - placeholder={`Input planning cost...`} - /> - - - - - - setDescription(e.target.value)} - placeholder={`Input description...`} - /> - - - -
- ); - }; + const renderForm = () => { + return ( +
+ + + + + setName(e.target.value)} + placeholder={`Input project name...`} + /> + + + + + + setShortName(e.target.value)} + placeholder={`Input code / short name...`} + /> + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + setWorkArea(e.target.value)} + placeholder={`Input work area...`} + /> + + + + + + setCompany(e.target.value)} + placeholder={`Input company...`} + /> + + + + + + + + setBiaya(formatNumber(e.target.value))} + placeholder={`Input planning cost...`} + /> + + + + + + setDescription(e.target.value)} + placeholder={`Input description...`} + /> + + + +
+ ); + }; - return ( - <> - - - {idTask ? `Update` : "Add"} Project - - {renderForm()} - - {" "} - - - - - ); + return ( + <> + + + {idTask ? `Update` : "Add"} Project + + {renderForm()} + + {" "} + + + + + ); }; export default DialogForm; diff --git a/src/views/SimproV2/CreatedProyek/DialogFormProyek.js b/src/views/SimproV2/CreatedProyek/DialogFormProyek.js index cd69583..63b8e3f 100644 --- a/src/views/SimproV2/CreatedProyek/DialogFormProyek.js +++ b/src/views/SimproV2/CreatedProyek/DialogFormProyek.js @@ -27,6 +27,7 @@ const DialogFormProyek = ({ idTask, dataTypeProyek, dataPhaseProject, + dataDivisions, dataPM, }) => { const token = localStorage.getItem("token"); @@ -43,6 +44,7 @@ const DialogFormProyek = ({ const [biaya, setBiaya] = useState(""); const [typeProject, setTypeproject] = useState(null); const [phaseProject, setPhaseProject] = useState(null); + const [divisiProject, setDivisiProject] = useState(null); const [budgetHealth, setHealthBudget] = useState(null); const [sdm, setSdm] = useState(0); const [pic, setPic] = useState(null); @@ -84,6 +86,7 @@ const DialogFormProyek = ({ setBiaya(val.rencana_biaya ? formatNumber(val.rencana_biaya) : ""); setTypeproject(val.type_proyek_id); setPhaseProject(val.phase_id); + setDivisiProject(val.divisi_id); setHealthBudget(val.budget_health); setPic(val.pm_id); setStartDate(moment(val.mulai_proyek)); @@ -198,6 +201,7 @@ const DialogFormProyek = ({ akhir_proyek: endDate, type_proyek_id: parseInt(typeProject), phase_id: parseInt(phaseProject), + divisi_id: parseInt(divisiProject), budget_health: budgetHealth, pm_id: pic, investor, @@ -224,6 +228,7 @@ const DialogFormProyek = ({ akhir_proyek: endDate, type_proyek_id: parseInt(typeProject), phase_id: parseInt(phaseProject), + divisi_id: parseInt(divisiProject), health_budget: budgetHealth, pm_id: pic, investor, @@ -258,6 +263,10 @@ const DialogFormProyek = ({ setPhaseProject(val); }; + const onChangeDivisiProject = (val) => { + setDivisiProject(val); + }; + const onChangeBudgetHealth = (val) => { setHealthBudget(val); }; @@ -590,6 +599,25 @@ const DialogFormProyek = ({ + + + + + + + + Info Dashboard @@ -598,7 +626,6 @@ const DialogFormProyek = ({ { - const token = localStorage.getItem("token"); - const HEADER = { - headers: { - "Content-Type": "application/json", - Authorization: `Bearer ${token}`, - }, - }; - - const [idTask, setidTask] = useState(0); - const [dataTable, setDatatable] = useState([]); - console.log(`dataTable`, dataTable); - const [search, setSearch] = useState(""); - const [currentPage, setCurrentPage] = useState(1); - const [totalPage, setTotalPage] = useState(0); - const [openDialog, setOpenDialog] = useState(false); - const [openDialogViewDetail, setOpenDialogViewDetail] = useState(false); - const [openDialogMaterial, setOpenDialogMaterial] = useState(false); - const [openDialogTools, setOpenDialogTools] = useState(false); - const [openDialogGantt, setOpenDialogGantt] = useState(false); - const [openDialogAsignHR, setOpenDialogAsignHR] = useState(false); - const [openDialogAssignK3, setOpenDialogAssignK3] = useState(false); - const [dataK3, setDataK3] = useState([]); // transfer list - const [idDelete, setIdDelete] = useState(0); - const [alertDelete, setAlertDelete] = useState(false); - const [rowsPerPage, setRowsPerPage] = useState(10); - const [dataExport, setDataExport] = useState([]); - const [userProyek, setUserProyek] = useState([]); - const [materialProyek, setMaterialProyek] = useState([]); - const [dataCharter, setDataCharter] = useState(null); - const [dataView, setDataView] = useState([]); - const [materialResource, setMaterialResource] = useState([]); - const [toolsResource, setToolsResource] = useState([]); - const [dataTypeProyek, setDataTypeProyek] = useState([]); - const [dataPhaseProject, setDataPhaseProject] = useState([]); - const [dataPm, setDataPM] = useState([]); - const [openDialogDoc, setOpenDialogDoc] = useState(false); - const [proyekName, setProyekName] = useState(""); - const [openDialogProyek, setOpenDialogProyek] = useState(false); - // project charter - const [projectCharter, setProjectCharter] = useState(null); - const [projectParticipant, setProjectParticipant] = useState(null); - const [projectMilestone, setProjectMilestone] = useState(null); - const [projectApproval, setProjectApproval] = useState(null); - - const [loadVersionGantt, setLoadVersionGantt] = useState(false); - const [dataVersionGantt, setDataVersionGantt] = useState([]); - - const pageName = params.name; - - useEffect(() => { - // getDataUserResource() - getDataMaterialResource(); - getDataToolsResource(); - handleGetTipeProject(); - handleGetPhaseProject(); - handleGetDataPm(); - getDataK3(); - }, []); - - useEffect(() => { - getDataProyek(); - }, [search, rowsPerPage, currentPage]); - - useEffect(() => { - if (dataExport.length > 0) { - exportExcel(); - } - }, [dataExport]); - - useEffect(() => { - if (!openDialog) { - setidTask(0); - } - }, [openDialogDoc]); - - const handleSearch = (e) => { - const value = e.target.value; - setSearch(value); - setCurrentPage(1); - }; - - const handleGetTipeProject = async () => { - const result = await axios - .get(TYPE_PROYEK, HEADER) - .then((res) => res) - .catch((err) => err.response); - console.log(result); - if (result && result.data && result.data.code === 200) { - setDataTypeProyek(result.data.data); - } else { - } - }; - - const handleGetPhaseProject = async () => { - const result = await axios - .get(PHASE_PROYEK, HEADER) - .then((res) => res) - .catch((err) => err.response); - console.log("PHASEEEE", result); - if (result && result.data && result.data.code === 200) { - setDataPhaseProject(result.data.data); - } - }; - - - const handleGetDataPm = async () => { - const result = await axios - .get(USER_LIST, HEADER) - .then((res) => res) - .catch((err) => err.response); - console.log(result); - if (result && result.data && result.data.code === 200) { - setDataPM(result.data.data); - } else { - } - }; - - const getDataProyek = async () => { - let start = 0; - - if (currentPage !== 1 && currentPage > 1) { - start = currentPage * rowsPerPage - rowsPerPage; - } - - const payload = { - columns: [ - { - name: "nama", - logic_operator: "like", - value: search, - operator: "AND", - }, - ], - joins: [ - { - name: "m_users", - column_join: "pm_id", - column_results: ["name", "username"], - }, - { - name: "m_type_proyek", - column_join: "type_proyek_id", - column_results: ["name", "description"], - }, - // { "name": "subproyeks.m_subproyek", "column_join": "parent_id", "column_results": ["nama", "biaya", "color_progress", "jumlah_pekerja", "pic", "mulai_proyek", "akhir_proyek", "biaya_actual", "persentase_progress_plan", "persentase_progress_actual"] } - ], - orders: { columns: ["id"], ascending: false }, - paging: { start: start, length: rowsPerPage }, - }; - - if (parseInt(role_id) !== 1) { - payload["columns"] = [ - { name: "id", logic_operator: "=", value: proyek_id, operator: "AND" }, - ]; - } - - - const result = await axios - .post(PROYEK_SEARCH, payload, HEADER) - .then((res) => res) - .catch((error) => error.response); - - - if (result && result.data && result.data.code == 200) { - // console.log("cek proyek", result) - let dataRes = result.data.data || []; - - setDatatable(dataRes); - setTotalPage(result.data.totalRecord); - } else { - NotificationManager.error("Gagal Mengambil Data!!", "Failed"); - } - }; - - const getDataMaterialResource = async () => { - const result = await axios - .get(MATERIAL_RESOURCE_LIST, HEADER) - .then((res) => res) - .catch((error) => error.response); - - if (result && result.data && result.data.code == 200) { - console.log("cek material resource", result.data.data); - let dataRes = result.data.data || []; - setMaterialResource(dataRes); - } else { - NotificationManager.error("Gagal Mengambil Data!!", "Failed"); - } - }; - - const getdataGantt = async (idTask) => { - setLoadVersionGantt(true); - const payload = { - columns: [ - { - name: "proyek_id", - logic_operator: "=", - value: idTask, - operator: "AND", - }, - ], - }; - const result = await axios - .post(VERSION_GANTT_SEARCH, payload, HEADER) - .then((res) => res) - .catch((error) => error.response); - - if (result && result.status == 200) { - setDataVersionGantt(result.data.data); - setLoadVersionGantt(false); - } else { - NotificationManager.error( - `Data gantt project gagal terload silahkan coba lagi!`, - "Failed!!" - ); - } - }; - - const getDataToolsResource = async () => { - const result = await axios - .get(TOOLS_RESOURCE_LIST, HEADER) - .then((res) => res) - .catch((error) => error.response); - - if (result && result.data && result.data.code == 200) { - console.log("cek tools resource", result.data.data); - let dataRes = result.data.data || []; - setToolsResource(dataRes); - } else { - NotificationManager.error("Gagal Mengambil Data!!", "Failed"); - } - }; - - const getDataK3 = async () => { - const result = await axios - .get(CHECKLIST_K3_LIST, HEADER) - .then((res) => res) - .catch((error) => error.response); - - if (result && result.data && result.data.code == 200) { - console.log("cek k3 list", result.data.data); - let dataRes = result.data.data || []; - const finalData = []; - if (dataRes.length > 0) { - dataRes.map((val, index) => { - let data = { - key: val.id, - title: val.name, - }; - finalData.push(data); - }); - } - setDataK3(finalData); - } else { - NotificationManager.error("Gagal Mengambil Data!!", "Failed"); - } - }; - - const handleOpenDialog = (id) => { - setOpenDialog(true); - setidTask(id); - }; - - const handleOpenDialogProyek = (id) => { - console.log("handleOpenDialogProyek", id); - setOpenDialogProyek(true); - setidTask(id); - }; - - const handleOpenDialogGantt = (data) => { - setidTask(data.id); - setProyekName(data.nama); - setOpenDialogGantt(true); - }; - - const toggleDialogGantt = () => { - setOpenDialogGantt(!openDialogGantt); - }; - - const closeDialogGantt = () => { - setOpenDialogGantt(false); - }; - - const handleOpenDialogMaterial = (data) => { - setidTask(data.id); - setProyekName(data.nama); - setOpenDialogMaterial(true); - }; - - const handleOpenAsignHr = (data) => { - setidTask(data.id); - setProyekName(data.nama); - setOpenDialogAsignHR(true); - }; - - const handleOpenAssignK3 = (data) => { - setidTask(data.id); - setProyekName(data.nama); - setOpenDialogAssignK3(true); - }; - - const handleOpenDialogTools = (data) => { - setOpenDialogTools(true); - console.log("handleOpenDialogTools", data); - setidTask(data.id); - setProyekName(data.nama); - setUserProyek(data.user_proyeks); - }; - - const handleOpenDialogViewDetail = async (data) => { - // console.log('handleOpenDialogViewDetail', data); - setidTask(data.id); - // setDataView(data) - await getDataProject(data.id); - await getProjectMilestone(data.id); - await getProjectParticipant(data.id); - await getProjectApproval(data.id); - // await getDataProjectCharter(data.id); - setOpenDialogViewDetail(true); - }; - - const getDataProject = async (proyek_id) => { - const url = PROYEK_GET_ID(proyek_id); - const result = await axios - .get(url, HEADER) - .then((res) => res) - .catch((error) => error.response); - - if (result && result.data && result.data.code == 200) { - let dataRes = result.data.data; - setProjectCharter(dataRes); - } else { - NotificationManager.error("Gagal Mengambil Data!!", "Failed"); - } - }; - - const getProjectMilestone = async (id) => { - const payload = { - columns: [{ name: "proyek_id", logic_operator: "=", value: id }], - joins: [], - orders: { columns: ["id"], ascending: true }, - paging: { start: 0, length: -1 }, - }; - // const url = PROJECT_MI(proyek_id) - const result = await axios - .post(PROJECT_MILESTONE_SEARCH, payload, HEADER) - .then((res) => res) - .catch((error) => error.response); - - if (result && result.data && result.data.code == 200) { - let dataRes = result.data.data; - setProjectMilestone(dataRes); - } else { - NotificationManager.error("Gagal Mengambil Data!!", "Failed"); - } - }; - - const getProjectParticipant = async (id) => { - const payload = { - columns: [{ name: "proyek_id", logic_operator: "=", value: id }], - joins: [], - orders: { columns: ["id"], ascending: true }, - paging: { start: 0, length: -1 }, - }; - // const url = PROJECT_MI(proyek_id) - const result = await axios - .post(PROJECT_PARTICIPANT_SEARCH, payload, HEADER) - .then((res) => res) - .catch((error) => error.response); - - if (result && result.data && result.data.code == 200) { - let dataRes = result.data.data; - setProjectParticipant(dataRes); - - } else { - NotificationManager.error("Gagal Mengambil Data!!", "Failed"); - } - }; - - const getProjectApproval = async (id) => { - const payload = { - columns: [{ name: "proyek_id", logic_operator: "=", value: id }], - joins: [], - orders: { columns: ["id"], ascending: true }, - paging: { start: 0, length: -1 }, - }; - // const url = PROJECT_MI(proyek_id) - const result = await axios - .post(PROJECT_APPROVAL_SEARCH, payload, HEADER) - .then((res) => res) - .catch((error) => error.response); - - if (result && result.data && result.data.code == 200) { - let dataRes = result.data.data; - setProjectApproval(dataRes); - } else { - NotificationManager.error("Gagal Mengambil Data!!", "Failed"); - } - }; - - const handleCloseDialog = (type, payload) => { - if (type === "add") saveProyek(payload); - - if (type === "edit") editProyek(payload); - setidTask(0); - setOpenDialog(false); - }; - - const handleCloseDialogProyek = (type, payload) => { - if (type === "add") saveProyek(payload); - - if (type === "edit") editProyek(payload); - setidTask(0); - setOpenDialogProyek(false); - }; - - const handleCloseDialogView = () => { - setProjectApproval(null); - setProjectParticipant(null); - setProjectMilestone(null); - setProjectCharter(null); - setOpenDialogViewDetail(false); - }; - - const toggleAddDialog = () => setOpenDialog(!openDialog); - const toggleAddDialogProyek = () => setOpenDialogProyek(!openDialogProyek); - const toggleAddDialogView = () => { - if (openDialogViewDetail) { - setProjectApproval(null); - setProjectParticipant(null); - setProjectMilestone(null); - setProjectCharter(null); - } - setOpenDialogViewDetail(!openDialogViewDetail); - }; - - const onConfirmDelete = async () => { - let urlDel = PROYEK_DELETE(idDelete); - const result = await axios - .delete(urlDel, HEADER) - .then((res) => res) - .catch((error) => error.response); - - if (result && result.data && result.data.code === 200) { - getDataProyek(); - setIdDelete(0); - setAlertDelete(false); - NotificationManager.success(`Data proyek berhasil dihapus`, "Success!!"); - } else { - setIdDelete(0); - setAlertDelete(false); - NotificationManager.error(`Data proyek gagal dihapus`, "Failed!!"); - } - }; - - const saveProyek = async (data) => { - const formData = data; - - const result = await axios - .post(PROYEK_ADD, formData, HEADER) - .then((res) => res) - .catch((error) => error.response); - console.log(result); - if (result && result.data && result.data.code === 200) { - const { participants, milestones, approval } = data.projectCharter; - const resultParticipant = await saveParticipant( - result.data.data_result.id, - participants - ); - const resultMilestone = await saveMilestone( - result.data.data_result.id, - milestones - ); - const resultApproval = await saveApproval( - result.data.data_result.id, - approval - ); - console.log({ resultApproval, resultMilestone, resultParticipant }); - if ( - resultParticipant === "berhasil" && - resultMilestone === "berhasil" && - resultApproval === "berhasil" - ) { - // getDataProyek(); - NotificationManager.success( - `Data proyek berhasil ditambah`, - "Success!!" - ); - } else { - NotificationManager.success(`${result.data.message}`, "Success!!"); - } - - getDataProyek(); - } else { - NotificationManager.error(`${result.data.message}`, "Failed!!"); - } - }; - - const saveParticipant = async (id, data) => { - const request = data.map((res) => { - const payload = { - proyek_id: parseInt(id), - tittle: res.title, - name: res.name, - }; - return axios.post(PROJECT_PARTICIPANT_ADD, payload, HEADER); - }); - console.log(request); - const arr = await Promise.all(request) - .then((values) => values) - .catch((err) => err.response); - console.log("result participant", arr); - const result = arr.map((res) => res.data.code == 200); - if (result.length > 0) { - return "gagal"; - } - - return "berhasil"; - }; - - const saveMilestone = async (id, data) => { - const request = data.map((res) => { - const payload = { - proyek_id: parseInt(id), - status: res.status, - due_date: res.due, - deadline: res.deadline, - }; - return axios.post(PROJECT_MILESTONE_ADD, payload, HEADER); - }); - console.log(request); - const arr = await Promise.all(request) - .then((values) => values) - .catch((err) => err.response); - console.log("result milestone", arr); - const result = arr.map((res) => res.data.code !== 200); - if (result.length > 0) { - return "gagal"; - } - - return "berhasil"; - }; - - const saveApproval = async (id, data) => { - const request = data.map((res) => { - const payload = { - proyek_id: parseInt(id), - tittle: res.title, - name: res.name, - date_approval: res.date, - }; - return axios.post(PROJECT_APPROVAL_ADD, payload, HEADER); - }); - console.log(request); - const arr = await Promise.all(request) - .then((values) => values) - .catch((err) => err.response); - console.log("result approval", arr); - const result = arr.map((res) => res.data.code !== 200); - if (result.length > 0) { - return "gagal"; - } - - return "berhasil"; - }; - - const editProyek = async (data) => { - const { participants, milestones, approval } = data.projectCharter; - let urlEdit = PROYEK_EDIT(data.id); - const formData = data; - - const result = await axios - .put(urlEdit, formData, HEADER) - .then((res) => res) - .catch((error) => error.response); - console.log("cek result", result); - const resultParticipant = await editParticipant(data.id, participants); - const resultMilestone = await editMilestone(data.id, milestones); - const resultApproval = await editApproval(data.id, approval); - if (result && result.status === 200) { - getDataProyek(); - NotificationManager.success(`Data proyek berhasil Ubah`, "Success!!"); - } else { - NotificationManager.error(`${result.data.message}`, "Failed!!"); - } - }; - - const editParticipant = async (id, data) => { - await axios.delete(PROJECT_PARTICIPANT_DELETE_BY_PROYEK(id), HEADER); - // if (restDelete){ - const request = data.map((res) => { - const payload = { - proyek_id: parseInt(id), - tittle: res.tittle ? res.tittle : res.title, - name: res.name, - }; - return axios.post(PROJECT_PARTICIPANT_ADD, payload, HEADER); - }); - console.log(request); - const arr = await Promise.all(request) - .then((values) => values) - .catch((err) => err.response); - console.log("result participant", arr); - // let dataTittle = arr.data.tittle - const result = arr.map((res) => res.data.code !== 200); - if (result.length > 0) { - return "gagal"; - } - - return "berhasil"; - }; - - const editMilestone = async (id, data) => { - await axios.delete(PROJECT_MILESTONE_DELETE_BY_PROYEK(id), HEADER); - console.log("res due", data); - const request = data.map((res) => { - const payload = { - proyek_id: parseInt(id), - status: res.status, - due_date: res.due_date ? res.due_date : res.due, - deadline: res.deadline, - }; - return axios.post(PROJECT_MILESTONE_ADD, payload, HEADER); - }); - console.log(request); - const arr = await Promise.all(request) - .then((values) => values) - .catch((err) => err.response); - console.log("result milestone", arr); - const result = arr.map((res) => res.data.code !== 200); - if (result.length > 0) { - return "gagal"; - } - return "berhasil"; - }; - - const editApproval = async (id, data) => { - console.log("cek data edit approval", data); - await axios.delete(PROJECT_APPROVAL_DELETE_BY_PROYEK(id), HEADER); - const request = data.map((res) => { - const payload = { - proyek_id: parseInt(id), - tittle: res.tittle ? res.tittle : res.title, - name: res.name, - date_approval: res.date ? res.date : res.date_approval, - }; - return axios.post(PROJECT_APPROVAL_ADD, payload, HEADER); - }); - console.log(request); - const arr = await Promise.all(request) - .then((values) => values) - .catch((err) => err.response); - console.log("result approval", arr); - // if(arr) - - // const result = arr.map(res => res.data.code !== 200) - // if (result.length > 0) { - // return "gagal" - // } - // return "berhasil" - }; - - const handleDelete = async (id) => { - // console.log('Delete') - await setAlertDelete(true); - await setIdDelete(id); - }; - - const onShowSizeChange = (current, pageSize) => { - setRowsPerPage(pageSize); - }; - - const onPagination = (current, pageSize) => { - setCurrentPage(current); - }; - - const handleExportExcel = async () => { - const payload = { - paging: { start: 0, length: -1 }, - // "columns": [ - // { "name": "nama", "logic_operator": "like", "value": search, "operator": "AND" } - // ], - joins: [], - orders: { columns: ["id"], ascending: false }, - }; - - if (parseInt(role_id) !== 1) { - payload["columns"] = [ - { name: "id", logic_operator: "=", value: proyek_id, operator: "AND" }, - ]; - } - - const result = await axios - .post(PROYEK_SEARCH, payload, HEADER) - .then((res) => res) - .catch((error) => error.response); - - - if (result && result.data && result.data.code == 200) { - let resData = result.data.data; - const excelData = []; - resData.map((n, index) => { - let dataRow = { - Sortname: n.kode_sortname ? n.kode_sortname : "", - "Nama Project": n.nama ? n.nama : "", - "Tanggal Mulai": n.mulai_proyek - ? moment(n.mulai_proyek).format(format) - : "-", - "Tanggal Selesai": n.akhir_proyek - ? moment(n.akhir_proyek).format(format) - : "-", - "Area Kerja": n.area_kerja ? n.area_kerja : "", - Perusahaan: n.company ? n.company : "", - Keterangan: n.keterangan ? n.keterangan : "", - "Dianggap sukses ketika": n.considered_success_when - ? n.considered_success_when - : "", - "Tujuan Proyek": n.project_objectives ? n.project_objectives : "", - "Resiko potensial": n.potential_risk ? n.potential_risk : "", - "Rencana Biaya": n.rencana_biaya - ? formatThousand(n.rencana_biaya) - : "-", - "Testing Environment": n.testing_environment - ? n.testing_environment - : "-", - }; - excelData.push(dataRow); - }); - // console.log("cek excel data", excelData) - await setDataExport(excelData); - } else { - NotificationManager.error("Gagal Export Data!!", "Failed"); - } - }; - - const handleExportPdf = () => { - const doc = new jsPDF(); - - const headers = [ - ["Project Name", "Budget", "Project Type", "PM", "Time Project"], - ]; - const data = dataTable.map((elt) => [ - elt.nama, - `Rp. ${formatThousand(elt.rencana_biaya)}`, - elt.join_second_name, - elt.join_first_name, - `${moment(elt.mulai_proyek).format(format)} - ${moment( - elt.akhir_proyek - ).format(format)}`, - ]); - // Or use javascript directly: - doc.text(4, 15, "Project Charter"); - autoTable(doc, { - startY: 20, - margin: { horizontal: 4 }, - styles: { overflow: "linebreak", columnWidth: "auto", fontSize: 8 }, - columnStyles: { text: { columnWidth: "auto" } }, - head: headers, - body: data, - }); - - doc.save("table.pdf"); - // const unit = "pt"; - // const size = "A4"; // Use A1, A2, A3 or A4 - // const orientation = "portrait"; // portrait or landscape - - // const marginLeft = 40; - // const doc = new jsPDF(orientation, unit, size); - - // doc.setFontSize(15); - // const dataPeople = [ - // { name: "Keanu Reeves", profession: "Actor" }, - // { name: "Lionel Messi", profession: "Football Player" }, - // { name: "Cristiano Ronaldo", profession: "Football Player" }, - // { name: "Jack Nicklaus", profession: "Golf Player" }, - // ]; - // const title = "My Awesome Report"; - // const headers = [["NAME", "PROFESSION"]]; - - // const data = dataPeople.map((elt) => [elt.name, elt.profession]); - - // let content = { - // startY: 50, - // head: headers, - // body: data, - // }; - - // doc.text(title, marginLeft, 40); - // doc.autoTable(content); - // doc.save("report.pdf"); - }; - - const exportExcel = () => { - const dataExcel = dataExport || []; - const fileName = `Data ${pageName}.xlsx`; - const ws = XLSX.utils.json_to_sheet(dataExcel); - const wb = XLSX.utils.book_new(); - XLSX.utils.book_append_sheet(wb, ws, `Data ${pageName}`); - - XLSX.writeFile(wb, fileName); - setDataExport([]); - }; - - const cancelDelete = () => { - setAlertDelete(false); - setIdDelete(0); - }; - - const handleOpenDokumen = async (data) => { - await setidTask(data.id); - setProyekName(data.nama); - setOpenDialogDoc(true); - }; - - const popupMenu = (text, record) => { - return ( -
-
handleOpenDialogViewDetail(text)} - > - - - - Project Charter -
-
handleOpenDokumen(text)}> - - - - Project Documents -
-
handleOpenAsignHr(text)}> - - - - Assign Human Resource -
-
handleOpenAssignK3(text)}> - - - - Assign Checklist K3 -
-
handleOpenDialogMaterial(text)} - > - - - - Request Material Resource -
-
handleOpenDialogTools(text)}> - - - - Request Tools -
- {/* */} -
handleOpenDialogGantt(text)}> - - - - Gantt -
- {/* */} -
handleOpenDialogProyek(text.id)} - > - - - - Edit Project -
-
handleDelete(text.id)}> - - - - Delete Project -
-
- ); - }; - - const popupMenuGantt = (text, record) => { - return ( -
- {loadVersionGantt && ( -
- -
- )} - - {!loadVersionGantt && ( - <> - {dataVersionGantt.slice(0, 8).map((res) => ( - -
- - - - {res.name_version} -
- - ))} - {dataVersionGantt.length > 0 && ( -
- )} -
handleOpenDialogGantt(text)} - > - - - - More Gantt Menu ... -
- - )} -
- ); - }; - - const RenderTable = useMemo(() => { - const columns = [ - { - title: "Action", - dataIndex: "", - key: "x", - render: (text, record) => ( - <> - - - - - - - - ), - }, - { title: "Project Name", dataIndex: "nama", key: "nama" }, - { - title: "Budget", - dataIndex: "rencana_biaya", - key: "rencana_biaya", - // render: (text, record) => { return renderFormatRupiah(text, "Rp") } - render: (text, record) => { - return record.currency_symbol - ? `${record.currency_symbol} ${formatThousand(text)}` - : `${formatThousand(text)}`; - }, - }, - { - title: "Project Type", - dataIndex: "color_progress", - key: "color_progress", - render: (text, record) => ( - <>{record.join_second_name ? record.join_second_name : "-"} - ), - }, - { - title: "PM", - dataIndex: "pic", - key: "pic", - render: (text, record) => ( - <>{record.join_first_name ? record.join_first_name : "-"} - ), - }, - { - title: "Time Project", - dataIndex: "akhir_proyek", - key: "akhir_proyek", - render: (text, record) => ( - <> - {moment(record.mulai_proyek).format(format)} -{" "} - {moment(record.akhir_proyek).format(format)} - - ), - }, - ]; - - return ( - - ); - }, [dataTable, dataVersionGantt, loadVersionGantt]); - - const handleCloseDialogDoc = () => { - setOpenDialogDoc(false); - setidTask(0); - }; - - const handleCloseDialogAsignHr = () => { - setidTask(0); - setOpenDialogAsignHR(false); - }; - - const handleCloseDialogAssignK3 = (status) => { - if (status == "success") { - NotificationManager.success( - `Assign K3 to Project berhasil disimpan!`, - "Success!!" - ); - } else if (status == "failed") { - NotificationManager.error( - `Assign K3 to Project gagal disimpan!`, - "Failed!!" - ); - } - setidTask(0); - setOpenDialogAssignK3(false); - }; - - const RenderDialogForm = useMemo( - () => ( - toggleAddDialog} - idTask={idTask} - dataTypeProyek={dataTypeProyek} - dataPhaseProject={dataPhaseProject} - dataPM={dataPm} - /> - ), - [openDialog] - ); - - const RenderDialogFormProyek = useMemo( - () => ( - toggleAddDialogProyek} - idTask={idTask} - dataTypeProyek={dataTypeProyek} - dataPhaseProject={dataPhaseProject} - dataPM={dataPm} - /> - ), - [openDialogProyek] - ); - - const RenderDialogFormMaterial = useMemo( - () => ( - setOpenDialogMaterial(false)} - toggleDialog={() => setOpenDialogMaterial(!openDialogMaterial)} - idTask={idTask} - userProyek={userProyek} - materialProyek={materialProyek} - materialResource={materialResource} - proyekName={proyekName} - /> - ), - [openDialogMaterial] - ); - - const RenderDialogTableTools = useMemo( - () => ( - setOpenDialogTools(false)} - toggleDialog={() => setOpenDialogTools(!openDialogTools)} - idTask={idTask} - toolsResource={toolsResource} - userProyek={userProyek} - proyekName={proyekName} - /> - ), - [openDialogTools] - ); - - // DialogAsignHr - const RenderDialogAsignHr = useMemo( - () => ( - setOpenDialogAsignHR(false)} - toggleDialog={() => setOpenDialogAsignHR(!openDialogAsignHR)} - handleClose={handleCloseDialogAsignHr} - idTask={idTask} - proyekName={proyekName} - /> - ), - [openDialogAsignHR] - ); - - // DialogAssignK3 - const RenderDialogAssignK3 = useMemo( - () => ( - { - if (openDialogAssignK3) { - setidTask(0); - } - setOpenDialogAssignK3(!openDialogAssignK3); - }} - idTask={idTask} - proyekName={proyekName} - dataK3={dataK3} - /> - ), - [openDialogAssignK3] - ); - - const RenderDialogDoc = useMemo( - () => ( - setOpenDialogDoc(false)} - toggleDialog={() => setOpenDialogDoc(!openDialogDoc)} - handleClose={handleCloseDialogDoc} - idTask={idTask} - proyekName={proyekName} - /> - ), - [openDialogDoc] - ); - - const ViewProyek = useMemo( - () => ( - - ), - [openDialogViewDetail] - ); - - const renderDialogGantt = useMemo( - () => ( - - ), - [openDialogGantt] - ); - - return ( -
- - cancelDelete()} - focusCancelBtn - > - Delete this data - - {ViewProyek} - {RenderDialogForm} - {RenderDialogFormProyek} - {RenderDialogFormMaterial} - {RenderDialogTableTools} - {RenderDialogDoc} - {renderDialogGantt} - {RenderDialogAsignHr} - {RenderDialogAssignK3} - - -

Project Information

- -
- - - - - - - - Close} - title="Export" - trigger="click" - placement="leftBottom" - content={ - <> - -
- - - } - // visible={visible} - // onVisibleChange={handleVisibleChange} - > - - - - - - - - {RenderTable} - - - - - ); + const token = localStorage.getItem("token"); + const HEADER = { + headers: { + "Content-Type": "application/json", + Authorization: `Bearer ${token}`, + }, + }; + + const [idTask, setidTask] = useState(0); + const [dataTable, setDatatable] = useState([]); + const [search, setSearch] = useState(""); + const [currentPage, setCurrentPage] = useState(1); + const [totalPage, setTotalPage] = useState(0); + const [openDialog, setOpenDialog] = useState(false); + const [openDialogViewDetail, setOpenDialogViewDetail] = useState(false); + const [openDialogMaterial, setOpenDialogMaterial] = useState(false); + const [openDialogTools, setOpenDialogTools] = useState(false); + const [openDialogGantt, setOpenDialogGantt] = useState(false); + const [openDialogAsignHR, setOpenDialogAsignHR] = useState(false); + const [openDialogAssignK3, setOpenDialogAssignK3] = useState(false); + const [dataK3, setDataK3] = useState([]); // transfer list + const [idDelete, setIdDelete] = useState(0); + const [alertDelete, setAlertDelete] = useState(false); + const [rowsPerPage, setRowsPerPage] = useState(10); + const [dataExport, setDataExport] = useState([]); + const [userProyek, setUserProyek] = useState([]); + const [materialProyek, setMaterialProyek] = useState([]); + const [dataCharter, setDataCharter] = useState(null); + const [dataView, setDataView] = useState([]); + const [materialResource, setMaterialResource] = useState([]); + const [toolsResource, setToolsResource] = useState([]); + const [dataTypeProyek, setDataTypeProyek] = useState([]); + const [dataPhaseProject, setDataPhaseProject] = useState([]); + const [dataDivisions, setDataDivisions] = useState([]); + const [dataPm, setDataPM] = useState([]); + const [openDialogDoc, setOpenDialogDoc] = useState(false); + const [proyekName, setProyekName] = useState(""); + const [openDialogProyek, setOpenDialogProyek] = useState(false); + // project charter + const [projectCharter, setProjectCharter] = useState(null); + const [projectParticipant, setProjectParticipant] = useState(null); + const [projectMilestone, setProjectMilestone] = useState(null); + const [projectApproval, setProjectApproval] = useState(null); + + const [loadVersionGantt, setLoadVersionGantt] = useState(false); + const [dataVersionGantt, setDataVersionGantt] = useState([]); + + const pageName = params.name; + + useEffect(() => { + // getDataUserResource() + getDataMaterialResource(); + getDataToolsResource(); + handleGetTipeProject(); + handleGetPhaseProject(); + handleGetDivisions(); + handleGetDataPm(); + getDataK3(); + }, []); + + useEffect(() => { + getDataProyek(); + }, [search, rowsPerPage, currentPage]); + + useEffect(() => { + if (dataExport.length > 0) { + exportExcel(); + } + }, [dataExport]); + + useEffect(() => { + if (!openDialog) { + setidTask(0); + } + }, [openDialogDoc]); + + const handleSearch = (e) => { + const value = e.target.value; + setSearch(value); + setCurrentPage(1); + }; + + const handleGetTipeProject = async () => { + const result = await axios + .get(TYPE_PROYEK, HEADER) + .then((res) => res) + .catch((err) => err.response); + if (result && result.data && result.data.code === 200) { + setDataTypeProyek(result.data.data); + } else { + } + }; + + const handleGetPhaseProject = async () => { + const result = await axios + .get(PHASE_PROYEK, HEADER) + .then((res) => res) + .catch((err) => err.response); + if (result && result.data && result.data.code === 200) { + setDataPhaseProject(result.data.data); + } + }; + + const handleGetDivisions = async () => { + const result = await axios + .get(DIVISI_LIST, HEADER) + .then((res) => res) + .catch((err) => err.response); + if (result && result.data && result.data.code === 200) { + setDataDivisions(result.data.data); + } + }; + + const handleGetDataPm = async () => { + const result = await axios + .get(USER_LIST, HEADER) + .then((res) => res) + .catch((err) => err.response); + if (result && result.data && result.data.code === 200) { + setDataPM(result.data.data); + } else { + } + }; + + const getDataProyek = async () => { + let start = 0; + + if (currentPage !== 1 && currentPage > 1) { + start = currentPage * rowsPerPage - rowsPerPage; + } + + const payload = { + columns: [ + { + name: "nama", + logic_operator: "ilike", + value: search, + operator: "AND", + }, + ], + joins: [ + { + name: "m_users", + column_join: "pm_id", + column_results: ["name", "username"], + }, + { + name: "m_type_proyek", + column_join: "type_proyek_id", + column_results: ["name", "description"], + }, + // { "name": "subproyeks.m_subproyek", "column_join": "parent_id", "column_results": ["nama", "biaya", "color_progress", "jumlah_pekerja", "pic", "mulai_proyek", "akhir_proyek", "biaya_actual", "persentase_progress_plan", "persentase_progress_actual"] } + ], + orders: { columns: ["id"], ascending: false }, + paging: { start: start, length: rowsPerPage }, + }; + + if (parseInt(role_id) !== 1) { + payload["columns"] = [ + { name: "id", logic_operator: "=", value: proyek_id, operator: "AND" }, + ]; + } + + + const result = await axios + .post(PROYEK_SEARCH, payload, HEADER) + .then((res) => res) + .catch((error) => error.response); + + + if (result && result.data && result.data.code == 200) { + let dataRes = result.data.data || []; + + setDatatable(dataRes); + setTotalPage(result.data.totalRecord); + } else { + NotificationManager.error("Gagal Mengambil Data!!", "Failed"); + } + }; + + const getDataMaterialResource = async () => { + const result = await axios + .get(MATERIAL_RESOURCE_LIST, HEADER) + .then((res) => res) + .catch((error) => error.response); + + if (result && result.data && result.data.code == 200) { + let dataRes = result.data.data || []; + setMaterialResource(dataRes); + } else { + NotificationManager.error("Gagal Mengambil Data!!", "Failed"); + } + }; + + const getdataGantt = async (idTask) => { + setLoadVersionGantt(true); + const payload = { + columns: [ + { + name: "proyek_id", + logic_operator: "=", + value: idTask, + operator: "AND", + }, + ], + }; + const result = await axios + .post(VERSION_GANTT_SEARCH, payload, HEADER) + .then((res) => res) + .catch((error) => error.response); + + if (result && result.status == 200) { + setDataVersionGantt(result.data.data); + setLoadVersionGantt(false); + } else { + NotificationManager.error( + `Data gantt project gagal terload silahkan coba lagi!`, + "Failed!!" + ); + } + }; + + const getDataToolsResource = async () => { + const result = await axios + .get(TOOLS_RESOURCE_LIST, HEADER) + .then((res) => res) + .catch((error) => error.response); + + if (result && result.data && result.data.code == 200) { + let dataRes = result.data.data || []; + setToolsResource(dataRes); + } else { + NotificationManager.error("Gagal Mengambil Data!!", "Failed"); + } + }; + + const getDataK3 = async () => { + const result = await axios + .get(CHECKLIST_K3_LIST, HEADER) + .then((res) => res) + .catch((error) => error.response); + + if (result && result.data && result.data.code == 200) { + let dataRes = result.data.data || []; + const finalData = []; + if (dataRes.length > 0) { + dataRes.map((val, index) => { + let data = { + key: val.id, + title: val.name, + }; + finalData.push(data); + }); + } + setDataK3(finalData); + } else { + NotificationManager.error("Gagal Mengambil Data!!", "Failed"); + } + }; + + const handleOpenDialog = (id) => { + setOpenDialog(true); + setidTask(id); + }; + + const handleOpenDialogProyek = (id) => { + setOpenDialogProyek(true); + setidTask(id); + }; + + const handleOpenDialogGantt = (data) => { + setidTask(data.id); + setProyekName(data.nama); + setOpenDialogGantt(true); + }; + + const toggleDialogGantt = () => { + setOpenDialogGantt(!openDialogGantt); + }; + + const closeDialogGantt = () => { + setOpenDialogGantt(false); + }; + + const handleOpenDialogMaterial = (data) => { + setidTask(data.id); + setProyekName(data.nama); + setOpenDialogMaterial(true); + }; + + const handleOpenAsignHr = (data) => { + setidTask(data.id); + setProyekName(data.nama); + setOpenDialogAsignHR(true); + }; + + const handleOpenAssignK3 = (data) => { + setidTask(data.id); + setProyekName(data.nama); + setOpenDialogAssignK3(true); + }; + + const handleOpenDialogTools = (data) => { + setOpenDialogTools(true); + setidTask(data.id); + setProyekName(data.nama); + setUserProyek(data.user_proyeks); + }; + + const handleOpenDialogViewDetail = async (data) => { + setidTask(data.id); + // setDataView(data) + await getDataProject(data.id); + await getProjectMilestone(data.id); + await getProjectParticipant(data.id); + await getProjectApproval(data.id); + // await getDataProjectCharter(data.id); + setOpenDialogViewDetail(true); + }; + + const getDataProject = async (proyek_id) => { + const url = PROYEK_GET_ID(proyek_id); + const result = await axios + .get(url, HEADER) + .then((res) => res) + .catch((error) => error.response); + + if (result && result.data && result.data.code == 200) { + let dataRes = result.data.data; + setProjectCharter(dataRes); + } else { + NotificationManager.error("Gagal Mengambil Data!!", "Failed"); + } + }; + + const getProjectMilestone = async (id) => { + const payload = { + columns: [{ name: "proyek_id", logic_operator: "=", value: id }], + joins: [], + orders: { columns: ["id"], ascending: true }, + paging: { start: 0, length: -1 }, + }; + // const url = PROJECT_MI(proyek_id) + const result = await axios + .post(PROJECT_MILESTONE_SEARCH, payload, HEADER) + .then((res) => res) + .catch((error) => error.response); + + if (result && result.data && result.data.code == 200) { + let dataRes = result.data.data; + setProjectMilestone(dataRes); + } else { + NotificationManager.error("Gagal Mengambil Data!!", "Failed"); + } + }; + + const getProjectParticipant = async (id) => { + const payload = { + columns: [{ name: "proyek_id", logic_operator: "=", value: id }], + joins: [], + orders: { columns: ["id"], ascending: true }, + paging: { start: 0, length: -1 }, + }; + // const url = PROJECT_MI(proyek_id) + const result = await axios + .post(PROJECT_PARTICIPANT_SEARCH, payload, HEADER) + .then((res) => res) + .catch((error) => error.response); + + if (result && result.data && result.data.code == 200) { + let dataRes = result.data.data; + setProjectParticipant(dataRes); + + } else { + NotificationManager.error("Gagal Mengambil Data!!", "Failed"); + } + }; + + const getProjectApproval = async (id) => { + const payload = { + columns: [{ name: "proyek_id", logic_operator: "=", value: id }], + joins: [], + orders: { columns: ["id"], ascending: true }, + paging: { start: 0, length: -1 }, + }; + // const url = PROJECT_MI(proyek_id) + const result = await axios + .post(PROJECT_APPROVAL_SEARCH, payload, HEADER) + .then((res) => res) + .catch((error) => error.response); + + if (result && result.data && result.data.code == 200) { + let dataRes = result.data.data; + setProjectApproval(dataRes); + } else { + NotificationManager.error("Gagal Mengambil Data!!", "Failed"); + } + }; + + const handleCloseDialog = (type, payload) => { + if (type === "add") saveProyek(payload); + + if (type === "edit") editProyek(payload); + setidTask(0); + setOpenDialog(false); + }; + + const handleCloseDialogProyek = (type, payload) => { + if (type === "add") saveProyek(payload); + + if (type === "edit") editProyek(payload); + setidTask(0); + setOpenDialogProyek(false); + }; + + const handleCloseDialogView = () => { + setProjectApproval(null); + setProjectParticipant(null); + setProjectMilestone(null); + setProjectCharter(null); + setOpenDialogViewDetail(false); + }; + + const toggleAddDialog = () => setOpenDialog(!openDialog); + const toggleAddDialogProyek = () => setOpenDialogProyek(!openDialogProyek); + const toggleAddDialogView = () => { + if (openDialogViewDetail) { + setProjectApproval(null); + setProjectParticipant(null); + setProjectMilestone(null); + setProjectCharter(null); + } + setOpenDialogViewDetail(!openDialogViewDetail); + }; + + const onConfirmDelete = async () => { + let urlDel = PROYEK_DELETE(idDelete); + const result = await axios + .delete(urlDel, HEADER) + .then((res) => res) + .catch((error) => error.response); + + if (result && result.data && result.data.code === 200) { + getDataProyek(); + setIdDelete(0); + setAlertDelete(false); + NotificationManager.success(`Data proyek berhasil dihapus`, "Success!!"); + } else { + setIdDelete(0); + setAlertDelete(false); + NotificationManager.error(`Data proyek gagal dihapus`, "Failed!!"); + } + }; + + const saveProyek = async (data) => { + const formData = data; + + const result = await axios + .post(PROYEK_ADD, formData, HEADER) + .then((res) => res) + .catch((error) => error.response); + if (result && result.data && result.data.code === 200) { + const { participants, milestones, approval } = data.projectCharter; + const resultParticipant = await saveParticipant( + result.data.data_result.id, + participants + ); + const resultMilestone = await saveMilestone( + result.data.data_result.id, + milestones + ); + const resultApproval = await saveApproval( + result.data.data_result.id, + approval + ); + if ( + resultParticipant === "berhasil" && + resultMilestone === "berhasil" && + resultApproval === "berhasil" + ) { + // getDataProyek(); + NotificationManager.success( + `Data proyek berhasil ditambah`, + "Success!!" + ); + } else { + NotificationManager.success(`${result.data.message}`, "Success!!"); + } + + getDataProyek(); + } else { + NotificationManager.error(`${result.data.message}`, "Failed!!"); + } + }; + + const saveParticipant = async (id, data) => { + const request = data.map((res) => { + const payload = { + proyek_id: parseInt(id), + tittle: res.title, + name: res.name, + }; + return axios.post(PROJECT_PARTICIPANT_ADD, payload, HEADER); + }); + const arr = await Promise.all(request) + .then((values) => values) + .catch((err) => err.response); + const result = arr.map((res) => res.data.code == 200); + if (result.length > 0) { + return "gagal"; + } + + return "berhasil"; + }; + + const saveMilestone = async (id, data) => { + const request = data.map((res) => { + const payload = { + proyek_id: parseInt(id), + status: res.status, + due_date: res.due, + deadline: res.deadline, + }; + return axios.post(PROJECT_MILESTONE_ADD, payload, HEADER); + }); + const arr = await Promise.all(request) + .then((values) => values) + .catch((err) => err.response); + const result = arr.map((res) => res.data.code !== 200); + if (result.length > 0) { + return "gagal"; + } + + return "berhasil"; + }; + + const saveApproval = async (id, data) => { + const request = data.map((res) => { + const payload = { + proyek_id: parseInt(id), + tittle: res.title, + name: res.name, + date_approval: res.date, + }; + return axios.post(PROJECT_APPROVAL_ADD, payload, HEADER); + }); + const arr = await Promise.all(request) + .then((values) => values) + .catch((err) => err.response); + const result = arr.map((res) => res.data.code !== 200); + if (result.length > 0) { + return "gagal"; + } + + return "berhasil"; + }; + + const editProyek = async (data) => { + const { participants, milestones, approval } = data.projectCharter; + let urlEdit = PROYEK_EDIT(data.id); + const formData = data; + + const result = await axios + .put(urlEdit, formData, HEADER) + .then((res) => res) + .catch((error) => error.response); + const resultParticipant = await editParticipant(data.id, participants); + const resultMilestone = await editMilestone(data.id, milestones); + const resultApproval = await editApproval(data.id, approval); + if (result && result.status === 200) { + getDataProyek(); + NotificationManager.success(`Data proyek berhasil Ubah`, "Success!!"); + } else { + NotificationManager.error(`${result.data.message}`, "Failed!!"); + } + }; + + const editParticipant = async (id, data) => { + await axios.delete(PROJECT_PARTICIPANT_DELETE_BY_PROYEK(id), HEADER); + // if (restDelete){ + const request = data.map((res) => { + const payload = { + proyek_id: parseInt(id), + tittle: res.tittle ? res.tittle : res.title, + name: res.name, + }; + return axios.post(PROJECT_PARTICIPANT_ADD, payload, HEADER); + }); + const arr = await Promise.all(request) + .then((values) => values) + .catch((err) => err.response); + const result = arr.map((res) => res.data.code !== 200); + if (result.length > 0) { + return "gagal"; + } + + return "berhasil"; + }; + + const editMilestone = async (id, data) => { + await axios.delete(PROJECT_MILESTONE_DELETE_BY_PROYEK(id), HEADER); + const request = data.map((res) => { + const payload = { + proyek_id: parseInt(id), + status: res.status, + due_date: res.due_date ? res.due_date : res.due, + deadline: res.deadline, + }; + return axios.post(PROJECT_MILESTONE_ADD, payload, HEADER); + }); + const arr = await Promise.all(request) + .then((values) => values) + .catch((err) => err.response); + const result = arr.map((res) => res.data.code !== 200); + if (result.length > 0) { + return "gagal"; + } + return "berhasil"; + }; + + const editApproval = async (id, data) => { + await axios.delete(PROJECT_APPROVAL_DELETE_BY_PROYEK(id), HEADER); + const request = data.map((res) => { + const payload = { + proyek_id: parseInt(id), + tittle: res.tittle ? res.tittle : res.title, + name: res.name, + date_approval: res.date ? res.date : res.date_approval, + }; + return axios.post(PROJECT_APPROVAL_ADD, payload, HEADER); + }); + const arr = await Promise.all(request) + .then((values) => values) + .catch((err) => err.response); + // if(arr) + + // const result = arr.map(res => res.data.code !== 200) + // if (result.length > 0) { + // return "gagal" + // } + // return "berhasil" + }; + + const handleDelete = async (id) => { + await setAlertDelete(true); + await setIdDelete(id); + }; + + const onShowSizeChange = (current, pageSize) => { + setRowsPerPage(pageSize); + }; + + const onPagination = (current, pageSize) => { + setCurrentPage(current); + }; + + const handleExportExcel = async () => { + const payload = { + paging: { start: 0, length: -1 }, + joins: [], + orders: { columns: ["id"], ascending: false }, + }; + + if (parseInt(role_id) !== 1) { + payload["columns"] = [ + { name: "id", logic_operator: "=", value: proyek_id, operator: "AND" }, + ]; + } + + const result = await axios + .post(PROYEK_SEARCH, payload, HEADER) + .then((res) => res) + .catch((error) => error.response); + + + if (result && result.data && result.data.code == 200) { + let resData = result.data.data; + const excelData = []; + resData.map((n, index) => { + let dataRow = { + Sortname: n.kode_sortname ? n.kode_sortname : "", + "Nama Project": n.nama ? n.nama : "", + "Tanggal Mulai": n.mulai_proyek + ? moment(n.mulai_proyek).format(format) + : "-", + "Tanggal Selesai": n.akhir_proyek + ? moment(n.akhir_proyek).format(format) + : "-", + "Area Kerja": n.area_kerja ? n.area_kerja : "", + Perusahaan: n.company ? n.company : "", + Keterangan: n.keterangan ? n.keterangan : "", + "Dianggap sukses ketika": n.considered_success_when + ? n.considered_success_when + : "", + "Tujuan Proyek": n.project_objectives ? n.project_objectives : "", + "Resiko potensial": n.potential_risk ? n.potential_risk : "", + "Rencana Biaya": n.rencana_biaya + ? formatThousand(n.rencana_biaya) + : "-", + "Testing Environment": n.testing_environment + ? n.testing_environment + : "-", + }; + excelData.push(dataRow); + }); + await setDataExport(excelData); + } else { + NotificationManager.error("Gagal Export Data!!", "Failed"); + } + }; + + const handleExportPdf = () => { + const doc = new jsPDF(); + + const headers = [ + ["Project Name", "Budget", "Project Type", "PM", "Time Project"], + ]; + const data = dataTable.map((elt) => [ + elt.nama, + `Rp. ${formatThousand(elt.rencana_biaya)}`, + elt.join_second_name, + elt.join_first_name, + `${moment(elt.mulai_proyek).format(format)} - ${moment( + elt.akhir_proyek + ).format(format)}`, + ]); + // Or use javascript directly: + doc.text(4, 15, "Project Charter"); + autoTable(doc, { + startY: 20, + margin: { horizontal: 4 }, + styles: { overflow: "linebreak", columnWidth: "auto", fontSize: 8 }, + columnStyles: { text: { columnWidth: "auto" } }, + head: headers, + body: data, + }); + + doc.save("table.pdf"); + // const unit = "pt"; + // const size = "A4"; // Use A1, A2, A3 or A4 + // const orientation = "portrait"; // portrait or landscape + + // const marginLeft = 40; + // const doc = new jsPDF(orientation, unit, size); + + // doc.setFontSize(15); + // const dataPeople = [ + // { name: "Keanu Reeves", profession: "Actor" }, + // { name: "Lionel Messi", profession: "Football Player" }, + // { name: "Cristiano Ronaldo", profession: "Football Player" }, + // { name: "Jack Nicklaus", profession: "Golf Player" }, + // ]; + // const title = "My Awesome Report"; + // const headers = [["NAME", "PROFESSION"]]; + + // const data = dataPeople.map((elt) => [elt.name, elt.profession]); + + // let content = { + // startY: 50, + // head: headers, + // body: data, + // }; + + // doc.text(title, marginLeft, 40); + // doc.autoTable(content); + // doc.save("report.pdf"); + }; + + const exportExcel = () => { + const dataExcel = dataExport || []; + const fileName = `Data ${pageName}.xlsx`; + const ws = XLSX.utils.json_to_sheet(dataExcel); + const wb = XLSX.utils.book_new(); + XLSX.utils.book_append_sheet(wb, ws, `Data ${pageName}`); + + XLSX.writeFile(wb, fileName); + setDataExport([]); + }; + + const cancelDelete = () => { + setAlertDelete(false); + setIdDelete(0); + }; + + const handleOpenDokumen = async (data) => { + await setidTask(data.id); + setProyekName(data.nama); + setOpenDialogDoc(true); + }; + + const popupMenu = (text, record) => { + return ( +
+
handleOpenDialogViewDetail(text)} + > + + + + Project Charter +
+
handleOpenDokumen(text)}> + + + + Project Documents +
+
handleOpenAsignHr(text)}> + + + + Assign Human Resource +
+
handleOpenAssignK3(text)}> + + + + Assign Checklist K3 +
+
handleOpenDialogMaterial(text)} + > + + + + Request Material Resource +
+
handleOpenDialogTools(text)}> + + + + Request Tools +
+ {/* */} +
handleOpenDialogGantt(text)}> + + + + Gantt +
+ {/* */} +
handleOpenDialogProyek(text.id)} + > + + + + Edit Project +
+
handleDelete(text.id)}> + + + + Delete Project +
+
+ ); + }; + + const popupMenuGantt = (text, record) => { + return ( +
+ {loadVersionGantt && ( +
+ +
+ )} + + {!loadVersionGantt && ( + <> + {dataVersionGantt.slice(0, 8).map((res) => ( + +
+ + + + {res.name_version} +
+ + ))} + {dataVersionGantt.length > 0 && ( +
+ )} +
handleOpenDialogGantt(text)} + > + + + + More Gantt Menu ... +
+ + )} +
+ ); + }; + + const RenderTable = useMemo(() => { + const columns = [ + { + title: "Action", + dataIndex: "", + key: "x", + render: (text, record) => ( + <> + + + + + + + + ), + }, + { title: "Project Name", dataIndex: "nama", key: "nama" }, + { + title: "Budget", + dataIndex: "rencana_biaya", + key: "rencana_biaya", + // render: (text, record) => { return renderFormatRupiah(text, "Rp") } + render: (text, record) => { + return record.currency_symbol + ? `${record.currency_symbol} ${formatThousand(text)}` + : `${formatThousand(text)}`; + }, + }, + { + title: "Project Type", + dataIndex: "color_progress", + key: "color_progress", + render: (text, record) => ( + <>{record.join_second_name ? record.join_second_name : "-"} + ), + }, + { + title: "PM", + dataIndex: "pic", + key: "pic", + render: (text, record) => ( + <>{record.join_first_name ? record.join_first_name : "-"} + ), + }, + { + title: "Time Project", + dataIndex: "akhir_proyek", + key: "akhir_proyek", + render: (text, record) => ( + <> + {moment(record.mulai_proyek).format(format)} -{" "} + {moment(record.akhir_proyek).format(format)} + + ), + }, + ]; + + return ( +
+ ); + }, [dataTable, dataVersionGantt, loadVersionGantt]); + + const handleCloseDialogDoc = () => { + setOpenDialogDoc(false); + setidTask(0); + }; + + const handleCloseDialogAsignHr = () => { + setidTask(0); + setOpenDialogAsignHR(false); + }; + + const handleCloseDialogAssignK3 = (status) => { + if (status == "success") { + NotificationManager.success( + `Assign K3 to Project berhasil disimpan!`, + "Success!!" + ); + } else if (status == "failed") { + NotificationManager.error( + `Assign K3 to Project gagal disimpan!`, + "Failed!!" + ); + } + setidTask(0); + setOpenDialogAssignK3(false); + }; + + const RenderDialogForm = useMemo( + () => ( + toggleAddDialog} + idTask={idTask} + dataTypeProyek={dataTypeProyek} + dataPhaseProject={dataPhaseProject} + dataPM={dataPm} + /> + ), + [openDialog] + ); + + const RenderDialogFormProyek = useMemo( + () => ( + toggleAddDialogProyek} + idTask={idTask} + dataTypeProyek={dataTypeProyek} + dataPhaseProject={dataPhaseProject} + dataDivisions={dataDivisions} + dataPM={dataPm} + /> + ), + [openDialogProyek] + ); + + const RenderDialogFormMaterial = useMemo( + () => ( + setOpenDialogMaterial(false)} + toggleDialog={() => setOpenDialogMaterial(!openDialogMaterial)} + idTask={idTask} + userProyek={userProyek} + materialProyek={materialProyek} + materialResource={materialResource} + proyekName={proyekName} + /> + ), + [openDialogMaterial] + ); + + const RenderDialogTableTools = useMemo( + () => ( + setOpenDialogTools(false)} + toggleDialog={() => setOpenDialogTools(!openDialogTools)} + idTask={idTask} + toolsResource={toolsResource} + userProyek={userProyek} + proyekName={proyekName} + /> + ), + [openDialogTools] + ); + + // DialogAsignHr + const RenderDialogAsignHr = useMemo( + () => ( + setOpenDialogAsignHR(false)} + toggleDialog={() => setOpenDialogAsignHR(!openDialogAsignHR)} + handleClose={handleCloseDialogAsignHr} + idTask={idTask} + proyekName={proyekName} + /> + ), + [openDialogAsignHR] + ); + + // DialogAssignK3 + const RenderDialogAssignK3 = useMemo( + () => ( + { + if (openDialogAssignK3) { + setidTask(0); + } + setOpenDialogAssignK3(!openDialogAssignK3); + }} + idTask={idTask} + proyekName={proyekName} + dataK3={dataK3} + /> + ), + [openDialogAssignK3] + ); + + const RenderDialogDoc = useMemo( + () => ( + setOpenDialogDoc(false)} + toggleDialog={() => setOpenDialogDoc(!openDialogDoc)} + handleClose={handleCloseDialogDoc} + idTask={idTask} + proyekName={proyekName} + /> + ), + [openDialogDoc] + ); + + const ViewProyek = useMemo( + () => ( + + ), + [openDialogViewDetail] + ); + + const renderDialogGantt = useMemo( + () => ( + + ), + [openDialogGantt] + ); + + return ( +
+ + cancelDelete()} + focusCancelBtn + > + Delete this data + + {ViewProyek} + {RenderDialogForm} + {RenderDialogFormProyek} + {RenderDialogFormMaterial} + {RenderDialogTableTools} + {RenderDialogDoc} + {renderDialogGantt} + {RenderDialogAsignHr} + {RenderDialogAssignK3} + + +

Project Information

+ +
+ + + + + + + + Close} + title="Export" + trigger="click" + placement="leftBottom" + content={ + <> + +
+ + + } + // visible={visible} + // onVisibleChange={handleVisibleChange} + > + + + + + + + + {RenderTable} + + + + + ); }; export default CreatedProyek;