Browse Source

add Assign Customer Menu

pull/2/head
wahyuun 1 year ago
parent
commit
cd095c37ad
  1. 71
      src/views/Dashboard/DashboardProject.js
  2. 478
      src/views/SimproV2/CreatedProyek/DataRequestMaterial.js
  3. 35
      src/views/SimproV2/CreatedProyek/index.js

71
src/views/Dashboard/DashboardProject.js

@ -625,54 +625,11 @@ const DashboardProject = () => {
.then((res) => res) .then((res) => res)
.catch((err) => err.response); .catch((err) => err.response);
const RenderBehindTasks = useMemo(() => { if (!result) {
return ( NotificationManager.error(`Could not connect to internet.`, "Failed");
<div> setIsSendingComment(false);
{!isReadyOverdueActivities && <ListLoader />} return;
{isReadyOverdueActivities && }
overdueActivities &&
overdueActivities.length < 1 && (
<div
style={{
flex: 1,
textAlign: "center",
color: "#E80053",
marginTop: 50,
marginBottom: 50,
}}
>
No overdue activity found.
</div>
)}
{isReadyOverdueActivities &&
overdueActivities &&
overdueActivities.length > 0 &&
overdueActivities.map((item, idx) => {
let end_date;
let planned_end;
let diffDays = 0;
let message = "";
if (item.end_date && item.end_date !== null) {
end_date = moment(item.end_date);
planned_end = moment(item.planned_end);
diffDays = end_date.diff(planned_end, "days");
if (isNaN(diffDays)) {
return null;
} else {
if (diffDays > 0) {
message = `Overdue by ${diffDays + 1} days`;
} else {
return null;
}
}
}
return (
<BehindTaskItem key={idx} name={item.name} message={message} />
);
})}
</div>
);
}, [overdueActivities, isReadyOverdueActivities]);
if (result.status !== 200) { if (result.status !== 200) {
NotificationManager.error( NotificationManager.error(
@ -835,15 +792,23 @@ const DashboardProject = () => {
overdueActivities && overdueActivities &&
overdueActivities.length > 0 && overdueActivities.length > 0 &&
overdueActivities.map((item, idx) => { overdueActivities.map((item, idx) => {
let end_date = null; let end_date;
let today = null; let planned_end;
let diffDays = 0; let diffDays = 0;
let message = ""; let message = "";
if (item.end_date && item.end_date !== null) { if (item.end_date && item.end_date !== null) {
end_date = moment(item.end_date); end_date = moment(item.end_date);
today = moment(new Date()); planned_end = moment(item.planned_end);
diffDays = today.diff(end_date, "days"); diffDays = end_date.diff(planned_end, "days");
message = `Overdue by ${diffDays} days`; if (isNaN(diffDays)) {
return null;
} else {
if (diffDays > 0) {
message = `Overdue by ${diffDays + 1} days`;
} else {
return null;
}
}
} }
return ( return (
<BehindTaskItem key={idx} name={item.name} message={message} /> <BehindTaskItem key={idx} name={item.name} message={message} />

478
src/views/SimproV2/CreatedProyek/DataRequestMaterial.js

@ -1,239 +1,239 @@
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 } from 'antd'; import { Table, Tooltip } from 'antd';
import 'antd/dist/antd.css'; import 'antd/dist/antd.css';
import moment from 'moment'; import moment from 'moment';
import SweetAlert from 'react-bootstrap-sweetalert'; import SweetAlert from 'react-bootstrap-sweetalert';
import { REQUEST_MATERIAL_SEARCH, REQUEST_MATERIAL_ADD, REQUEST_MATERIAL_DELETE, REQUEST_MATERIAL_EDIT } from '../../../const/ApiConst'; import { REQUEST_MATERIAL_SEARCH, REQUEST_MATERIAL_ADD, REQUEST_MATERIAL_DELETE, REQUEST_MATERIAL_EDIT } 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 './FormRequestMaterial'; import DialogRequest from './FormRequestMaterial';
import { renderLabelStatus } from '../../../const/CustomFunc'; import { renderLabelStatus } from '../../../const/CustomFunc';
const DialogFormMaterial = ({ openDialog, closeDialog, toggleDialog, idTask, materialResource, proyekName }) => { const DialogFormMaterial = ({ openDialog, closeDialog, toggleDialog, idTask, materialResource, 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 [dataResource, setDataResource] = useState([]) const [dataResource, setDataResource] = useState([])
const [openDialogReq, setOpenDialogReq] = useState(false) const [openDialogReq, setOpenDialogReq] = useState(false)
const [alertDelete, setAlertDelete] = useState(false) const [alertDelete, setAlertDelete] = useState(false)
const [idDelete, setIdDelete] = useState(0) const [idDelete, setIdDelete] = useState(0)
const [dataEdit, setDataEdit] = useState(null) const [dataEdit, setDataEdit] = useState(null)
useEffect(() => { useEffect(() => {
if (idTask > 0) { if (idTask > 0) {
getDataRequestMaterial(); // getDataRequestMaterial();
} }
}, [idTask]) }, [idTask])
useEffect(() => { useEffect(() => {
if (!openDialog) { if (!openDialog) {
setDataResource([]); setDataResource([]);
} else { } else {
} }
}, [openDialog]) }, [openDialog])
const getDataRequestMaterial = async () => { const getDataRequestMaterial = async () => {
const payload = { const payload = {
"columns": [ "columns": [
{ "name": "description", "logic_operator": "ilike", "value": "", "operator": "AND" }, { "name": "description", "logic_operator": "ilike", "value": "", "operator": "AND" },
{ "name": "proyek_id", "logic_operator": "=", "value": idTask, "operator": "AND" } { "name": "proyek_id", "logic_operator": "=", "value": idTask, "operator": "AND" }
], ],
"joins": [], "joins": [],
"orders": { "columns": ["id"], "ascending": true }, "orders": { "columns": ["id"], "ascending": true },
"paging": { "start": 0, "length": 25 } "paging": { "start": 0, "length": 25 }
} }
const result = await axios const result = await axios
.post(REQUEST_MATERIAL_SEARCH, payload, HEADER) .post(REQUEST_MATERIAL_SEARCH, payload, HEADER)
.then(res => res) .then(res => res)
.catch((error) => error.response); .catch((error) => error.response);
console.log("result", result) console.log("result", result)
if (result && result.status == 200) { if (result && result.status == 200) {
setDataResource(result.data.data); setDataResource(result.data.data);
} else { } else {
} }
} }
const handleCancel = () => { const handleCancel = () => {
setDataResource([]); setDataResource([]);
setDataEdit(null) setDataEdit(null)
closeDialog('cancel', 'none') closeDialog('cancel', 'none')
} }
const handleDelete = (id) => { const handleDelete = (id) => {
setIdDelete(id) setIdDelete(id)
setAlertDelete(true) setAlertDelete(true)
} }
const handleEdit = async (data) => { const handleEdit = async (data) => {
await setDataEdit(data) await setDataEdit(data)
setOpenDialogReq(true) setOpenDialogReq(true)
} }
const RenderTable = useMemo(() => { const RenderTable = useMemo(() => {
const columns = [ const columns = [
{ {
title: 'Action', title: 'Action',
dataIndex: '', dataIndex: '',
key: 'id', key: 'id',
className: "nowrap", className: "nowrap",
render: (text, record) => <> render: (text, record) => <>
{text.status == "fom" ? <><Tooltip title="Delete Request Resource"> {text.status == "fom" ? <><Tooltip title="Delete Request Resource">
<Button size="small" size={"sm"} color='danger' onClick={() => handleDelete(text.id)}><i className="fa fa-trash"></i></Button> <Button size="small" size={"sm"} color='danger' onClick={() => handleDelete(text.id)}><i className="fa fa-trash"></i></Button>
</Tooltip>{" "}<Tooltip title="Edit Request Resource"> </Tooltip>{" "}<Tooltip title="Edit Request Resource">
<Button size="small" size={"sm"} color='primary' onClick={() => handleEdit(text)}><i className="fa fa-edit"></i></Button> <Button size="small" size={"sm"} color='primary' onClick={() => handleEdit(text)}><i className="fa fa-edit"></i></Button>
</Tooltip></> : "-"} </Tooltip></> : "-"}
</>, </>,
}, },
{ title: 'Status', dataIndex: 'status', key: 'status', render: (text, record) => renderLabelStatus(text) }, { title: 'Status', dataIndex: 'status', key: 'status', render: (text, record) => renderLabelStatus(text) },
{ title: 'Description', dataIndex: 'description', key: 'description' }, { title: 'Description', dataIndex: 'description', key: 'description' },
{ title: 'Required Date', dataIndex: 'required_date', key: 'required_date', className: "nowrap", render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{moment(text).format("D-M-YYYY")}</div>) }, { title: 'Required Date', dataIndex: 'required_date', key: 'required_date', className: "nowrap", render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{moment(text).format("D-M-YYYY")}</div>) },
{ title: 'QTY', dataIndex: 'qty', key: 'qty', render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{text ? text : "-"}</div>) }, { title: 'QTY', dataIndex: 'qty', key: 'qty', render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{text ? text : "-"}</div>) },
{ title: 'UOM', dataIndex: 'uom', key: 'uom', render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{text ? text : "-"}</div>) }, { title: 'UOM', dataIndex: 'uom', key: 'uom', render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{text ? text : "-"}</div>) },
{ title: 'QTY Received', dataIndex: 'qty_received', key: 'qty_received', className: "nowrap", render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{text ? text : "-"}</div>) }, { title: 'QTY Received', dataIndex: 'qty_received', key: 'qty_received', className: "nowrap", render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{text ? text : "-"}</div>) },
{ title: 'FOM Date', dataIndex: 'fom_date', key: 'fom_date', className: "nowrap", render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{moment(text).format("D-M-YYYY")}</div>) }, { title: 'FOM Date', dataIndex: 'fom_date', key: 'fom_date', className: "nowrap", render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{moment(text).format("D-M-YYYY")}</div>) },
{ title: 'PR Date', dataIndex: 'pr_date', key: 'pr_date', className: "nowrap", render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{text ? moment(text).format("D-M-YYYY") : "-"}</div>) }, { title: 'PR Date', dataIndex: 'pr_date', key: 'pr_date', className: "nowrap", render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{text ? moment(text).format("D-M-YYYY") : "-"}</div>) },
{ title: 'PO Date', dataIndex: 'po_date', key: 'po_date', className: "nowrap", render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{text ? moment(text).format("D-M-YYYY") : "-"}</div>) }, { title: 'PO Date', dataIndex: 'po_date', key: 'po_date', className: "nowrap", render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{text ? moment(text).format("D-M-YYYY") : "-"}</div>) },
{ title: 'Received Date', dataIndex: 'received_date', key: 'received_date', className: "nowrap", render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{text ? moment(text).format("D-M-YYYY") : "-"}</div>) }, { title: 'Received Date', dataIndex: 'received_date', key: 'received_date', className: "nowrap", render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{text ? moment(text).format("D-M-YYYY") : "-"}</div>) },
{ title: 'Delivery Date', dataIndex: 'delivery_date', key: 'delivery_date', className: "nowrap", render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{text ? moment(text).format("D-M-YYYY") : "-"}</div>) }, { title: 'Delivery Date', dataIndex: 'delivery_date', key: 'delivery_date', className: "nowrap", render: (text, record) => (<div style={{ whiteSpace: "nowrap" }}>{text ? moment(text).format("D-M-YYYY") : "-"}</div>) },
]; ];
return ( return (
<Table <Table
size="small" size="small"
columns={columns} columns={columns}
rowKey={"id"} rowKey={"id"}
dataSource={dataResource} dataSource={dataResource}
pagination={{ position: ["bottomLeft"] }} pagination={{ position: ["bottomLeft"] }}
/> />
) )
}, [dataResource]) }, [dataResource])
const closeDialogReq = (type, data) => { const closeDialogReq = (type, data) => {
if (type == "add") { if (type == "add") {
saveRequestMaterial(data); saveRequestMaterial(data);
} else if (type == "edit") { } else if (type == "edit") {
updateRequestMaterial(data); updateRequestMaterial(data);
} else { } else {
setOpenDialogReq(false); setOpenDialogReq(false);
setDataEdit(null) setDataEdit(null)
} }
} }
const toggleDialogReq = () => { const toggleDialogReq = () => {
setOpenDialogReq(!openDialogReq) setOpenDialogReq(!openDialogReq)
} }
const openDialogRequest = () => { const openDialogRequest = () => {
setOpenDialogReq(true) setOpenDialogReq(true)
} }
const saveRequestMaterial = async (data) => { const saveRequestMaterial = async (data) => {
const result = await axios const result = await axios
.post(REQUEST_MATERIAL_ADD, data, HEADER) .post(REQUEST_MATERIAL_ADD, data, HEADER)
.then(res => res) .then(res => res)
.catch((error) => error.response); .catch((error) => error.response);
if (result && result.data && result.data.code == 200) { if (result && result.data && result.data.code == 200) {
getDataRequestMaterial(); getDataRequestMaterial();
NotificationManager.success('Data request material berhasill ditambahkan!!', 'Success'); NotificationManager.success('Data request material berhasill ditambahkan!!', 'Success');
setOpenDialogReq(false); setOpenDialogReq(false);
setDataEdit(null) setDataEdit(null)
} else { } else {
NotificationManager.error('Data request material gagal ditambahkan!!', 'Failed'); NotificationManager.error('Data request material gagal ditambahkan!!', 'Failed');
} }
} }
const updateRequestMaterial = async (data) => { const updateRequestMaterial = async (data) => {
let url = REQUEST_MATERIAL_EDIT(data.id) let url = REQUEST_MATERIAL_EDIT(data.id)
const result = await axios const result = await axios
.put(url, data, HEADER) .put(url, data, HEADER)
.then(res => res) .then(res => res)
.catch((error) => error.response); .catch((error) => error.response);
if (result && result.data && result.data.code == 200) { if (result && result.data && result.data.code == 200) {
getDataRequestMaterial(); getDataRequestMaterial();
NotificationManager.success('Data request material berhasill diedit!!', 'Success'); NotificationManager.success('Data request material berhasill diedit!!', 'Success');
setOpenDialogReq(false); setOpenDialogReq(false);
setDataEdit(null) setDataEdit(null)
} else { } else {
NotificationManager.error('Data request material gagal diedit!!', 'Failed'); NotificationManager.error('Data request material gagal diedit!!', 'Failed');
} }
} }
const cancelDelete = () => { const cancelDelete = () => {
setAlertDelete(false) setAlertDelete(false)
setIdDelete(0) setIdDelete(0)
} }
const onConfirmDelete = async () => { const onConfirmDelete = async () => {
let urlDel = REQUEST_MATERIAL_DELETE(idDelete) let urlDel = REQUEST_MATERIAL_DELETE(idDelete)
const result = await axios.delete(urlDel, HEADER) const result = await axios.delete(urlDel, HEADER)
.then(res => res) .then(res => res)
.catch((error) => error.response); .catch((error) => error.response);
if (result && result.data && result.data.code === 200) { if (result && result.data && result.data.code === 200) {
getDataRequestMaterial() getDataRequestMaterial()
setIdDelete(0) setIdDelete(0)
setAlertDelete(false) setAlertDelete(false)
NotificationManager.success(`Data request material berhasil dihapus`, 'Success!!'); NotificationManager.success(`Data request material berhasil dihapus`, 'Success!!');
} else { } else {
setIdDelete(0) setIdDelete(0)
setAlertDelete(false) setAlertDelete(false)
NotificationManager.error(`Data request material gagal dihapus`, 'Failed!!'); NotificationManager.error(`Data request material gagal dihapus`, 'Failed!!');
} }
} }
return ( return (
<> <>
<Modal size="xl" isOpen={openDialog} toggle={toggleDialog}> <Modal size="xl" isOpen={openDialog} toggle={toggleDialog}>
<ModalHeader className="capitalize withBtn" toggle={closeDialog} style={{ width: "100%" }}> <ModalHeader className="capitalize withBtn" toggle={closeDialog} style={{ width: "100%" }}>
<div>Request Material Resource - {proyekName}</div> <Button onClick={openDialogRequest} size='sm' color="primary"><i className='fa fa-plus'></i></Button> <div>Request Material Resource - {proyekName}</div> <Button onClick={openDialogRequest} size='sm' color="primary"><i className='fa fa-plus'></i></Button>
</ModalHeader> </ModalHeader>
<ModalBody> <ModalBody>
<div style={{ width: '100%', overflow: "auto" }}> <div style={{ width: '100%', overflow: "auto" }}>
{RenderTable} {RenderTable}
</div> </div>
</ModalBody> </ModalBody>
{/* <ModalFooter> {/* <ModalFooter>
<Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Batal</Button> <Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Batal</Button>
</ModalFooter> */} </ModalFooter> */}
</Modal> </Modal>
<NotificationContainer /> <NotificationContainer />
<SweetAlert <SweetAlert
show={alertDelete} show={alertDelete}
warning warning
showCancel showCancel
confirmBtnText="Delete" confirmBtnText="Delete"
confirmBtnBsStyle="danger" confirmBtnBsStyle="danger"
title={`Are you sure?`} title={`Are you sure?`}
onConfirm={onConfirmDelete} onConfirm={onConfirmDelete}
onCancel={() => cancelDelete()} onCancel={() => cancelDelete()}
focusCancelBtn focusCancelBtn
> >
Delete this data Delete this data
</SweetAlert> </SweetAlert>
<DialogRequest <DialogRequest
openDialog={openDialogReq} openDialog={openDialogReq}
closeDialog={closeDialogReq} closeDialog={closeDialogReq}
toggleDialog={toggleDialogReq} toggleDialog={toggleDialogReq}
idTask={idTask} idTask={idTask}
dataEdit={dataEdit} dataEdit={dataEdit}
materialResource={materialResource} materialResource={materialResource}
/> />
</> </>
) )
} }
export default DialogFormMaterial; export default DialogFormMaterial;

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

@ -71,6 +71,7 @@ import DialogGantt from "./DialogGantt";
import DialogHierarchy from "./DialogHierarchy"; import DialogHierarchy from "./DialogHierarchy";
// import DialogAsignHr from './AsignHrProject'; // import DialogAsignHr from './AsignHrProject';
import AssignHrProject from "./AsignHrProject"; import AssignHrProject from "./AsignHrProject";
import AssignCustProject from "./AsignCustProject";
import AssignK3Project from "./AssignK3Project"; import AssignK3Project from "./AssignK3Project";
import ViewProject from "./ViewProject"; import ViewProject from "./ViewProject";
import { Icon } from "@iconify/react"; import { Icon } from "@iconify/react";
@ -106,6 +107,7 @@ const CreatedProyek = ({ params, ...props }) => {
const [openDialogGantt, setOpenDialogGantt] = useState(false); const [openDialogGantt, setOpenDialogGantt] = useState(false);
const [openDialogHierarchy, setOpenDialogHierarchy] = useState(false); const [openDialogHierarchy, setOpenDialogHierarchy] = useState(false);
const [openDialogAsignHR, setOpenDialogAsignHR] = useState(false); const [openDialogAsignHR, setOpenDialogAsignHR] = useState(false);
const [openDialogAsignCust, setOpenDialogAsignCust] = useState(false);
const [openDialogAssignK3, setOpenDialogAssignK3] = useState(false); const [openDialogAssignK3, setOpenDialogAssignK3] = useState(false);
const [dataK3, setDataK3] = useState([]); // transfer list const [dataK3, setDataK3] = useState([]); // transfer list
const [idDelete, setIdDelete] = useState(0); const [idDelete, setIdDelete] = useState(0);
@ -469,6 +471,12 @@ const CreatedProyek = ({ params, ...props }) => {
setOpenDialogAsignHR(true); setOpenDialogAsignHR(true);
}; };
const handleOpenAsignCust = (data) => {
setidTask(data.id);
setProyekName(data.nama);
setOpenDialogAsignCust(true);
};
const handleOpenAssignK3 = (data) => { const handleOpenAssignK3 = (data) => {
setidTask(data.id); setidTask(data.id);
setProyekName(data.nama); setProyekName(data.nama);
@ -1045,6 +1053,12 @@ const CreatedProyek = ({ params, ...props }) => {
</span> </span>
<span className="menu-text">Assign Human Resource</span> <span className="menu-text">Assign Human Resource</span>
</div> </div>
<div className="menu-list" onClick={() => handleOpenAsignCust(text)}>
<span className="menu-icon">
<i className="fa fa-user-circle-o"></i>
</span>
<span className="menu-text">Assign Customer</span>
</div>
<div className="menu-list" onClick={() => handleOpenAssignK3(text)}> <div className="menu-list" onClick={() => handleOpenAssignK3(text)}>
<span className="menu-icon"> <span className="menu-icon">
<i className="fa fa-plus-circle"></i> <i className="fa fa-plus-circle"></i>
@ -1277,6 +1291,11 @@ const CreatedProyek = ({ params, ...props }) => {
setOpenDialogAsignHR(false); setOpenDialogAsignHR(false);
}; };
const handleCloseDialogAsignCust = () => {
setidTask(0);
setOpenDialogAsignCust(false);
};
const handleCloseDialogAssignK3 = (status) => { const handleCloseDialogAssignK3 = (status) => {
if (status == "success") { if (status == "success") {
NotificationManager.success( NotificationManager.success(
@ -1384,6 +1403,21 @@ const CreatedProyek = ({ params, ...props }) => {
[openDialogAsignHR] [openDialogAsignHR]
); );
// DialogAsignCust
const RenderDialogAsignCust = useMemo(
() => (
<AssignCustProject
openDialog={openDialogAsignCust}
closeDialog={() => setOpenDialogAsignCust(false)}
toggleDialog={() => setOpenDialogAsignCust(!openDialogAsignCust)}
handleClose={handleCloseDialogAsignCust}
idTask={idTask}
proyekName={proyekName}
/>
),
[openDialogAsignCust]
);
// DialogAssignK3 // DialogAssignK3
const RenderDialogAssignK3 = useMemo( const RenderDialogAssignK3 = useMemo(
() => ( () => (
@ -1484,6 +1518,7 @@ const CreatedProyek = ({ params, ...props }) => {
{renderDialogGantt} {renderDialogGantt}
{renderDialogHierarchy} {renderDialogHierarchy}
{RenderDialogAsignHr} {RenderDialogAsignHr}
{RenderDialogAsignCust}
{RenderDialogAssignK3} {RenderDialogAssignK3}
<Card> <Card>
<CardHeader <CardHeader

Loading…
Cancel
Save