wahyu
1 year ago
11 changed files with 4692 additions and 3163 deletions
@ -1,3 +1,4 @@
|
||||
PORT=3000 |
||||
CHOKIDAR_USEPOLLING=true |
||||
GENERATE_SOURCEMAP=false |
||||
SKIP_PREFLIGHT_CHECK=true |
||||
|
||||
|
After Width: | Height: | Size: 3.8 KiB |
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,294 @@
|
||||
import React, { useEffect, useState, useMemo } from 'react' |
||||
import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap'; |
||||
import { Button, Form } from 'reactstrap'; |
||||
import { Table, Tooltip } from 'antd'; |
||||
import 'antd/dist/antd.css'; |
||||
import moment from 'moment'; |
||||
import { API_ADW, TOKEN_ADW, ASSIGN_HR_PROJECT_SEARCH, ASSIGN_HR_PROJECT_DELETE, USER_LIST, PROJECT_ROLE_SEARCH, ASSIGN_HR_PROJECT_ADD, ASSIGN_HR_PROJECT_EDIT } from '../../../const/ApiConst'; |
||||
import axios from "../../../const/interceptorApi" |
||||
import { NotificationContainer, NotificationManager } from 'react-notifications'; |
||||
import SweetAlert from 'react-bootstrap-sweetalert'; |
||||
import FormAsignCust from './DialogAssignCust'; |
||||
import { formatThousand } from '../../../const/CustomFunc'; |
||||
|
||||
const AssignHrProject = ({ openDialog, closeDialog, toggleDialog, idTask, toolsResource, proyekName }) => { |
||||
const token = localStorage.getItem("token") |
||||
const HEADER = { |
||||
headers: { |
||||
"Content-Type": "application/json", |
||||
"Authorization": `Bearer ${token}` |
||||
} |
||||
} |
||||
const [dataUserToProject, setdataUserToProject] = useState([]) |
||||
const [alertDelete, setAlertDelete] = useState(false) |
||||
const [idDelete, setIdDelete] = useState(0) |
||||
const [openDialogFormTools, setOpenDialogFormTools] = useState(false) |
||||
const [dataEdit, setDataEdit] = useState(null) |
||||
const [listUser, setListUser] = useState([]) |
||||
const [listRole, setListRole] = useState([]) |
||||
|
||||
useEffect(() => { |
||||
if (idTask > 0) { |
||||
getDataAssignHr(); |
||||
} |
||||
}, [openDialog]); |
||||
|
||||
useEffect(() => { |
||||
if (openDialog) { |
||||
getDataProjectRole(); |
||||
getDataUser(); |
||||
} |
||||
}, [dataUserToProject]) |
||||
|
||||
const getDataAssignHr = async () => { |
||||
const payload = { |
||||
"paging": { |
||||
"start": 0, |
||||
"length": -1 |
||||
}, |
||||
"columns": [ |
||||
{ "name": "name", "logic_operator": "ilike", "value": "", "table_name": "m_users" }, |
||||
{ "name": "proyek_id", "logic_operator": "=", "value": idTask } |
||||
], |
||||
"joins": [ |
||||
{ "name": "m_users", "column_join": "user_id", "column_results": ["name"] }, |
||||
{ "name": "m_role_proyek", "column_join": "project_role", "column_results": ["name"] }, |
||||
], |
||||
"orders": { |
||||
"columns": [ |
||||
"id" |
||||
], |
||||
"ascending": false |
||||
} |
||||
} |
||||
const URL = ASSIGN_HR_PROJECT_SEARCH |
||||
const result = await axios |
||||
.post(URL, payload, HEADER) |
||||
.then(res => res) |
||||
.catch((error) => error.response); |
||||
|
||||
if (result && result.data && result.data.code == 200) { |
||||
let dataRes = result.data.data || [] |
||||
const filteredData = dataRes.filter(item => item.is_customer === true); |
||||
setdataUserToProject(filteredData); |
||||
} else { |
||||
NotificationManager.error('Gagal Mengambil Data!!', 'Failed'); |
||||
} |
||||
} |
||||
|
||||
const getDataUser = async () => { |
||||
const HEADER_ADW = { |
||||
headers: { |
||||
"Authorization": `${TOKEN_ADW}` |
||||
} |
||||
} |
||||
const result = await axios |
||||
.get(USER_LIST, HEADER) |
||||
.then(res => res) |
||||
.catch((error) => error.response); |
||||
if (result && result.data && result.data.data.length != 0) { |
||||
let dataRes = result.data.data |
||||
setListUser(dataRes) |
||||
} |
||||
} |
||||
|
||||
const getDataProjectRole = async () => { |
||||
const payload = { |
||||
"paging": { |
||||
"start": 0, |
||||
"length": -1 |
||||
}, |
||||
"columns": [ |
||||
{ "name": "created_by", "logic_operator": "ilike", "value": "" }, |
||||
], |
||||
"joins": [], |
||||
"orders": { |
||||
"columns": [ |
||||
"id" |
||||
], |
||||
"ascending": false |
||||
} |
||||
} |
||||
|
||||
const result = await axios |
||||
.post(PROJECT_ROLE_SEARCH, payload, HEADER) |
||||
.then(res => res) |
||||
.catch((error) => error.response); |
||||
|
||||
if (result && result.data && result.data.code == 200) { |
||||
let dataRes = result.data.data || [] |
||||
setListRole(dataRes); |
||||
} else { |
||||
} |
||||
} |
||||
|
||||
const handleDelete = (id) => { |
||||
setIdDelete(id) |
||||
setAlertDelete(true) |
||||
} |
||||
|
||||
const cancelDelete = () => { |
||||
setAlertDelete(false) |
||||
setIdDelete(0) |
||||
} |
||||
|
||||
const onConfirmDelete = async () => { |
||||
let urlDel = ASSIGN_HR_PROJECT_DELETE(idDelete) |
||||
const result = await axios.delete(urlDel, HEADER) |
||||
.then(res => res) |
||||
.catch((error) => error.response); |
||||
|
||||
if (result && result.data && result.data.code === 200) { |
||||
getDataAssignHr() |
||||
setIdDelete(0) |
||||
setAlertDelete(false) |
||||
NotificationManager.success(`Data assign human resource berhasil dihapus`, 'Success!!'); |
||||
} else { |
||||
setIdDelete(0) |
||||
setAlertDelete(false) |
||||
NotificationManager.error(`Data assign human resource gagal dihapus`, 'Failed!!'); |
||||
} |
||||
} |
||||
|
||||
|
||||
const handleOpenDialogFormTools = () => { |
||||
setOpenDialogFormTools(true) |
||||
} |
||||
|
||||
const handleCancel = () => { |
||||
closeDialog('cancel', 'none') |
||||
} |
||||
|
||||
|
||||
const RenderTable = useMemo(() => { |
||||
const columns = [ |
||||
{ |
||||
title: 'Action', |
||||
dataIndex: '', |
||||
key: 'x', |
||||
className: "nowrap", |
||||
render: (text, record) => <><Tooltip title="Delete Request Resource"> |
||||
<Button size={"sm"} color='danger' onClick={() => handleDelete(text.id)}><i className="fa fa-trash"></i></Button> |
||||
</Tooltip>{" "}</>, |
||||
}, |
||||
{ title: 'Name Human Resource', dataIndex: 'join_first_name', key: 'join_first_name', className: "nowrap" }, |
||||
{ title: 'Role Human Resource', dataIndex: 'join_second_name', key: 'join_second_name', className: "nowrap" }, |
||||
{ title: 'Percentage Available User', dataIndex: 'max_used', key: 'max_used', className: "nowrap", render: (text, record) => record.max_used ? formatThousand(record.max_used) : '-' }, |
||||
{ title: 'Standard Rate', dataIndex: 'standart_rate', key: 'standart_rate', className: "nowrap", render: (text, record) => record.standart_rate ? formatThousand(record.standart_rate) : '-' }, |
||||
{ title: 'UOM Standard Rate', dataIndex: 'uom_standart_rate', key: 'uom_standart_rate', className: "nowrap" }, |
||||
{ title: 'Overtime Rate', dataIndex: 'overtime_rate', key: 'overtime_rate', className: "nowrap", render: (text, record) => record.overtime_rate ? formatThousand(record.overtime_rate) : '-' }, |
||||
{ title: 'UOM Overtime Rate', dataIndex: 'uom_overtime_rate', key: 'uom_overtime_rate', className: "nowrap" }, |
||||
|
||||
]; |
||||
|
||||
return ( |
||||
<Table |
||||
size="small" |
||||
columns={columns} |
||||
dataSource={dataUserToProject} |
||||
pagination={{ position: ["bottomLeft"] }} |
||||
/> |
||||
) |
||||
}, [dataUserToProject]) |
||||
|
||||
const renderForm = () => { |
||||
return ( |
||||
<div style={{"overflowX":"scroll"}}> |
||||
{RenderTable} |
||||
</div> |
||||
) |
||||
} |
||||
|
||||
const handleCloseDialogFormTools = (type, data) => { |
||||
if(type=="add"){ |
||||
addDataAssignHr(data); |
||||
}else if(type=="edit"){ |
||||
editDataAssignHr(data); |
||||
}else{ |
||||
setDataEdit(null) |
||||
setOpenDialogFormTools(false) |
||||
} |
||||
} |
||||
|
||||
const addDataAssignHr = async (payload) => { |
||||
const result = await axios |
||||
.post(ASSIGN_HR_PROJECT_ADD, payload, HEADER) |
||||
.then(res => res) |
||||
.catch((error) => error.response); |
||||
|
||||
if (result && result.data && result.data.code == 200) { |
||||
getDataAssignHr(); |
||||
NotificationManager.success('assign human resource berhasil!!', 'Success'); |
||||
setDataEdit(null) |
||||
setOpenDialogFormTools(false) |
||||
} else { |
||||
NotificationManager.error('assign human resource gagal!!', 'Failed'); |
||||
} |
||||
} |
||||
|
||||
const editDataAssignHr = async (payload) => { |
||||
let url = ASSIGN_HR_PROJECT_EDIT(payload.id) |
||||
const result = await axios |
||||
.put(url, payload, HEADER) |
||||
.then(res => res) |
||||
.catch((error) => error.response); |
||||
|
||||
if (result && result.data && result.data.code == 200) { |
||||
getDataAssignHr(); |
||||
NotificationManager.success('assign human resource berhasil diedit!!', 'Success'); |
||||
setDataEdit(null) |
||||
setOpenDialogFormTools(false) |
||||
} else { |
||||
NotificationManager.error('assign human resource gagal diedit!!', 'Failed'); |
||||
} |
||||
} |
||||
|
||||
const toogleDialogFormTools = () => { |
||||
if (openDialogFormTools) { |
||||
setDataEdit(null) |
||||
} |
||||
setOpenDialogFormTools(!openDialogFormTools) |
||||
} |
||||
|
||||
|
||||
return ( |
||||
<> |
||||
<NotificationContainer /> |
||||
<SweetAlert |
||||
show={alertDelete} |
||||
warning |
||||
showCancel |
||||
confirmBtnText="Delete" |
||||
confirmBtnBsStyle="danger" |
||||
title={`Are you sure?`} |
||||
onConfirm={onConfirmDelete} |
||||
onCancel={() => cancelDelete()} |
||||
focusCancelBtn |
||||
> |
||||
Delete this data |
||||
</SweetAlert> |
||||
<Modal size="xl" isOpen={openDialog} toggle={toggleDialog}> |
||||
<ModalHeader className="capitalize withBtn" toggle={closeDialog}> |
||||
|
||||
<div>Assign Customer - {proyekName}</div> <Button onClick={handleOpenDialogFormTools} size='sm' color="primary"><i className='fa fa-plus'></i></Button> |
||||
</ModalHeader> |
||||
<ModalBody> |
||||
{renderForm()} |
||||
</ModalBody> |
||||
</Modal> |
||||
<FormAsignCust |
||||
openDialog={openDialogFormTools} |
||||
closeDialog={handleCloseDialogFormTools} |
||||
toggleDialog={toogleDialogFormTools} |
||||
idTask={idTask} |
||||
dataEdit={dataEdit} |
||||
dataHr={listUser} |
||||
dataRole={listRole} |
||||
dataCurrentHr={dataUserToProject} |
||||
/> |
||||
</> |
||||
) |
||||
|
||||
} |
||||
|
||||
export default AssignHrProject; |
||||
@ -0,0 +1,173 @@
|
||||
import React, { useEffect, useState } from 'react' |
||||
import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap'; |
||||
import { Button, Form } from 'reactstrap'; |
||||
import axios from "../../../const/interceptorApi"; |
||||
import { USER_VERSION_GANTT_ADDS, USER_VERSION_GANTT_SEARCH, USER_LIST} from '../../../const/ApiConst'; |
||||
import { Transfer } from 'antd'; |
||||
import 'antd/dist/antd.css'; |
||||
|
||||
const role_id = localStorage.getItem('role_id'); |
||||
const DialogAssignCust = ({ openDialog, closeDialog, toggleDialog, idGantt}) => { |
||||
const token = localStorage.getItem("token") |
||||
const HEADER = { |
||||
headers: { |
||||
"Content-Type": "application/json", |
||||
"Authorization": `Bearer ${token}` |
||||
} |
||||
} |
||||
const [id, setId] = useState(0) |
||||
const [targetKeys, setTargetKeys] = useState([]) |
||||
const [assignCustomer, setAssignCustomer] = useState([]) |
||||
|
||||
|
||||
const handleCLearData = () => { |
||||
setId(0) |
||||
setTargetKeys([]) |
||||
} |
||||
|
||||
useEffect(() => { |
||||
if(!openDialog){ |
||||
handleCLearData() |
||||
} else { |
||||
getDataAssignCustomer(); |
||||
} |
||||
}, [openDialog]) |
||||
|
||||
useEffect(() => { |
||||
if(idGantt && idGantt > 0){ |
||||
getUserGantt() |
||||
} |
||||
}, [idGantt]) |
||||
|
||||
const getDataAssignCustomer = async () => { |
||||
const result = await axios |
||||
.get(USER_LIST, HEADER) |
||||
.then(res => res) |
||||
.catch((error) => error.response); |
||||
|
||||
if (result && result.status == 200) { |
||||
let dataRes = result.data.data; |
||||
const filteredData = dataRes.filter(item => item.role_id === 44); |
||||
setTransferUser(filteredData); |
||||
} else { |
||||
|
||||
} |
||||
} |
||||
|
||||
const setTransferUser = (data) => { |
||||
const finalData = [] |
||||
data.map((val, index) => { |
||||
let data = { |
||||
key: val.id, |
||||
title: val.name |
||||
} |
||||
finalData.push(data) |
||||
}); |
||||
setAssignCustomer(finalData) |
||||
} |
||||
|
||||
const getUserGantt = async () => { |
||||
const payload = { |
||||
"columns": [ |
||||
{ "name": "version_gantt_id", "logic_operator": "=", "value": idGantt, "operator": "AND" } |
||||
] |
||||
} |
||||
const result = await axios |
||||
.post(USER_VERSION_GANTT_SEARCH, payload, HEADER) |
||||
.then(res => res) |
||||
.catch((error) => error.response); |
||||
|
||||
if(result && result.status==200){ |
||||
console.log("cek resource get user gantt",result.data.data) |
||||
setUserGantt(result.data.data); |
||||
}else{ |
||||
|
||||
} |
||||
} |
||||
|
||||
const setUserGantt = (data) => { |
||||
let newTargetKeys = [] |
||||
data.map((val,index)=> { |
||||
newTargetKeys.push(val.user_id) |
||||
}); |
||||
setTargetKeys(newTargetKeys) |
||||
} |
||||
|
||||
const handleSave = async () => { |
||||
await saveVersionGantt() |
||||
handleCLearData() |
||||
} |
||||
|
||||
const saveVersionGantt= async () => { |
||||
|
||||
const formData = { |
||||
user_id:targetKeys, |
||||
version_gantt_id:idGantt |
||||
} |
||||
|
||||
const result = await axios |
||||
.post(USER_VERSION_GANTT_ADDS, formData, HEADER) |
||||
.then(res => res) |
||||
.catch((error) => error.response); |
||||
|
||||
|
||||
if(result && result.status==200){ |
||||
closeDialog('success') |
||||
}else{ |
||||
closeDialog('failed') |
||||
} |
||||
} |
||||
|
||||
const handleCancel = () => { |
||||
closeDialog('cancel') |
||||
handleCLearData() |
||||
} |
||||
|
||||
const handleChange = targetKeys => { |
||||
setTargetKeys(targetKeys) |
||||
}; |
||||
|
||||
const renderForm = () => { |
||||
return ( |
||||
<div style={{ |
||||
alignContent: "center", |
||||
justifyContent: "center !imporant", |
||||
paddingLeft: 20, |
||||
paddingRight: 20, |
||||
overflow: "auto" |
||||
}}> |
||||
<Transfer |
||||
showSearch |
||||
titles={['Available Customer', 'Granted to']} |
||||
dataSource={assignCustomer} |
||||
targetKeys={targetKeys} |
||||
onChange={handleChange} |
||||
render={item => item.title} |
||||
listStyle={{ |
||||
width: 250, |
||||
height: 300, |
||||
}} |
||||
/> |
||||
</div> |
||||
) |
||||
} |
||||
|
||||
|
||||
return ( |
||||
<> |
||||
<Modal size="lg" style={{maxWidth: '600px', width: '100%'}} isOpen={openDialog} toggle={toggleDialog}> |
||||
<ModalHeader className="capitalize" toggle={closeDialog}>Add Customer</ModalHeader> |
||||
<ModalBody> |
||||
{renderForm()} |
||||
</ModalBody> |
||||
<ModalFooter> |
||||
<Button color="primary" onClick={() => handleSave()}>Save</Button>{' '} |
||||
<Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Cancel</Button> |
||||
</ModalFooter> |
||||
</Modal> |
||||
</> |
||||
) |
||||
|
||||
} |
||||
|
||||
export default DialogAssignCust; |
||||
Loading…
Reference in new issue