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

add divisi project field

pull/2/head
Muhammad Sulaiman Yusuf 2 years ago
parent
489daebc59
commit
2395642628
3 changed files with 1634 additions and 1636 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. 592
      src/views/SimproV2/CreatedProyek/DialogForm.js
  2. 30
      src/views/SimproV2/CreatedProyek/DialogFormProyek.js
  3. 2648
      src/views/SimproV2/CreatedProyek/index.js

592
src/views/SimproV2/CreatedProyek/DialogForm.js
Unescape View File

@ -2,330 +2,324 @@ import React, { useEffect, useState } from "react";
import { Modal, ModalHeader, ModalBody, ModalFooter } from "reactstrap";
import { Button, Form, FormGroup, Label, Input, Col, Row } from "reactstrap";
import { DatePicker, Tooltip, Select } from "antd";
// import { Language } from 'src/const/LanguageConst';
import axios from "../../../const/interceptorApi";
import moment from "moment";
import {
NotificationContainer,
NotificationManager,
NotificationContainer,
NotificationManager,
} from "react-notifications";
import "antd/dist/antd.css";
import { formatNumber } from "../../../const/CustomFunc";
import {
TYPE_PROYEK,
USER_LIST,
BASE_SIMPRO_LUMEN,
TYPE_PROYEK,
USER_LIST,
BASE_SIMPRO_LUMEN,
} from "../../../const/ApiConst";
const { Option } = Select;
// import DialogMap from './DialogMap';
const DialogForm = ({
openDialog,
closeDialog,
toggleDialog,
idTask,
dataTypeProyek,
dataPM,
openDialog,
closeDialog,
toggleDialog,
idTask,
dataTypeProyek,
dataPM,
}) => {
const token = localStorage.getItem("token");
const HEADER = {
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${token}`,
},
};
const [id, setId] = useState(0);
const [name, setName] = useState("");
const [shortName, setShortName] = useState("");
const [description, setDescription] = useState("");
const [biaya, setBiaya] = useState("");
const [typeProject, setTypeproject] = useState(null);
const [sdm, setSdm] = useState(0);
const [pic, setPic] = useState(null);
const [startDate, setStartDate] = useState(moment());
const [endDate, setEndDate] = useState(moment());
const [workArea, setWorkArea] = useState("");
const [finance, setFinance] = useState("");
const [investor, setInvestor] = useState("");
const [company, setCompany] = useState("");
const token = localStorage.getItem("token");
const HEADER = {
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${token}`,
},
};
const [id, setId] = useState(0);
const [name, setName] = useState("");
const [shortName, setShortName] = useState("");
const [description, setDescription] = useState("");
const [biaya, setBiaya] = useState("");
const [typeProject, setTypeproject] = useState(null);
const [sdm, setSdm] = useState(0);
const [pic, setPic] = useState(null);
const [startDate, setStartDate] = useState(moment());
const [endDate, setEndDate] = useState(moment());
const [workArea, setWorkArea] = useState("");
const [finance, setFinance] = useState("");
const [investor, setInvestor] = useState("");
const [company, setCompany] = useState("");
const handleGetdataIdproyek = async (id) => {
const URL = `${BASE_SIMPRO_LUMEN}/project/edit/${id}`;
const result = await axios
.get(URL, HEADER)
.then((res) => res)
.catch((err) => err.response);
console.log("proyek by id", result);
if (result && result.data && result.data.code === 200) {
const val = result.data.data;
setName(val.nama);
setShortName(val.kode_sortname);
setDescription(val.keterangan);
setBiaya(val.rencana_biaya ? formatNumber(val.rencana_biaya) : "");
setTypeproject(val.type_proyek_id);
setPic(val.pm_id);
setStartDate(moment(val.mulai_proyek));
setEndDate(moment(val.akhir_proyek));
setWorkArea(val.area_kerja);
setInvestor(val.investor);
setCompany(val.company);
setFinance(val.finance);
} else {
NotificationManager.error(`Data proyek gagal di edit`, `Failed!!`);
}
};
const handleGetdataIdproyek = async (id) => {
const URL = `${BASE_SIMPRO_LUMEN}/project/edit/${id}`;
const result = await axios
.get(URL, HEADER)
.then((res) => res)
.catch((err) => err.response);
if (result && result.data && result.data.code === 200) {
const val = result.data.data;
setName(val.nama);
setShortName(val.kode_sortname);
setDescription(val.keterangan);
setBiaya(val.rencana_biaya ? formatNumber(val.rencana_biaya) : "");
setTypeproject(val.type_proyek_id);
setPic(val.pm_id);
setStartDate(moment(val.mulai_proyek));
setEndDate(moment(val.akhir_proyek));
setWorkArea(val.area_kerja);
setInvestor(val.investor);
setCompany(val.company);
setFinance(val.finance);
} else {
NotificationManager.error(`Data proyek gagal di edit`, `Failed!!`);
}
};
const handleCLearData = () => {
setName("");
setShortName("");
setBiaya("");
setTypeproject(null);
setPic(null);
setStartDate(moment());
setEndDate(moment());
setDescription("");
setInvestor("");
setFinance("");
setWorkArea("");
setCompany("");
};
const handleCLearData = () => {
setName("");
setShortName("");
setBiaya("");
setTypeproject(null);
setPic(null);
setStartDate(moment());
setEndDate(moment());
setDescription("");
setInvestor("");
setFinance("");
setWorkArea("");
setCompany("");
};
useEffect(() => {
if (idTask && idTask > 0) {
console.log("cel data Edit");
handleGetdataIdproyek(idTask);
} else {
handleCLearData();
}
}, [openDialog]);
useEffect(() => {
if (idTask && idTask > 0) {
handleGetdataIdproyek(idTask);
} else {
handleCLearData();
}
}, [openDialog]);
const handleSave = () => {
let data = "";
if (idTask) {
data = {
id: idTask,
nama: name,
kode_sortname: shortName,
rencana_biaya: biaya.replace(".", ""),
mulai_proyek: startDate,
akhir_proyek: endDate,
type_proyek_id: parseInt(typeProject),
pm_id: pic,
investor,
finance,
company,
area_kerja: workArea,
keterangan: description,
};
const handleSave = () => {
let data = "";
if (idTask) {
data = {
id: idTask,
nama: name,
kode_sortname: shortName,
rencana_biaya: biaya.replace(".", ""),
mulai_proyek: startDate,
akhir_proyek: endDate,
type_proyek_id: parseInt(typeProject),
pm_id: pic,
investor,
finance,
company,
area_kerja: workArea,
keterangan: description,
};
closeDialog("edit", data);
} else {
data = {
nama: name,
kode_sortname: shortName,
rencana_biaya: biaya.replace(".", ""),
mulai_proyek: startDate,
akhir_proyek: endDate,
type_proyek_id: parseInt(typeProject),
pm_id: pic,
investor,
finance,
company,
area_kerja: workArea,
keterangan: description,
};
console.log(data);
closeDialog("add", data);
}
handleCLearData();
};
closeDialog("edit", data);
} else {
data = {
nama: name,
kode_sortname: shortName,
rencana_biaya: biaya.replace(".", ""),
mulai_proyek: startDate,
akhir_proyek: endDate,
type_proyek_id: parseInt(typeProject),
pm_id: pic,
investor,
finance,
company,
area_kerja: workArea,
keterangan: description,
};
closeDialog("add", data);
}
handleCLearData();
};
const handleCancel = () => {
closeDialog("cancel", "none");
handleCLearData();
};
const handleCancel = () => {
closeDialog("cancel", "none");
handleCLearData();
};
const onChangeTypeProject = (val) => {
setTypeproject(val);
};
const onChangeTypeProject = (val) => {
setTypeproject(val);
};
const onChangePm = (val) => {
console.log("chnage pm", val);
setPic(val);
};
const onChangePm = (val) => {
setPic(val);
};
const handleDatePickerStart = (date, dateString) => {
setStartDate(date);
};
const handleDatePickerStart = (date, dateString) => {
setStartDate(date);
};
const handleDatePickerEnd = (date, dateString) => {
setEndDate(date);
};
const handleDatePickerEnd = (date, dateString) => {
setEndDate(date);
};
const renderForm = () => {
return (
<Form>
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Project Name</Label>
<Input
type="text"
value={name}
onChange={(e) => setName(e.target.value)}
placeholder={`Input project name...`}
/>
</FormGroup>
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Code / Short Name</Label>
<Input
type="text"
value={shortName}
onChange={(e) => setShortName(e.target.value)}
placeholder={`Input code / short name...`}
/>
</FormGroup>
</Col>
</Row>
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Project Type</Label>
<Select
showSearch
value={typeProject}
defaultValue={typeProject}
onChange={onChangeTypeProject}
placeholder="Select project type"
style={{ width: "100%" }}
>
{dataTypeProyek.map((res) => (
<Option key={res.id} value={res.id}>
{res.name}
</Option>
))}
</Select>
</FormGroup>
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">PM</Label>
<Select
showSearch
value={pic}
defaultValue={pic}
onChange={onChangePm}
placeholder="Select PM"
style={{ width: "100%" }}
>
{dataPM.map((res) => (
<Option key={res.id} value={res.id}>
{res.name}
</Option>
))}
</Select>
</FormGroup>
</Col>
</Row>
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Start Date</Label>
<DatePicker
style={{ width: "100%" }}
value={startDate}
onChange={handleDatePickerStart}
/>
</FormGroup>
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">End Date</Label>
<DatePicker
style={{ width: "100%" }}
value={endDate}
onChange={handleDatePickerEnd}
/>
</FormGroup>
</Col>
</Row>
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Work Area</Label>
<Input
type="text"
value={workArea}
onChange={(e) => setWorkArea(e.target.value)}
placeholder={`Input work area...`}
/>
</FormGroup>
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Company</Label>
<Input
type="text"
value={company}
onChange={(e) => setCompany(e.target.value)}
placeholder={`Input company...`}
/>
</FormGroup>
</Col>
</Row>
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Budget</Label>
<Input
type="text"
value={biaya}
onChange={(e) => setBiaya(formatNumber(e.target.value))}
placeholder={`Input planning cost...`}
/>
</FormGroup>
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Description</Label>
<Input
type="textarea"
value={description}
onChange={(e) => setDescription(e.target.value)}
placeholder={`Input description...`}
/>
</FormGroup>
</Col>
</Row>
</Form>
);
};
const renderForm = () => {
return (
<Form>
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Project Name</Label>
<Input
type="text"
value={name}
onChange={(e) => setName(e.target.value)}
placeholder={`Input project name...`}
/>
</FormGroup>
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Code / Short Name</Label>
<Input
type="text"
value={shortName}
onChange={(e) => setShortName(e.target.value)}
placeholder={`Input code / short name...`}
/>
</FormGroup>
</Col>
</Row>
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Project Type</Label>
<Select
showSearch
value={typeProject}
defaultValue={typeProject}
onChange={onChangeTypeProject}
placeholder="Select project type"
style={{ width: "100%" }}
>
{dataTypeProyek.map((res) => (
<Option key={res.id} value={res.id}>
{res.name}
</Option>
))}
</Select>
</FormGroup>
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">PM</Label>
<Select
showSearch
value={pic}
defaultValue={pic}
onChange={onChangePm}
placeholder="Select PM"
style={{ width: "100%" }}
>
{dataPM.map((res) => (
<Option key={res.id} value={res.id}>
{res.name}
</Option>
))}
</Select>
</FormGroup>
</Col>
</Row>
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Start Date</Label>
<DatePicker
style={{ width: "100%" }}
value={startDate}
onChange={handleDatePickerStart}
/>
</FormGroup>
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">End Date</Label>
<DatePicker
style={{ width: "100%" }}
value={endDate}
onChange={handleDatePickerEnd}
/>
</FormGroup>
</Col>
</Row>
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Work Area</Label>
<Input
type="text"
value={workArea}
onChange={(e) => setWorkArea(e.target.value)}
placeholder={`Input work area...`}
/>
</FormGroup>
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Company</Label>
<Input
type="text"
value={company}
onChange={(e) => setCompany(e.target.value)}
placeholder={`Input company...`}
/>
</FormGroup>
</Col>
</Row>
<Row>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Budget</Label>
<Input
type="text"
value={biaya}
onChange={(e) => setBiaya(formatNumber(e.target.value))}
placeholder={`Input planning cost...`}
/>
</FormGroup>
</Col>
<Col md={6}>
<FormGroup>
<Label className="capitalize">Description</Label>
<Input
type="textarea"
value={description}
onChange={(e) => setDescription(e.target.value)}
placeholder={`Input description...`}
/>
</FormGroup>
</Col>
</Row>
</Form>
);
};
return (
<>
<Modal size="lg" isOpen={openDialog} toggle={toggleDialog}>
<ModalHeader className="capitalize" toggle={closeDialog}>
{idTask ? `Update` : "Add"} Project
</ModalHeader>
<ModalBody>{renderForm()}</ModalBody>
<ModalFooter>
<Button color="primary" onClick={() => handleSave()}>
{idTask ? `Save` : "Add"}
</Button>{" "}
<Button
className="capitalize"
color="secondary"
onClick={() => handleCancel()}
>
Cancel
</Button>
</ModalFooter>
</Modal>
</>
);
return (
<>
<Modal size="lg" isOpen={openDialog} toggle={toggleDialog}>
<ModalHeader className="capitalize" toggle={closeDialog}>
{idTask ? `Update` : "Add"} Project
</ModalHeader>
<ModalBody>{renderForm()}</ModalBody>
<ModalFooter>
<Button color="primary" onClick={() => handleSave()}>
{idTask ? `Save` : "Add"}
</Button>{" "}
<Button
className="capitalize"
color="secondary"
onClick={() => handleCancel()}
>
Cancel
</Button>
</ModalFooter>
</Modal>
</>
);
};
export default DialogForm;

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

@ -27,6 +27,7 @@ const DialogFormProyek = ({
idTask,
dataTypeProyek,
dataPhaseProject,
dataDivisions,
dataPM,
}) => {
const token = localStorage.getItem("token");
@ -43,6 +44,7 @@ const DialogFormProyek = ({
const [biaya, setBiaya] = useState("");
const [typeProject, setTypeproject] = useState(null);
const [phaseProject, setPhaseProject] = useState(null);
const [divisiProject, setDivisiProject] = useState(null);
const [budgetHealth, setHealthBudget] = useState(null);
const [sdm, setSdm] = useState(0);
const [pic, setPic] = useState(null);
@ -84,6 +86,7 @@ const DialogFormProyek = ({
setBiaya(val.rencana_biaya ? formatNumber(val.rencana_biaya) : "");
setTypeproject(val.type_proyek_id);
setPhaseProject(val.phase_id);
setDivisiProject(val.divisi_id);
setHealthBudget(val.budget_health);
setPic(val.pm_id);
setStartDate(moment(val.mulai_proyek));
@ -198,6 +201,7 @@ const DialogFormProyek = ({
akhir_proyek: endDate,
type_proyek_id: parseInt(typeProject),
phase_id: parseInt(phaseProject),
divisi_id: parseInt(divisiProject),
budget_health: budgetHealth,
pm_id: pic,
investor,
@ -224,6 +228,7 @@ const DialogFormProyek = ({
akhir_proyek: endDate,
type_proyek_id: parseInt(typeProject),
phase_id: parseInt(phaseProject),
divisi_id: parseInt(divisiProject),
health_budget: budgetHealth,
pm_id: pic,
investor,
@ -258,6 +263,10 @@ const DialogFormProyek = ({
setPhaseProject(val);
};
const onChangeDivisiProject = (val) => {
setDivisiProject(val);
};
const onChangeBudgetHealth = (val) => {
setHealthBudget(val);
};
@ -590,6 +599,25 @@ const DialogFormProyek = ({
</FormGroup>
</Col>
</Row>
<Row>
<Col md={6}>
<FormGroup>
<Label>Handled By Division</Label>
<Select
value={divisiProject}
defaultValue={divisiProject}
onChange={onChangeDivisiProject}
style={{ width: "100%" }}
>
{dataDivisions.map((res) => (
<Option key={res.id} value={res.id}>
{res.displayName}
</Option>
))}
</Select>
</FormGroup>
</Col>
</Row>
<Divider orientation="left" plain>
Info Dashboard
</Divider>
@ -598,7 +626,6 @@ const DialogFormProyek = ({
<FormGroup>
<Label>Phase</Label>
<Select
showSearch
value={phaseProject}
defaultValue={phaseProject}
onChange={onChangePhaseProject}
@ -616,7 +643,6 @@ const DialogFormProyek = ({
<FormGroup>
<Label>Cost Health</Label>
<Select
showSearch
value={budgetHealth}
defaultValue={budgetHealth}
onChange={onChangeBudgetHealth}

2648
src/views/SimproV2/CreatedProyek/index.js
View File

File diff suppressed because it is too large Load Diff
Write Preview
Loading…
Cancel
Save