ordo
/
surveyor_indonesia_frontend
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge branch 'staging' of https://git.oslog.id/ordo/adw-frontend into dev-wahyu

pull/2/head
wahyu 11 months ago
parent
dec7d245f3 eb294bc2e0
commit
b88599938c
19 changed files with 1211 additions and 819 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/const/ApiConst.js
  2. 8
      src/views/Dashboard/DashboardBOD.js
  3. 55
      src/views/Master/MasterBroadcast/DialogDetail.js
  4. 103
      src/views/Master/MasterBroadcast/index.js
  5. 21
      src/views/Master/MasterMenu/index.js
  6. 12
      src/views/SimproV2/CreatedProyek/AsignCustProject.js
  7. 3
      src/views/SimproV2/CreatedProyek/AsignHrProject.js
  8. 31
      src/views/SimproV2/CreatedProyek/DialogAssignCust.js
  9. 204
      src/views/SimproV2/CreatedProyek/DialogFormProyek.js
  10. 6
      src/views/SimproV2/CreatedProyek/DialogGantt.js
  11. 4
      src/views/SimproV2/CreatedProyek/DialogHierarchy.js
  12. 34
      src/views/SimproV2/CreatedProyek/FormAsignHr.js
  13. 215
      src/views/SimproV2/CreatedProyek/ViewProject.js
  14. 17
      src/views/SimproV2/CreatedProyek/index.js
  15. 29
      src/views/SimproV2/Divisi/DialogForm.js
  16. 46
      src/views/SimproV2/Divisi/InputColor.js
  17. 21
      src/views/SimproV2/Divisi/index.js
  18. 41
      src/views/SimproV2/Divisi/styles.css

2
src/const/ApiConst.js
Unescape View File

@ -316,6 +316,7 @@ export const DOCUMENT_DOWNLOAD = (id) => {
export const ROLE_ADD = `${BASE_SIMPRO_LUMEN}/role/add`;
export const ROLE_SEARCH = `${BASE_SIMPRO_LUMEN}/role/search`;
export const ROLE_LIST = `${BASE_SIMPRO_LUMEN}/role/list`;
export const ROLE_EDIT = (id) => {
return `${BASE_SIMPRO_LUMEN}/role/update/${id}`;
};
@ -340,6 +341,7 @@ export const MENU_MANAGEMENT = (id) => {
return `${BASE_SIMPRO_LUMEN}/menu/management/${id}`;
};
export const MENU_SEARCH = `${BASE_SIMPRO_LUMEN}/menu/search`;
export const MENU_LIST = `${BASE_SIMPRO_LUMEN}/menu/list`;
export const MENU_EDIT = (id) => {
return `${BASE_SIMPRO_LUMEN}/menu/update/${id}`;
};

8
src/views/Dashboard/DashboardBOD.js
Unescape View File

@ -245,7 +245,9 @@ const DashboardBOD = () => {
}
if (result.status == 200 && result.data.data) {
SET_PROJECT_PER_DIVISION(result.data.data);
let dataRes = result.data.data;
const filteredData = dataRes.filter(item => item.parent === null);
SET_PROJECT_PER_DIVISION(filteredData);
}
SET_READY_PROJECT_PER_DIVISION(true);
}
@ -611,8 +613,8 @@ const DashboardBOD = () => {
label: "",
// data: [7, 2, 4, 3],
data: PROJECT_PER_DIVISION ? PROJECT_PER_DIVISION.map((item, idx) => item.total) : [],
borderColor: ["#023E8A", "#C851B7", "#FD7034", "#3A0CA3", "#A36A16"],
backgroundColor: ["#023E8A", "#C851B7", "#FD7034", "#3A0CA3", "#A36A16"],
borderColor: PROJECT_PER_DIVISION ? PROJECT_PER_DIVISION.map((item, idx) => item.color) : [],
backgroundColor: PROJECT_PER_DIVISION ? PROJECT_PER_DIVISION.map((item, idx) => item.color) : [],
borderWidth: 2,
borderSkipped: false
},

55
src/views/Master/MasterBroadcast/DialogDetail.js
Unescape View File

@ -4,7 +4,7 @@ import moment from 'moment';
import { Button, Table, FormFeedback, FormGroup, Input, Label, Modal, ModalBody, ModalFooter, ModalHeader } from 'reactstrap';
import Select from 'react-select';
import axios from 'axios';
import { BASE_SIMPRO_LUMEN, USER_LIST } from '../../../const/ApiConst';
import { BASE_SIMPRO_LUMEN, USER_LIST, ROLE_LIST } from '../../../const/ApiConst';
import { Transfer } from 'antd';
import { withTranslation } from 'react-i18next';
const token = window.localStorage.getItem('token');
@ -43,6 +43,7 @@ class DialogDetail extends Component {
}, () => {
this.getDataDetail();
this.getDataUsers();
this.getDataRoles();
this.setState({ isParentClick: false });
});
}
@ -61,6 +62,18 @@ class DialogDetail extends Component {
}
}
getDataRoles = async () => {
const result = await axios
.get(ROLE_LIST, config)
.then(res => res)
.catch((error) => error.response);
console.log('Get Data Roles', result)
if (result && result.data && result.status == 200) {
this.setState({ dataRoles: result.data.data });
}
}
getDataDetail = async () => {
countError++;
let url = BASE_SIMPRO_LUMEN + `/broadcast/search`;
@ -85,6 +98,7 @@ class DialogDetail extends Component {
if (countError < 6) {
this.getDataDetail();
this.getDataUsers();
this.getDataRoles();
}
}
}
@ -97,7 +111,10 @@ class DialogDetail extends Component {
this.props.closeDialog()
}
render() {
const dataListDetail = this.state.dataListDetail || [];
const dataUser = this.state.dataUser || [];
const dataRoles = this.state.dataRoles || [];
return (
<Modal size="xl" isOpen={this.props.openDialog} toggle={this.props.toggleDialog}>
<ModalHeader toggle={this.handleCloseDialog}>{this.props.t('broadcastDetail')}</ModalHeader>
@ -114,14 +131,42 @@ class DialogDetail extends Component {
</tr>
</thead>
<tbody>
{this.state.dataListDetail.map((val, index) => {
const matchedUser = dataUser.find(item => item.id == val.send_to_id);
{dataListDetail.map((val, index) => {
const matchedUserNames = [];
const matchedUserNamesNotKoma = [];
const matchRolesName = [];
if (typeof val.send_to_id === 'string' && val.send_to_id.includes(',')) {
const sendToIds = val.send_to_id.split(',').map(id => parseInt(id, 10));
matchedUserNames[index] = sendToIds.map(id => {
const matchedUser = dataUser.find(item => item.id === id);
return matchedUser ? <div>{"- " + matchedUser.name}</div> : null;
});
}
if (typeof val.send_to_id === 'string' && val.send_to_id.indexOf(',') === -1) {
const id = parseInt(val.send_to_id, 10);
const matchedUser = dataUser.find(item => item.id === id);
matchedUserNamesNotKoma[index] = matchedUser ? <div>{matchedUser.name}</div> : null;
}
if (val.send_to_type === 'roles') {
const id = parseInt(val.send_to_id, 10);
const matchedRole = dataRoles.find(item => item.id === id);
matchRolesName[index] = matchedRole ? <div><b>Role </b>{matchedRole.name}</div> : null;
}
return (
<tr key={index}>
<td>{val.status_send === "" ? "-" : val.status_send}</td>
<td>{val.created_at === "" ? "-" : moment(val.created_date).format("DD-MM-YYYY HH:mm:ss")}</td>
<td>{val.created_at === "" ? "-" : moment(val.created_at).format("DD-MM-YYYY HH:mm:ss")}</td>
<td>{val.description === "" ? "-" : val.description}</td>
<td>{ matchedUser ? matchedUser.name : "-" }</td>
<td>
{val.send_to_type === "all" ? "All User" : ""}
{val.send_to_type === "roles" ? matchRolesName[index] : ""}
{typeof val.send_to_id === 'string' && val.send_to_id.indexOf(',') === -1 ? matchedUserNamesNotKoma[index] : ""}
{typeof val.send_to_id === 'string' && val.send_to_id.includes(',') ? matchedUserNames[index] : ""}
</td>
<td>{val.title_notif === "" ? "-" : val.title_notif}</td>
<td>{val.message_notif === "" ? "-" : val.message_notif}</td>
</tr>

103
src/views/Master/MasterBroadcast/index.js
Unescape View File

@ -5,7 +5,7 @@ import React, { Component } from 'react';
import SweetAlert from 'react-bootstrap-sweetalert';
import axios from 'axios';
import moment from 'moment';
import { USER_LIST, BASE_SIMPRO_LUMEN } from '../../../const/ApiConst';
import { USER_LIST, BASE_SIMPRO_LUMEN, ROLE_LIST } from '../../../const/ApiConst';
import { Button, Card, CardBody, CardHeader, DropdownItem, DropdownMenu, DropdownToggle, Input, InputGroup, InputGroupButtonDropdown, Table, Row, Col } from 'reactstrap';
import { DatePicker, Pagination } from 'antd';
import { NotificationContainer, NotificationManager } from 'react-notifications';
@ -92,9 +92,31 @@ class index extends Component {
console.log('Get Data User', result)
if (result && result.data && result.status == 200) {
this.setState({ dataUser: result.data.data }, () => {
const dataRes = result.data.data;
const finalData = [];
if (dataRes.length > 0) {
dataRes.map((val, index) => {
let data = {
id: val.id,
name: val.name,
};
finalData.push(data);
});
}
this.setState({ dataUser: finalData });
}
}
getDataRoles = async () => {
const result = await axios
.get(ROLE_LIST, config)
.then(res => res)
.catch((error) => error.response);
console.log('Get Data Roles', result)
if (result && result.data && result.status == 200) {
this.setState({ dataRoles: result.data.data });
}
}
getDataBroadcast = async () => {
@ -147,6 +169,7 @@ class index extends Component {
if (result.data.code === 200) {
this.setState({ dataTable: result.data.data, totalPage: result.data.totalRecord });
this.getDataUsers()
this.getDataRoles()
} else {
NotificationManager.error('Failed retreiving data!!', 'Failed');
}
@ -326,18 +349,47 @@ class index extends Component {
handleExportExcel = async () => {
const dataExcel = this.state.dataTable || [];
const dataUser = this.state.dataUser || [];
const dataRoles = this.state.dataRoles || [];
const dataExport = [];
dataExcel.map((val) => {
const matchedUser = dataUser.find(item => item.id == val.send_to_id);
const matchedUserNames = [];
const matchedUserNamesNotKoma = [];
const matchRolesName = [];
if (typeof val.send_to_id === 'string' && val.send_to_id.includes(',')) {
const sendToIds = val.send_to_id.split(',').map(id => parseInt(id, 10));
matchedUserNames[index] = sendToIds.map(id => {
const matchedUser = dataUser.find(item => item.id === id);
return matchedUser ? <div>{"- " + matchedUser.name}</div> : null;
});
}
if (typeof val.send_to_id === 'string' && val.send_to_id.indexOf(',') === -1) {
const id = parseInt(val.send_to_id, 10);
const matchedUser = dataUser.find(item => item.id === id);
matchedUserNamesNotKoma[index] = matchedUser ? <div>{matchedUser.name}</div> : null;
}
if (val.send_to_type === 'roles') {
const id = parseInt(val.send_to_id, 10);
const matchedRole = dataRoles.find(item => item.id === id);
matchRolesName[index] = matchedRole ? <div>{matchedRole.name}</div> : null;
}
let row = {
"Tanggal Broadcast": moment(val.created_at).format("YYYY-MM-DD HH:mm:ss"),
"Judul": val.title_notif,
"Penerima": matchedUser ? matchedUser.name : "-",
"Penerima": (val.send_to_type === "all" ? "All User" : "") +
(val.send_to_type === "roles" ? (matchRolesName[index] ? 'Role: ' + matchRolesName[index].props.children : "") : "") +
(typeof val.send_to_id === 'string' && val.send_to_id.indexOf(',') === -1 ? (matchedUserNamesNotKoma[index] ? matchedUserNamesNotKoma[index].props.children : "") : "") +
(typeof val.send_to_id === 'string' && val.send_to_id.includes(',') ? (matchedUserNames[index] ? matchedUserNames[index].map(item => item.props.children).join("") : "") : ""),
"Pesan": val.message_notif,
"Deskripsi": val.description,
"Status": val.status_send
}
};
dataExport.push(row);
});
const fileName = "Broadcast.xlsx";
const ws = XLSX.utils.json_to_sheet(dataExport);
@ -399,11 +451,34 @@ class index extends Component {
]
const dataTable2 = this.state.dataTable || [];
const dataUser = this.state.dataUser || [];
const dataRoles = this.state.dataRoles || [];
return (
<tbody>
{dataTable2.length !== 0 ? dataTable2.map((n) => {
const matchedUser = dataUser.find(item => item.id == n.send_to_id);
{dataTable2.length !== 0 ? dataTable2.map((n, index) => {
const matchedUserNames = [];
const matchedUserNamesNotKoma = [];
const matchRolesName = [];
if (typeof n.send_to_id === 'string' && n.send_to_id.includes(',')) {
const sendToIds = n.send_to_id.split(',').map(id => parseInt(id, 10));
matchedUserNames[index] = sendToIds.map(id => {
const matchedUser = dataUser.find(item => item.id === id);
return matchedUser ? <div>{"- " + matchedUser.name}</div> : null;
});
}
if (typeof n.send_to_id === 'string' && n.send_to_id.indexOf(',') === -1) {
const id = parseInt(n.send_to_id, 10);
const matchedUser = dataUser.find(item => item.id === id);
matchedUserNamesNotKoma[index] = matchedUser ? <div>{matchedUser.name}</div> : null;
}
if (n.send_to_type === 'roles') {
const id = parseInt(n.send_to_id, 10);
const matchedRole = dataRoles.find(item => item.id === id);
matchRolesName[index] = matchedRole ? <div><b>Role </b>{matchedRole.name}</div> : null;
}
return (
<tr key={n.id}>
<td width={93}>
@ -418,13 +493,19 @@ class index extends Component {
Detail
</Tooltip>
</Col>
</Row> </td>
</Row>
</td>
<td>{n.title_notif}</td>
<td>{n.message_notif !== "" ? n.message_notif : "-"}</td>
<td>{n.description !== "" ? n.description : "-"}</td>
<td>{ matchedUser ? matchedUser.name : "-" }</td>
<td>
{n.send_to_type === "all" ? "All User" : ""}
{n.send_to_type === "roles" ? matchRolesName[index] : ""}
{typeof n.send_to_id === 'string' && n.send_to_id.indexOf(',') === -1 ? matchedUserNamesNotKoma[index] : ""}
{typeof n.send_to_id === 'string' && n.send_to_id.includes(',') ? matchedUserNames[index] : ""}
</td>
<td>{n.status_send !== "" ? n.status_send : "-"}</td>
<td>{n.created_at !== "" ? moment.utc(n.created_at).format("DD-MM-YYYY HH:mm:ss") : "-"}</td>
<td>{n.created_at !== "" ? moment(n.created_at).format("DD-MM-YYYY HH:mm:ss") : "-"}</td>
</tr>
);
}) : <tr>

21
src/views/Master/MasterMenu/index.js
Unescape View File

@ -5,7 +5,7 @@ import SweetAlert from 'react-bootstrap-sweetalert';
import axios from 'axios';
import { Button } from 'reactstrap';
import { Card, CardBody, CardHeader, Col, Row, Input } from 'reactstrap';
import { MENU_ADD, MENU_SEARCH, MENU_EDIT, MENU_DELETE } from '../../../const/ApiConst.js';
import { MENU_ADD, MENU_SEARCH, MENU_EDIT, MENU_DELETE, MENU_LIST } from '../../../const/ApiConst.js';
import { NotificationContainer, NotificationManager } from 'react-notifications';
import { Pagination, Tooltip, Table } from 'antd';
import { useTranslation } from 'react-i18next';
@ -67,22 +67,20 @@ const Index = ({ params }) => {
};
const getDataAllMenu = async () => {
const payload = {
"paging": { "start": 0, "length": -1 },
"columns": [
{ "name": "name", "logic_operator": "ilike", "value": "", "operator": "AND" }
],
"joins": [],
"orders": { "columns": ["id"], "ascending": false }
}
const result = await axios
.post(MENU_SEARCH, payload, config)
.get(MENU_LIST, config)
.then(res => res)
.catch((error) => error.response);
if (result && result.data && result.data.code == 200) {
setAllDataMenu(result.data.data);
let arr = []
let dataRes = result.data.data;
for (const v in dataRes) {
arr.push(dataRes[v])
}
setAllDataMenu(arr);
}else {
NotificationManager.error('Gagal Mengambil Data!!', 'Failed');
}
}
@ -123,6 +121,7 @@ const Index = ({ params }) => {
const handleOpenDialog = async (type) => {
await setTypeDialog(type)
getDataAllMenu();
setOpenDialog(true)
}

12
src/views/SimproV2/CreatedProyek/AsignCustProject.js
Unescape View File

@ -32,11 +32,6 @@ const AssignCustProject = ({ openDialog, closeDialog, toggleDialog, idTask, proy
}
}, [openDialog]);
useEffect(() => {
if (openDialog) {
}
}, [dataUserToProject])
const getDataAssignHr = async () => {
const payload = {
"paging": {
@ -45,7 +40,8 @@ const AssignCustProject = ({ openDialog, closeDialog, toggleDialog, idTask, proy
},
"columns": [
{ "name": "name", "logic_operator": "ilike", "value": "", "table_name": "m_users" },
{ "name": "proyek_id", "logic_operator": "=", "value": idTask }
{ "name": "proyek_id", "logic_operator": "=", "value": idTask },
{ "name": "is_customer", "logic_operator": "=", "value": "true" }
],
"joins": [
{ "name": "m_users", "column_join": "user_id", "column_results": ["name"] },
@ -144,7 +140,9 @@ const AssignCustProject = ({ openDialog, closeDialog, toggleDialog, idTask, proy
}
const handleCloseDialogFormTools = (type, data) => {
if (type === "add") getDataAssignHr();
if (type === "add") {
getDataAssignHr()
}
if (type === "success") {
NotificationManager.success(
`Assign Customer Project berhasil disimpan!`,

3
src/views/SimproV2/CreatedProyek/AsignHrProject.js
Unescape View File

@ -48,7 +48,8 @@ const AssignHrProject = ({ openDialog, closeDialog, toggleDialog, idTask, toolsR
},
"columns": [
{ "name": "name", "logic_operator": "ilike", "value": "", "table_name": "m_users" },
{ "name": "proyek_id", "logic_operator": "=", "value": idTask }
{ "name": "proyek_id", "logic_operator": "=", "value": idTask },
{ "name": "is_customer", "logic_operator": "=", "value": "false" }
],
"joins": [
{ "name": "m_users", "column_join": "user_id", "column_results": ["name"] },

31
src/views/SimproV2/CreatedProyek/DialogAssignCust.js
Unescape View File

@ -3,7 +3,7 @@ import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
import { Button, Form } from 'reactstrap';
import axios from "../../../const/interceptorApi";
import {
USER_LIST,
USER_SEARCH,
ASSIGN_HR_PROJECT_SEARCH,
ASSIGN_HR_PROJECT_ADD_MULTIPLE
} from '../../../const/ApiConst';
@ -40,8 +40,29 @@ const DialogAssignCust = ({ openDialog, closeDialog, toggleDialog, idTask }) =>
const getDataAssignCustomer = async () => {
const payload = {
"select": [
"id",
"name",
"role_id"
],
"paging": {
"start": 0,
"length": -1
},
"columns": [
{ "name": "role_id", "logic_operator": "=", "value": 44 }
],
"orders": {
"columns": [
"id"
],
"ascending": false
}
}
const URL = USER_SEARCH;
const result = await axios
.get(USER_LIST, HEADER)
.post(URL, payload, HEADER)
.then(res => res)
.catch((error) => error.response);
@ -99,6 +120,12 @@ const DialogAssignCust = ({ openDialog, closeDialog, toggleDialog, idTask }) =>
const getCustProject = async () => {
const payload = {
"select": [
"id",
"user_id",
"proyek_id",
"is_customer"
],
"columns": [
{ "name": "proyek_id", "logic_operator": "=", "value": idTask },
{"name": "is_customer", "logic_operator": "=", "value": "true"}

204
src/views/SimproV2/CreatedProyek/DialogFormProyek.js
Unescape View File

@ -200,6 +200,7 @@ const DialogFormProyek = ({
setFinance("");
setWorkArea("");
setProjectDuration("");
setDivisiProject(null);
setProjectStructureOrg(null);
setCompany("");
setCurrency("");
@ -332,15 +333,32 @@ const DialogFormProyek = ({
};
const onChangePm = (val) => {
let data = [...dataPM];
var item = data.find((item) => item.id === val);
participants.push({
id: lastIdxParticipants + 1,
title: "PM",
const item = dataPM.find((item) => item.id === val);
const existingParticipant = participants.find((participant) => participant.tittle === "PM");
if (existingParticipant) {
setParticipants((prevParticipants) => {
return prevParticipants.map((participant) => {
if (participant.tittle === "PM") {
return {
...participant,
name: item.name,
};
}
return participant;
});
setParticipants(participants);
});
} else {
setParticipants((prevParticipants) => [
...prevParticipants,
{
id: item.id,
tittle: "PM",
name: item.name,
},
]);
setLastIdxParticipants(lastIdxParticipants + 1);
}
setPic(val);
};
@ -398,7 +416,7 @@ const DialogFormProyek = ({
const addParticipant = () => {
participants.push({
id: lastIdxParticipants + 1,
title: "",
tittle: "",
name: "",
});
setParticipants(participants);
@ -438,6 +456,23 @@ const DialogFormProyek = ({
const handleInputChangeParticipants = (e, index) => {
const { name, value } = e.target;
const existingParticipant = participants.find((participant) => participant.tittle === "PM");
if(value.toLowerCase() === "pm" && name === "tittle" && existingParticipant)
{
alert('PM is already exist!');
setParticipants((prevParticipants) =>
prevParticipants.map((participant, i) => {
if (i === index) {
return {
...participant,
tittle: "",
};
}
return participant;
})
);
return false;
}
const newParticipants = [...participants];
newParticipants[index][name] = value;
setParticipants(newParticipants);
@ -565,7 +600,7 @@ const DialogFormProyek = ({
const addApproval = () => {
approval.push({
id: lastIdxApproval + 1,
title: "",
tittle: "",
name: "",
date: moment(),
});
@ -611,7 +646,7 @@ const DialogFormProyek = ({
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">
<Label className="capitalize" style={{ fontWeight: "bold" }}>
Project Name<span style={{ color: "red" }}>*</span>
</Label>
<Input
@ -623,7 +658,7 @@ const DialogFormProyek = ({
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Code / Short Name<span style={{ color: "red" }}>*</span></Label>
<Label className="capitalize" style={{ fontWeight: "bold" }}>Code / Short Name<span style={{ color: "red" }}>*</span></Label>
<Input
type="text"
value={shortName}
@ -635,7 +670,7 @@ const DialogFormProyek = ({
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">
<Label className="capitalize" style={{ fontWeight: "bold" }}>
Project Type<span style={{ color: "red" }}>*</span>
</Label>
<Select
@ -658,7 +693,7 @@ const DialogFormProyek = ({
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">PM</Label>
<Label className="capitalize" style={{ fontWeight: "bold" }}>PM</Label>
<Select
showSearch
filterOption={(inputValue, option) =>
@ -681,7 +716,7 @@ const DialogFormProyek = ({
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">
<Label className="capitalize" style={{ fontWeight: "bold" }}>
Start Date<span style={{ color: "red" }}>*</span>
</Label>
<DatePicker
@ -694,7 +729,7 @@ const DialogFormProyek = ({
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">
<Label className="capitalize" style={{ fontWeight: "bold" }}>
End Date<span style={{ color: "red" }}>*</span>
</Label>
<DatePicker
@ -716,7 +751,7 @@ const DialogFormProyek = ({
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Work Area</Label>
<Label className="capitalize" style={{ fontWeight: "bold" }}>Work Area</Label>
<Input
type="text"
value={workArea}
@ -726,7 +761,7 @@ const DialogFormProyek = ({
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Company</Label>
<Label className="capitalize" style={{ fontWeight: "bold" }}>Company</Label>
<Input
type="text"
value={company}
@ -738,7 +773,7 @@ const DialogFormProyek = ({
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">
<Label className="capitalize" style={{ fontWeight: "bold" }}>
Budget<span style={{ color: "red" }}>*</span>
</Label>
<Row>
@ -768,8 +803,14 @@ const DialogFormProyek = ({
<Row>
<Col md={6}>
<FormGroup>
<Label>Handled By Division</Label>
<Label className="capitalize" style={{ fontWeight: "bold" }}>
Handled By Division<span style={{ color: "red" }}>*</span>
</Label>
<Select
showSearch
filterOption={(inputValue, option) =>
option.children.toLowerCase().includes(inputValue.toLowerCase())
}
value={divisiProject}
defaultValue={divisiProject}
onChange={onChangeDivisiProject}
@ -785,7 +826,7 @@ const DialogFormProyek = ({
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Project Duration</Label>
<Label className="capitalize" style={{ fontWeight: "bold" }}>Project Duration</Label>
<Input
type="number"
min="1"
@ -798,7 +839,7 @@ const DialogFormProyek = ({
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Organizational Structure</Label>
<Label className="capitalize" style={{ fontWeight: "bold" }}>Organizational Structure</Label>
<Input
type="file"
accept="image/*"
@ -809,7 +850,7 @@ const DialogFormProyek = ({
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Description</Label>
<Label className="capitalize" style={{ fontWeight: "bold" }}>Description</Label>
<Input
type="textarea"
value={description}
@ -820,7 +861,7 @@ const DialogFormProyek = ({
</Row>
<Row>
<Col md={12}>
<Label className="capitalize">Late Consequence</Label>
<Label className="capitalize" style={{ fontWeight: "bold" }}>Late Consequence</Label>
<CKEditor
editor={ ClassicEditor }
data={ late }
@ -832,9 +873,9 @@ const DialogFormProyek = ({
/>
</Col>
</Row>
<Row>
<Row style={{ marginTop: "20px"}}>
<Col md={12}>
<Label className="capitalize">Assumtion</Label>
<Label className="capitalize" style={{ fontWeight: "bold" }}>Assumtion</Label>
<CKEditor
editor={ClassicEditor}
data={assumtion}
@ -846,18 +887,18 @@ const DialogFormProyek = ({
/>
</Col>
</Row>
<Row>
<Row style={{ marginTop: "20px"}}>
<Col md={12}>
<Label className="capitalize">Project Checklist</Label>
<Label className="capitalize" style={{ fontWeight: "bold" }}>Project Checklist</Label>
<Row>
<Col md={5}>
<b>Item</b>
<p>Item</p>
</Col>
<Col md={4}>
<b>Availability</b>
<p>Availability</p>
</Col>
<Col md={2}>
<b>Action</b>
<p>Action</p>
</Col>
<Col md={1}>
<Tooltip title="Add row">
@ -877,16 +918,16 @@ const DialogFormProyek = ({
<Divider orientation="left" plain></Divider>
<Row>
<Col md={12}>
<Label className="capitalize">Issues & Obstacles</Label>
<Label className="capitalize" style={{ fontWeight: "bold" }}>Issues & Obstacles</Label>
<Row>
<Col md={5}>
<b>Issu Level</b>
<p>Issue Level</p>
</Col>
<Col md={4}>
<b>Description</b>
<p>Description</p>
</Col>
<Col md={2}>
<b>Action</b>
<p>Action</p>
</Col>
<Col md={1}>
<Tooltip title="Add row">
@ -909,7 +950,7 @@ const DialogFormProyek = ({
<Row>
<Col md={6}>
<FormGroup>
<Label>Phase</Label>
<Label style={{ fontWeight: "bold" }}>Phase</Label>
<Select
value={phaseProject}
defaultValue={phaseProject}
@ -926,7 +967,7 @@ const DialogFormProyek = ({
</Col>
<Col md={6}>
<FormGroup>
<Label>Cost Health</Label>
<Label style={{ fontWeight: "bold" }}>Cost Health</Label>
<Select
value={budgetHealth}
defaultValue={budgetHealth}
@ -954,47 +995,47 @@ const DialogFormProyek = ({
<b>Project Objectives</b>
</Col>
<Col md={9}>
<FormGroup>
<Input
type="textarea"
value={objectives}
onChange={(e) => setObjectives(e.target.value)}
<CKEditor
editor={ClassicEditor}
data={objectives}
config={editorConfig}
onChange={ ( event, editor ) => {
const data = editor.getData();
setObjectives(data);
} }
/>
</FormGroup>
</Col>
</Row>
<Row>
<Row style={{ marginTop: "20px" }}>
<Col md={3}>
<b>Project is considered successful when</b>
</Col>
<Col md={9}>
<FormGroup>
<Input
type="textarea"
value={projectIsConsideredSuccessful}
onChange={(e) =>
setProjectIsConsideredSuccessful(e.target.value)
}
placeholder={`List of indicators`}
rows={5}
<CKEditor
editor={ClassicEditor}
data={projectIsConsideredSuccessful}
config={editorConfig}
onChange={ ( event, editor ) => {
const data = editor.getData();
setProjectIsConsideredSuccessful(data);
} }
/>
</FormGroup>
</Col>
</Row>
<Row>
<Row style={{ marginTop:"20px" }}>
<Col md={3}>
<b>Project Participants</b>
</Col>
<Col md={9}>
<Row>
<Col md={5}>
<b>Title</b>
<p>Title</p>
</Col>
<Col md={4}>
<b>Name</b>
<p>Name</p>
</Col>
<Col md={2}>
<b>Action</b>
<p>Action</p>
</Col>
<Col md={1}>
<Tooltip title="Add row">
@ -1011,35 +1052,36 @@ const DialogFormProyek = ({
<div style={{ marginBottom: 50 }}>{RenderParticipants()}</div>
</Col>
</Row>
<Row>
<Row style={{ marginTop:"20px" }}>
<Col md={3}>
<b>Testing Environment</b>
</Col>
<Col md={9}>
<FormGroup>
<Input
type="textarea"
value={testingEnv}
onChange={(e) => setTestingEnv(e.target.value)}
rows={5}
<CKEditor
editor={ClassicEditor}
data={testingEnv}
config={editorConfig}
onChange={ ( event, editor ) => {
const data = editor.getData();
setTestingEnv(data);
} }
/>
</FormGroup>
</Col>
</Row>
<Row>
<Row style={{ marginTop:"20px" }}>
<Col md={3}>
<b>Milestones</b>
</Col>
<Col md={9}>
<Row>
<Col md={4}>
<b>Status</b>
<p>Status</p>
</Col>
<Col md={4}>
<b>Deadline</b>
<p>Deadline</p>
</Col>
<Col md={3}>
<b>Action</b>
<p>Action</p>
</Col>
<Col md={1}>
<Tooltip title="Add row">
@ -1056,23 +1098,23 @@ const DialogFormProyek = ({
<div style={{ marginBottom: 50 }}>{RenderMilestones()}</div>
</Col>
</Row>
<Row>
<Row style={{ marginTop:"20px" }}>
<Col md={3}>
<b>Potential Risk</b>
</Col>
<Col md={9}>
<Row>
<Col md={3}>
<b>Risk Level</b>
<p>Risk Level</p>
</Col>
<Col md={3}>
<b>Description</b>
<p>Description</p>
</Col>
<Col md={3}>
<b>Prevention</b>
<p>Prevention</p>
</Col>
<Col md={2}>
<b>Action</b>
<p>Action</p>
</Col>
<Col md={1}>
<Tooltip title="Add row">
@ -1089,23 +1131,23 @@ const DialogFormProyek = ({
<div style={{ marginBottom: 50 }}>{RenderRisk()}</div>
</Col>
</Row>
<Row>
<Row style={{ marginTop:"20px" }}>
<Col md={3}>
<b>Approval</b>
</Col>
<Col md={9}>
<Row>
<Col md={3}>
<b>Title</b>
<p>Title</p>
</Col>
<Col md={3}>
<b>Name</b>
<p>Name</p>
</Col>
<Col md={3}>
<b>Date</b>
<p>Date</p>
</Col>
<Col md={2}>
<b>Action</b>
<p>Action</p>
</Col>
<Tooltip title="Add row">
<Col md={1}>
@ -1313,8 +1355,8 @@ const DialogFormProyek = ({
<Col md={4}>
<Input
type="text"
value={item.tittle ? item.tittle : "-"}
name="title"
value={item.tittle}
name="tittle"
onChange={(e) => handleInputChangeParticipants(e, index)}
/>
</Col>
@ -1413,7 +1455,7 @@ const DialogFormProyek = ({
<Col md={3}>
<Input
type="text"
value={item.tittle ? item.tittle : item.title}
value={item.tittle ? item.tittle : item.tittle}
name="title"
onChange={(e) => handleInputChangeApproval(e, index)}
/>

6
src/views/SimproV2/CreatedProyek/DialogGantt.js
Unescape View File

@ -74,14 +74,16 @@ const DialogGantt = ({ openDialog, closeDialog, toggleDialog, idTask, proyekName
"select": ["id", "name_version", "calculation_type", "description", "created_at", "progress"],
"columns": [
{ "name": "hierarchy_ftth_id", "logic_operator": "=", "value": hierarchyId, "operator": "AND" }
]
],
"orders": { "columns": ["name_version"], "ascending": true }
}
} else {
payload = {
"select": ["id", "name_version", "calculation_type", "description", "created_at", "progress"],
"columns": [
{ "name": "proyek_id", "logic_operator": "=", "value": idTask, "operator": "AND" }
]
],
"orders": { "columns": ["name_version"], "ascending": true },
}
}
const result = await axios

4
src/views/SimproV2/CreatedProyek/DialogHierarchy.js
Unescape View File

@ -16,6 +16,7 @@ import { useTranslation } from 'react-i18next';
import { async } from '@dabeng/react-orgchart';
import { Link } from 'react-router-dom';
import { use } from 'i18next';
import _ from 'lodash';
const DialogHierarchy = ({ openDialog, closeDialog, toggleDialog, idTask, proyekName }) => {
const token = localStorage.getItem("token")
const HEADER = {
@ -154,7 +155,8 @@ const DialogHierarchy = ({ openDialog, closeDialog, toggleDialog, idTask, proyek
.catch((error) => error.response);
if (result && result.status == 200) {
setDataHierarchy(result.data.data);
const sortedData = _.orderBy(result.data.data, ['name'], ['asc']);
setDataHierarchy(sortedData);
} else {
NotificationManager.error(`Data gantt project gagal terload silahkan coba lagi!`, 'Failed!!');
}

34
src/views/SimproV2/CreatedProyek/FormAsignHr.js
Unescape View File

@ -22,7 +22,6 @@ const FormAsignHr = ({ openDialog, closeDialog, toggleDialog, idTask, dataEdit,
const [accrue, setAccrue] = useState("")
const [baseCalender, setBaseCalender] = useState("")
const [listHr, setListHr] = useState([])
const [isCustomer, setIsCustomer] = useState(false)
const handleClearData = () => {
setUser(null)
@ -30,7 +29,6 @@ const FormAsignHr = ({ openDialog, closeDialog, toggleDialog, idTask, dataEdit,
setProjectRole(null)
setGroupR("")
setMaxUsed("")
setIsCustomer(false)
setStandartRate("")
setUomStandartRate(null)
setOverTimeRate("")
@ -69,7 +67,6 @@ const FormAsignHr = ({ openDialog, closeDialog, toggleDialog, idTask, dataEdit,
setProjectRole(dataEdit.project_role)
setGroupR(dataEdit.group_r)
setMaxUsed(dataEdit.max_used ? formatNumber(dataEdit.max_used.toString()) : '')
setIsCustomer(dataEdit.is_customer)
setStandartRate(dataEdit.standart_rate ? formatNumber(dataEdit.standart_rate.toString()) : '')
setUomStandartRate(dataEdit.uom_standart_rate)
setOverTimeRate(dataEdit.overtime_rate ? formatNumber(dataEdit.overtime_rate.toString()) : '')
@ -94,7 +91,7 @@ const FormAsignHr = ({ openDialog, closeDialog, toggleDialog, idTask, dataEdit,
proyek_id: idTask,
user_id:user,
project_role:projectRole,
is_customer: isCustomer,
is_customer: false,
max_used:maxUsed.replaceAll(".", ""),
standart_rate:standartRate.replaceAll(".", ""),
uom_standart_rate:uomStandartRate,
@ -108,7 +105,7 @@ const FormAsignHr = ({ openDialog, closeDialog, toggleDialog, idTask, dataEdit,
proyek_id: idTask,
user_id:user,
project_role:projectRole,
is_customer: isCustomer,
is_customer: false,
max_used:maxUsed.replaceAll(".", ""),
standart_rate:standartRate.replaceAll(".", ""),
uom_standart_rate:uomStandartRate,
@ -162,33 +159,6 @@ const FormAsignHr = ({ openDialog, closeDialog, toggleDialog, idTask, dataEdit,
</FormGroup>
</Col>
</Row>
<Row>
<Col>
<FormGroup>
<Label>Customer</Label>
<div>
<Select
value={isCustomer}
defaultValue={false}
style={{
width: 235,
}}
onChange={(val) => setIsCustomer(val)}
options={[
{
value: true,
label: 'Yes',
},
{
value: false,
label: 'No',
}
]}
/>
</div>
</FormGroup>
</Col>
</Row>
<div style={{widht:"100%",display:"flex",flexDirection:"row",justifyContent:"space-between",alignItems:"center"}}>
<FormGroup style={{flexBasis:"49%"}}>
<Label>Standart Rate</Label>

215
src/views/SimproV2/CreatedProyek/ViewProject.js
Unescape View File

@ -1,4 +1,4 @@
import React, { useEffect, useState } from 'react'
import React, { useEffect, useState, useRef } from 'react'
import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
import { Button } from 'reactstrap';
import moment from 'moment';
@ -6,13 +6,18 @@ import 'antd/dist/antd.css';
import _ from 'underscore'
import './style.css'
import { formatThousand, sortBy } from '../../../const/CustomFunc';
import { BASE_OSPRO } from "../../../const/ApiConst";
import { BASE_OSPRO, PROYEK_SEARCH} from "../../../const/ApiConst";
import { Tooltip, Spin } from 'antd';
import { useTranslation } from 'react-i18next';
import axios from "../../../const/interceptorApi"
import autoTable from "jspdf-autotable";
import jsPDF from "jspdf";
const createMarkup = (element) => {
return {__html: element};
}
const ViewProject = ({ openDialog, closeDialog, toggleDialog, projectCharter, projectParticipant, projectChecklist, projectIssue, projectRisk, projectMilestone, projectApproval, projectManager, projectK3, assignHR, projectImage }) => {
const ViewProject = ({ idTask, openDialog, closeDialog, toggleDialog, projectCharter, projectParticipant, projectChecklist, projectIssue, projectRisk, projectMilestone, projectApproval, projectManager, projectK3, assignHR, projectImage }) => {
const [proyekName, setProyekName] = useState("")
const [description, setDescription] = useState("")
const [shortname, setKodeShortname] = useState("")
@ -41,6 +46,18 @@ const createMarkup = (element) => {
const [K3Search, setDataK3Search] = useState("")
const [HR, setAssignHR] = useState("")
const formatDate = "DD-MM-YYYY";
const reportTemplateRef = useRef(null);
const [loading, setLoading] = useState(true);
const { t } = useTranslation();
const token = localStorage.getItem("token");
const HEADER = {
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${token}`,
},
};
useEffect(() => {
if(!openDialog){
setProyekName("")
@ -69,6 +86,7 @@ const createMarkup = (element) => {
setMilestone([])
setPotentialRisks("")
setApproval([])
setLoading(false)
}
}, [openDialog]);
@ -77,7 +95,7 @@ const createMarkup = (element) => {
setProyekName(projectCharter.nama);
setDescription(projectCharter.keterangan);
setKodeShortname(projectCharter.kode_sortname);
setLokasiKantor(projectCharter.lokasi_kantor);
setLokasiKantor(projectCharter.area_kerja);
setDurasiProyek(projectCharter.durasi_proyek);
setMulaiProyek(projectCharter.mulai_proyek);
setValueProyek(projectCharter.value_proyek);
@ -155,6 +173,19 @@ const createMarkup = (element) => {
setAssignHR(assignHR)
}
}, [assignHR]);
const handleExportPdf = async () => {
const doc = new jsPDF({
orientation: 'landscape',
unit: 'px',
format: [1106, 1000]
});
doc.html(reportTemplateRef.current, {
async callback(doc) {
await doc.save('Project Charter');
},
});
};
const RenderParticipant = () => {
if(participants && participants.length > 0){
@ -182,14 +213,18 @@ const createMarkup = (element) => {
const K3Number = number[index];
return(
<tr key={index}>
<td style={{...tdStyle, width:50, textAlign:'center' }}><p style={pStyle}>{ K3Number }</p></td>
<td style={tdStyle} className='plr-10'><p style={pStyle}>{val.checklist_k3_name ? val.checklist_k3_name : "-"}</p></td>
<td style={{...tdStyle, width:50, textAlign:'center' }}><p style={{ ...pStyle, fontWeight:'normal' }}>{ K3Number }</p></td>
<td style={ tdStyle } className='plr-10'><p style={{ ...pStyle, fontWeight:'normal' }}>{val.checklist_k3_name ? val.checklist_k3_name : "-"}</p></td>
</tr>
)
})
)
}else{
return (<tr><td><br></br></td></tr>)
return (
<tr>
<td style={{ ...tdStyle, textAlign: "center" }}>-</td>
<td style={{ ...tdStyle, textAlign: "center" }}>-</td>
</tr>);
}
}
@ -201,10 +236,10 @@ const createMarkup = (element) => {
const ChecklistNumber = number[index];
return(
<tr key={index}>
<td style={{...tdStyle, width:50, textAlign:'center' }}><p style={pStyle}>{ ChecklistNumber }</p></td>
<td style={tdStyle} className='plr-10'><p style={pStyle}>{val.item ? val.item : "-"}</p></td>
<td style={{...tdStyle, width:50, textAlign:'center' }}><p style={{ ...pStyle, fontWeight:'normal' }}>{ ChecklistNumber }</p></td>
<td style={ tdStyle } className='plr-10'><p style={{ ...pStyle, fontWeight:'normal' }}>{val.item ?? "-"}</p></td>
<td style={ tdStyle } className='plr-10'>
<p style={pStyle}>
<p style={{ ...pStyle, fontWeight:'normal' }}>
{val.status_exist === true ? "Tersedia" : "Tidak tersedia"}
</p>
</td>
@ -213,7 +248,12 @@ const createMarkup = (element) => {
})
)
}else{
return (<tr><td><br></br></td></tr>)
return (
<tr>
<td style={{ ...tdStyle, textAlign: "center" }}>-</td>
<td style={{ ...tdStyle, textAlign: "center" }}>-</td>
<td style={{ ...tdStyle, textAlign: "center" }}>-</td>
</tr>);
}
}
@ -224,17 +264,21 @@ const createMarkup = (element) => {
return(
<tr key={index}>
<td style={{ ...tdStyle, width:50, textAlign:'center' }} className='plr-10'>
<p style={pStyle}>
<p style={{ ...pStyle, fontWeight:'normal' }}>
{val.level_issue ? val.level_issue : "-"}
</p>
</td>
<td style={tdStyle} className='plr-10'><p style={pStyle}>{val.description ? val.description : "-"}</p></td>
<td style={ tdStyle } className='plr-10'><p style={{ ...pStyle, fontWeight:'normal' }}>{val.description ? val.description : "-"}</p></td>
</tr>
)
})
)
}else{
return (<tr><td><br></br></td></tr>)
return (
<tr>
<td style={{ ...tdStyle, textAlign:"center" }}>-</td>
<td style={{ ...tdStyle, textAlign:"center" }}>-</td>
</tr>)
}
}
@ -245,18 +289,23 @@ const createMarkup = (element) => {
return(
<tr key={index}>
<td style={{ ...tdStyle, width:50, textAlign:'center' }} className='plr-10'>
<p style={pStyle}>
{val.level_risk ? val.level_risk : "-"}
<p style={{ ...pStyle, fontWeight:'normal' }}>
{val.level_risk ?? "-"}
</p>
</td>
<td style={tdStyle} className='plr-10'><p style={pStyle}>{val.description ? val.description : "-"}</p></td>
<td style={tdStyle} className='plr-10'><p style={pStyle}>{val.preventive_risk ? val.preventive_risk : "-"}</p></td>
<td style={ tdStyle } className='plr-10'><p style={{ ...pStyle, fontWeight:'normal' }}>{val.description ?? "-"}</p></td>
<td style={ tdStyle } className='plr-10'><p style={{ ...pStyle, fontWeight:'normal' }}>{val.preventive_risk ?? "-"}</p></td>
</tr>
)
})
)
}else{
return (<tr><td><br></br></td></tr>)
return (
<tr>
<td style={{ ...tdStyle, textAlign:"center" }}>-</td>
<td style={{ ...tdStyle, textAlign:"center" }}>-</td>
<td style={{ ...tdStyle, textAlign:"center" }}>-</td>
</tr>)
}
}
@ -267,20 +316,25 @@ const createMarkup = (element) => {
return(
<tr key={index}>
<td style={tdStyle} className='plr-10'>
<p>{val.join_first_name ? val.join_first_name : val.join_first_name}</p>
<p>{val.join_first_name ? val.join_first_name : "-"}</p>
</td>
<td style={tdStyle} className='plr-10'>
<p>{val.join_second_name ? val.join_second_name : val.join_second_name}</p>
<p>{val.join_second_name ? val.join_second_name : "-"}</p>
</td>
<td style={tdStyle} className='plr-10'>
<p>{val.join_second_description ? val.join_second_description : val.join_second_description}</p>
<p>{val.join_second_description ? val.join_second_description : "-"}</p>
</td>
</tr>
)
})
)
}else{
return (<tr><td><br></br></td></tr>)
return (
<tr>
<td style={{ ...tdStyle, textAlign:"center" }}>-</td>
<td style={{ ...tdStyle, textAlign:"center" }}>-</td>
<td style={{ ...tdStyle, textAlign:"center" }}>-</td>
</tr>)
}
}
@ -298,20 +352,28 @@ const createMarkup = (element) => {
return (
<tr key={index}>
<td style={tdStyle}>
<p style={{ ...pStyle, textAlign:'center' }}>{milestoneLetter}</p>
<p style={{ ...pStyle, fontWeight:'normal', textAlign:'center' }}>{milestoneLetter}</p>
</td>
<td className='plr-10' style={tdStyle}>
<p style={{ ...pStyle, color: '#000000' }}>{val.status}</p>
<p style={{ ...pStyle, fontWeight:'normal', color: '#000000' }}>{val.status ?? "-"}</p>
</td>
<td className='plr-10' style={{ ...tdStyle, textAlign:'center' }}>
<p>&nbsp;{moment(val.deadline).format(formatDate)}</p>
<p style={{ ...pStyle, fontWeight: 'normal', color: '#000000' }}>
&nbsp;{moment(val.deadline).format(formatDate)}
</p>
</td>
</tr>
);
})
);
} else {
return (<tr><td><br></br></td></tr>);
return (
<tr>
<td style={{ ...tdStyle, textAlign: "center" }}>-</td>
<td style={{ ...tdStyle, textAlign: "center" }}>-</td>
<td style={{ ...tdStyle, textAlign: "center" }}>-</td>
</tr>);
}
}
@ -329,7 +391,10 @@ const createMarkup = (element) => {
})
)
}else{
return (<tr><td><br></br></td></tr>)
return (
<tr>
<td style={{ textAlign:"center" }}>&nbsp;-</td>
</tr>)
}
}
@ -353,26 +418,24 @@ const createMarkup = (element) => {
marginLeft: '5pt',
marginTop: '2pt',
marginBottom: '2pt',
fontFamily: 'Arial',
fontSize: '10pt',
fontWeight: 'bold',
};
const italicStyle = {
fontStyle: 'italic'
};
const boldStyle = {
fontWeight: 'bold',
fontVariant: 'small-caps',
};
const emptyCellStyle = {
padding: '0',
};
const paddingTable = {
paddingTop:"20px",
paddingLeft: "30px",
paddingRight: "30px"
}
const renderForm = () => {
return (
<div>
<div id="pdf-content" style={ paddingTable }>
<h3>Project Charter</h3>
<table style={tableStyle} className="a">
<tbody>
<tr>
@ -385,7 +448,7 @@ const createMarkup = (element) => {
<p style={ pStyle }>Nama Proyek</p>
</td>
<td colSpan="2" style={tdStyle}>
<p style={{ ...pStyle, fontWeight: 'normal', fontStyle: 'italic' }}>{proyekName ?? '-'}</p>
<p className="capitalize" style={{ ...pStyle, fontWeight: 'normal' }}>{proyekName ?? '-'}</p>
</td>
</tr>
<tr>
@ -393,7 +456,7 @@ const createMarkup = (element) => {
<p style={ pStyle }>Project description</p>
</td>
<td colSpan="2" style={tdStyle}>
<p style={{ ...pStyle, fontWeight: 'normal', fontStyle: 'italic' }}>{description ?? '-'}</p>
<p style={{ ...pStyle, fontWeight: 'normal' }}>{description != "" ? description : '-'}</p>
</td>
</tr>
<tr>
@ -409,7 +472,7 @@ const createMarkup = (element) => {
<p style={ pStyle }>Lokasi Proyek</p>
</td>
<td colSpan="2" style={tdStyle}>
<p>&nbsp;{lokasi ?? '-' }</p>
<p>&nbsp;{lokasi != "" ? lokasi :'-' }</p>
</td>
</tr>
<tr>
@ -441,7 +504,7 @@ const createMarkup = (element) => {
<p style={ pStyle }>Anggaran Proyek</p>
</td>
<td colSpan="2" style={tdStyle}>
<p style={{ ...pStyle, fontWeight: 'normal', fontStyle: 'italic' }}>{currency}. {formatThousand(budget)}</p>
<p style={{ ...pStyle, fontWeight: 'normal' }}>{currency}. {formatThousand(budget)}</p>
</td>
</tr>
<tr>
@ -462,7 +525,7 @@ const createMarkup = (element) => {
<p style={ pStyle }>Project Manager</p>
</td>
<td colSpan="2" style={tdStyle}>
<p>&nbsp;{PM}</p>
<p>&nbsp;{PM ?? "-"}</p>
</td>
</tr>
<tr>
@ -480,12 +543,18 @@ const createMarkup = (element) => {
<tbody>
<tr>
<td bgcolor="#F2F2F2" style={tdStyle}>
<p style={{ ...pStyle, fontVariant: 'small-caps' }}>2.0 OBJEKTIF PROYEK (TUJUAN)</p>
<p style={ pStyle }>2.0 OBJEKTIF PROYEK (TUJUAN)</p>
</td>
</tr>
<tr>
<td style={tdStyle}>
<p style={italicStyle}>{objectives ?? '-'}</p>
<p style={{ ...pStyle, fontWeight: 'normal' }}>
{objectives ? (
<span dangerouslySetInnerHTML={createMarkup(objectives)} />
) : (
'-'
)}
</p>
</td>
</tr>
</tbody>
@ -495,13 +564,17 @@ const createMarkup = (element) => {
<tbody>
<tr>
<th style={thStyle}>
<p style={{ ...pStyle, ...boldStyle }}>3.0 RUANG LINGKUP PROYEK</p>
<p style={ pStyle }>3.0 RUANG LINGKUP PROYEK</p>
</th>
</tr>
<tr>
<td style={tdStyle}>
<ul>
{scoupeProyek ? (
<li style={pStyle}>{ scoupeProyek ?? '-' }</li>
) : (
"-"
)}
</ul>
</td>
</tr>
@ -512,7 +585,7 @@ const createMarkup = (element) => {
<tbody>
<tr>
<td colSpan="3" style={thStyle}>
<p style={{ ...pStyle, fontVariant: 'small-caps' }}>4.0 ANGGOTA PROYEK</p>
<p style={ pStyle }>4.0 ANGGOTA PROYEK</p>
</td>
</tr>
<tr>
@ -534,14 +607,14 @@ const createMarkup = (element) => {
<tbody>
<tr>
<th style={thStyle}>
<p style={{ ...pStyle, fontVariant: 'small-caps' }}>5.0 STRUKTUR ORGANISASI</p>
<p style={ pStyle }>5.0 STRUKTUR ORGANISASI</p>
</th>
</tr>
<tr>
<th style={emptyCellStyle}>
<p>&nbsp;
{image ? (
<img src={`${BASE_OSPRO}/assets/image/` + image} style={{ width: "50px" }}></img>
<img src={`${BASE_OSPRO}/assets/image/` + image} style={{ maxWidth: "100%" }}></img>
) : (
'-'
)}
@ -555,7 +628,7 @@ const createMarkup = (element) => {
<tbody>
<tr>
<th colSpan="3" style={thStyle}>
<p style={{ ...pStyle, fontVariant: 'small-caps' }}>6.0 TARGET UTAMA &amp; MILESTONE PENCAPAIAN</p>
<p style={ pStyle }>6.0 TARGET UTAMA &amp; MILESTONE PENCAPAIAN</p>
</th>
</tr>
<tr>
@ -577,7 +650,7 @@ const createMarkup = (element) => {
<tbody>
<tr>
<td colSpan="2" style={thStyle}>
<p style={{ ...pStyle, fontVariant: 'small-caps' }}>7.0 ISU &amp; HAMBATAN UTAMA</p>
<p style={ pStyle }>7.0 ISU &amp; HAMBATAN UTAMA</p>
</td>
</tr>
<tr>
@ -591,13 +664,13 @@ const createMarkup = (element) => {
<RenderIssueProject/>
</tbody>
</table>
<p style={{ ...pStyle, fontSize: '10pt', fontStyle: 'italic' }}>*Skala 1 ke 7 (1 = kecil, 7 = besar)</p>
<p style={{ ...pStyle, fontSize: '10pt', fontWeight: 'normal', fontStyle: 'italic' }}>*Skala 1 ke 7 (1 = kecil, 7 = besar)</p>
<p>&nbsp;</p>
<table style={tableStyle} className="a6">
<tbody>
<tr>
<td colSpan="3" style={thStyle}>
<p style={{ ...pStyle, fontVariant: 'small-caps' }}>8.0 RESIKO</p>
<p style={ pStyle }>8.0 RESIKO</p>
</td>
</tr>
<tr>
@ -614,7 +687,7 @@ const createMarkup = (element) => {
<RenderRiskProject/>
</tbody>
</table>
<p style={{ ...pStyle, fontSize: '10pt', fontStyle: 'italic' }}>*Skala 1 ke 7 (1 = kecil, 7 = besar)</p>
<p style={{ ...pStyle, fontSize: '10pt', fontWeight: 'normal', fontStyle: 'italic' }}>*Skala 1 ke 7 (1 = kecil, 7 = besar)</p>
<p>&nbsp;</p>
<table style={tableStyle} className="a7">
<tbody>
@ -624,7 +697,13 @@ const createMarkup = (element) => {
</th>
</tr>
<tr>
<p dangerouslySetInnerHTML={createMarkup(lateProyek ?? '-')}></p>
<p style={{ ...pStyle, fontWeight: 'normal' }}>
{lateProyek ? (
<span dangerouslySetInnerHTML={createMarkup(lateProyek)} />
) : (
"-"
)}
</p>
</tr>
</tbody>
</table>
@ -638,7 +717,13 @@ const createMarkup = (element) => {
</tr>
<tr>
<th>
<p style={pStyle}>{projectSuccess ?? '-'}</p>
<p style={{ ...pStyle, fontWeight: 'normal' }}>
{projectSuccess ? (
<span dangerouslySetInnerHTML={createMarkup(projectSuccess)} />
) : (
'-'
)}
</p>
</th>
</tr>
</tbody>
@ -653,7 +738,13 @@ const createMarkup = (element) => {
</tr>
<tr>
<td>
<p dangerouslySetInnerHTML={createMarkup(assumtionProyek ?? '-')}></p>
<p style={{ ...pStyle, fontWeight: 'normal' }}>
{assumtionProyek ? (
<span dangerouslySetInnerHTML={createMarkup(assumtionProyek)} />
) : (
'-'
)}
</p>
</td>
</tr>
</tbody>
@ -719,9 +810,17 @@ const createMarkup = (element) => {
return (
<>
<Modal size="xl" isOpen={openDialog} toggle={toggleDialog}>
<ModalHeader className="capitalize" toggle={closeDialog}>Project</ModalHeader>
<ModalHeader className="capitalize" toggle={closeDialog}>
<div>
<Tooltip title={t('Export PDF')}>
<Button style={{ marginLeft: "5px" }} onClick={(e) => handleExportPdf()}><i className="fa fa-print"></i> Export PDF</Button>
</Tooltip>
</div>
</ModalHeader>
<ModalBody>
<div ref={reportTemplateRef}>
{renderForm()}
</div>
</ModalBody>
<ModalFooter>
<Button color="primary" onClick={closeDialog}>Close</Button>

17
src/views/SimproV2/CreatedProyek/index.js
Unescape View File

@ -248,7 +248,9 @@ const CreatedProyek = ({ params, ...props }) => {
.then((res) => res)
.catch((err) => err.response);
if (result && result.data && result.data.code === 200) {
setDataDivisions(result.data.data);
const dataRes = result.data.data;
const filteredData = dataRes.filter(item => item.parent === null);
setDataDivisions(filteredData);
}
};
@ -326,7 +328,7 @@ const CreatedProyek = ({ params, ...props }) => {
},
// { "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 },
orders: { columns: ["nama"], ascending: true },
paging: { start: start, length: rowsPerPage },
};
@ -609,8 +611,8 @@ const CreatedProyek = ({ params, ...props }) => {
.catch((error) => error.response);
if (result && result.data && result.data.code == 200) {
const {kode_sortname,nama,mulai_proyek,rencana_biaya,keterangan,durasi_proyek,project_objectives,potential_risk,currency_symbol, nama_divisi, late_consequence, assumtion, considered_success_when} = result.data.data;
const dataToSend = { kode_sortname, nama, mulai_proyek, rencana_biaya, keterangan, durasi_proyek, project_objectives, potential_risk, currency_symbol, nama_divisi, late_consequence, assumtion, considered_success_when};
const {value_proyek,area_kerja,scoupe_of_work, kode_sortname,nama,mulai_proyek,rencana_biaya,keterangan,durasi_proyek,project_objectives,potential_risk,currency_symbol, nama_divisi, late_consequence, assumtion, considered_success_when} = result.data.data;
const dataToSend = {value_proyek,area_kerja,scoupe_of_work, kode_sortname, nama, mulai_proyek, rencana_biaya, keterangan, durasi_proyek, project_objectives, potential_risk, currency_symbol, nama_divisi, late_consequence, assumtion, considered_success_when};
setProjectCharter(dataToSend);
} else {
NotificationManager.error("Gagal Mengambil Data!!", "Failed");
@ -965,7 +967,7 @@ const CreatedProyek = ({ params, ...props }) => {
const request = data.map((res) => {
const payload = {
proyek_id: parseInt(id),
tittle: res.title,
tittle: res.tittle,
name: res.name,
};
return axios.post(PROJECT_PARTICIPANT_ADD, payload, HEADER);
@ -1365,7 +1367,7 @@ const CreatedProyek = ({ params, ...props }) => {
},
// { "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 },
orders: { columns: ["nama"], ascending: true },
};
const result = await axios
@ -1899,6 +1901,7 @@ const CreatedProyek = ({ params, ...props }) => {
projectK3={projectK3Search}
assignHR={projectAssignHR}
projectImage={image}
idTask={idTask}
/>
),
[openDialogViewDetail]
@ -1996,7 +1999,7 @@ const CreatedProyek = ({ params, ...props }) => {
</Button>
</Tooltip>
)}
<Tooltip title="Export Excel">
<Tooltip title="Export">
<Popover
// content={<a onClick={hide}>Close</a>}
title="Export"

29
src/views/SimproV2/Divisi/DialogForm.js
Unescape View File

@ -6,12 +6,16 @@ import {
import { Select } from 'antd';
import 'antd/dist/antd.css';
import { useTranslation } from 'react-i18next';
import InputColor from "./InputColor";
import "./styles.css";
import "rc-color-picker/assets/index.css";
const { Option } = Select
const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdit, dataDivisions }) => {
const [id, setId] = useState(0)
const [name, setName] = useState('')
const [parent, setParent] = useState(null)
const [description, setDescription] = useState('')
const [color, setColor] = useState('')
const { t } = useTranslation()
const onChangeParent = (val) => {
@ -24,8 +28,10 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi
setDescription(dataEdit.description)
setName(dataEdit.name)
setParent(dataEdit.parent)
setColor(dataEdit.color)
} else {
setId(0)
setColor('')
}
}, [dataEdit, openDialog])
@ -42,23 +48,27 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi
if (!err) {
if (typeDialog === "Save") {
data = {
name: name,
name,
description,
parent
parent,
color
}
closeDialog('save', data);
} else {
data = {
id,
name: name,
name,
description,
parent
parent,
color
}
closeDialog('edit', data);
}
setId(0)
setDescription('')
setName('')
setParent(null)
setColor('')
}
}
const handleCancel = () => {
@ -66,6 +76,7 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi
setId(0)
setDescription('')
setName('')
setParent(null)
}
const renderForm = () => {
@ -90,7 +101,7 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">{t('nameDivision')}</Label>
<Label className="capitalize">{t('Parent Division')}</Label>
<Select showSearch
value={parent}
onChange={onChangeParent}
@ -112,6 +123,14 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi
</FormGroup>
</Col>
</Row>
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">{t('color')}</Label>
<InputColor value={color} color={color} onChange={(e) => setColor(e.color)} />
</FormGroup>
</Col>
</Row>
</Form>
)
}

46
src/views/SimproV2/Divisi/InputColor.js
Unescape View File

@ -0,0 +1,46 @@
import React from "react";
import Input from "antd/lib/input";
import Button from "antd/lib/button";
import Dropdown from "antd/lib/dropdown";
import { Panel } from 'rc-color-picker'
import "antd/dist/antd.css";
import "./styles.css";
export default function InputColor(props) {
const { color, onChange } = props;
const [internalColor, setInternalColor] = React.useState(color);
const handleChange = (color) => {
setInternalColor(color.color);
if (onChange) {
onChange(color);
}
};
const overlay = (
<div>
<Panel
color={internalColor}
enableAlpha={false}
onChange={handleChange}
/>
</div>
);
return (
<>
<Input
value={internalColor || ""}
onChange={(e) => setInternalColor(e.target.value)}
suffix={
<Dropdown trigger={["click"]} overlay={overlay}>
<Button style={{ background: internalColor }}> </Button>
</Dropdown>
}
/>
</>
);
}

21
src/views/SimproV2/Divisi/index.js
Unescape View File

@ -25,6 +25,7 @@ const config = {
const column = [
{ name: "Nama" },
{ name: "Deskripsi" },
{ name: "Color" },
]
const ProjectType = ({ params }) => {
@ -72,8 +73,10 @@ const ProjectType = ({ params }) => {
if (listDivions && listDivions.data && listDivions.data.code == 200) {
let arr = []
for (const v in listDivions.data.data) {
arr.push(listDivions.data.data[v])
let dataRes = listDivions.data.data;
const filteredData = dataRes.filter(item => item.parent === null);
for (const v in filteredData) {
arr.push(filteredData[v])
}
setDataDivisions(arr);
} else {
@ -97,7 +100,7 @@ const ProjectType = ({ params }) => {
"orders": {
"ascending": true,
"columns": [
'id'
'name'
]
},
"paging": {
@ -184,6 +187,7 @@ const ProjectType = ({ params }) => {
const handleOpenDialog = (type) => {
setOpenDialog(true)
getListDivision();
setTypeDialog(type)
}
@ -348,7 +352,16 @@ const ProjectType = ({ params }) => {
</Tooltip>
</td>
<td>{n.name}</td>
<td>{n.description}</td>
<td>{n.description ?? '-'}</td>
{n.color != null ? (
<td>
<Tooltip title={n.color}>
<span className="fa fa-square" style={{ color: n.color }}></span>
</Tooltip>
</td>
): (
<td><small style={{ color:"grey",fontStyle:"italic" }}>No color set</small></td>
)}
</tr>
)
})}

41
src/views/SimproV2/Divisi/styles.css
Unescape View File

@ -0,0 +1,41 @@
.App {
font-family: sans-serif;
padding: 20px;
}
h2 {
margin-top: 40px;
}
.rc-color-picker-panel {
border: 1px solid #ccc;
}
.rc-color-picker-panel-inner {
border: none;
box-shadow: none;
}
.rc-color-picker-panel-board-hsv {
border-radius: 12px;
outline: none;
}
.rc-color-picker-panel-board-value {
border: none;
border-radius: 12px;
}
.rc-color-picker-panel-board-saturation {
border: none;
border-radius: 12px;
}
.rc-color-picker-panel-ribbon {
border-radius: 12px;
}
.rc-color-picker-panel-wrap-preview {
border-radius: 12px;
}
.rc-color-picker-panel-preview span {
border-radius: 12px;
}
.rc-color-picker-panel-preview input {
border-radius: 12px;
}
Write Preview
Loading…
Cancel
Save