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

add form edit

pull/2/head
wahyuun 1 year ago
parent
4618751b15
commit
9e869fc772
1 changed files with 174 additions and 123 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 297
      src/views/SimproV2/CreatedProyek/DialogFormGantt.js

297
src/views/SimproV2/CreatedProyek/DialogFormGantt.js
Unescape View File

@ -1,123 +1,174 @@
import React, { useEffect, useState } from 'react' import React, { useEffect, useState } from 'react'
import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap'; import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
import { Button, Form, FormGroup, Label, Input, Col, Row } from 'reactstrap'; import { Button, Form, FormGroup, Label, Input, Col, Row } from 'reactstrap';
import axios from "../../../const/interceptorApi"; import axios from "../../../const/interceptorApi";
import { VERSION_GANTT_ADD } from '../../../const/ApiConst'; import { VERSION_GANTT_ADD, VERSION_GANTT_EDIT } from '../../../const/ApiConst';
import { Select } from 'antd'; import { Select } from 'antd';
import 'antd/dist/antd.css'; import 'antd/dist/antd.css';
const DialogFormGantt = ({ openDialog, closeDialog, toggleDialog, idTask, parentId }) => { const DialogFormGantt = ({ openDialog, closeDialog, toggleDialog, idTask, parentId, dataEdit, typeDialog}) => {
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 [id, setId] = useState(0) const [id, setId] = useState(0)
const [name, setName] = useState("") const [name, setName] = useState("")
const [description, setDesctription] = useState("") const [description, setDesctription] = useState("")
const [calculationType, setCalculationType] = useState("detail") const [calculationType, setCalculationType] = useState("detail")
const handleCLearData = () => { const handleCLearData = () => {
setId(0) setId(0)
setName("") setName("")
setDesctription("") setDesctription("")
} }
const validation = () => {
useEffect(() => { if (!name || name === "") {
handleCLearData() alert("Gantt Name cannot be empty!");
}, [openDialog]) return true;
}
const handleSave = () => { }
saveVersionGantt() useEffect(() => {
handleCLearData() if(typeDialog === "Edit")
} {
setId(dataEdit.id);
const saveVersionGantt = async () => { setName(dataEdit.name_version);
setDesctription(dataEdit.description);
const formData = { setCalculationType(dataEdit.calculation_type);
name_version: name, } else {
description, handleCLearData()
calculation_type: calculationType, }
proyek_id: idTask,
hierarchy_ftth_id: parentId }, [dataEdit, openDialog])
} const handleSave = () => {
const result = await axios let data = '';
.post(VERSION_GANTT_ADD, formData, HEADER) const err = validation();
.then(res => res) if (!err) {
.catch((error) => error.response); if (typeDialog === "Edit") {
data = {
if (result && result.status == 200) { id,
closeDialog('success') name,
} else { description,
closeDialog('failed') calculationType
} };
} editVersionGantt(data)
} else {
const handleCancel = () => { saveVersionGantt()
closeDialog('cancel') }
handleCLearData() handleCLearData()
} }
}
const renderForm = () => {
return ( const saveVersionGantt = async () => {
<Form>
<FormGroup> const formData = {
<Label className="capitalize">Nama <span style={{ color: "red" }}>*</span> </Label> name_version: name,
<Input type="text" value={name} onChange={(e) => setName(e.target.value)} placeholder='' /> description,
</FormGroup> calculation_type: calculationType,
<FormGroup> proyek_id: idTask,
<Label className="capitalize">Deskripsi </Label> hierarchy_ftth_id: parentId
<Input type="textarea" value={description} onChange={(e) => setDesctription(e.target.value)} placeholder='' />
</FormGroup> }
<FormGroup> const result = await axios
<Label className="capitalize">Tipe Kalkulasi </Label> .post(VERSION_GANTT_ADD, formData, HEADER)
<div> .then(res => res)
<Select .catch((error) => error.response);
defaultValue="detail"
style={{ if (result && result.status == 200) {
width: 120, closeDialog('Save')
}} } else {
onChange={(v) => setCalculationType(v)} closeDialog('failed')
options={[ }
{ }
value: 'detail',
label: 'Detail', const editVersionGantt = async (data) => {
},
{ const formData = {
value: 'simple', name_version: data.name,
label: 'Simple', description:data.description,
}, calculation_type: data.calculationType,
]} proyek_id: idTask,
/> hierarchy_ftth_id: parentId
</div>
</FormGroup> }
<FormGroup> const url = VERSION_GANTT_EDIT(data.id);
<div> const result = await axios.put(url, formData, HEADER)
Notes: .then(res => res)
</div> .catch((error) => error.response);
<span style={{ color: "red" }}>*</span> Wajib diisi
</FormGroup> if (result && result.status == 200) {
</Form> closeDialog('Edit')
) } else {
} closeDialog('failed')
}
return ( }
<>
<Modal isOpen={openDialog} toggle={toggleDialog}> const handleCancel = () => {
<ModalHeader className="capitalize" toggle={closeDialog}>Add Gantt Project</ModalHeader> closeDialog('cancel')
<ModalBody> handleCLearData()
{renderForm()} }
</ModalBody>
<ModalFooter> const renderForm = () => {
<Button color="primary" onClick={() => handleSave()}>Save</Button>{' '} return (
<Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Cancel</Button> <Form>
</ModalFooter> <FormGroup>
</Modal> <Label className="capitalize">Nama <span style={{ color: "red" }}>*</span> </Label>
</> <Input type="text" value={name} onChange={(e) => setName(e.target.value)}/>
) </FormGroup>
<FormGroup>
} <Label className="capitalize">Deskripsi </Label>
<Input type="textarea" value={description} onChange={(e) => setDesctription(e.target.value)}/>
export default DialogFormGantt; </FormGroup>
<FormGroup>
<Label className="capitalize">Tipe Kalkulasi </Label>
<div>
<Select
value={calculationType}
defaultValue={calculationType}
style={{
width: 120,
}}
onChange={(v) => setCalculationType(v)}
options={[
{
value: 'detail',
label: 'Detail',
},
{
value: 'simple',
label: 'Simple',
},
]}
/>
</div>
</FormGroup>
<FormGroup>
<div>
Notes:
</div>
<span style={{ color: "red" }}>*</span> Wajib diisi
</FormGroup>
</Form>
)
}
return (
<>
<Modal isOpen={openDialog} toggle={toggleDialog}>
<ModalHeader className="capitalize" toggle={closeDialog}>{typeDialog == "Edit" ? "Edit" :"Tambah"} Gantt Project</ModalHeader>
<ModalBody>
{renderForm()}
</ModalBody>
<ModalFooter>
<Button color="primary" onClick={() => handleSave()}>{typeDialog == "Edit" ? "Update" :"Save"}</Button>{' '}
<Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Cancel</Button>
</ModalFooter>
</Modal>
</>
)
}
export default DialogFormGantt;

Write Preview
Loading…
Cancel
Save