AiraBilqis
9 months ago
2 changed files with 103 additions and 104 deletions
@ -1,96 +1,96 @@ |
|||||||
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 { DOCUMENT_ADD, FOLDER_DOCUMENT_PROYEK_ADD } from '../../../const/ApiConst'; |
import { FOLDER_DOCUMENT_PROYEK_ADD } from '../../../const/ApiConst'; |
||||||
import 'antd/dist/antd.css'; |
import 'antd/dist/antd.css'; |
||||||
import { NotificationManager } from 'react-notifications'; |
import { NotificationManager } from 'react-notifications'; |
||||||
|
|
||||||
const DialogRequestFolder = ({ openDialog, closeDialog, toggleDialog, idTask, parentIdNewFolder }) => { |
const DialogRequestFolder = ({ openDialog, closeDialog, toggleDialog, idTask, parentIdNewFolder }) => { |
||||||
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 [folderName, setFolderName] = useState('') |
const [folderName, setFolderName] = useState('') |
||||||
|
|
||||||
|
|
||||||
const handleClearData = () => { |
const handleClearData = () => { |
||||||
setId(0) |
setId(0) |
||||||
setFolderName('') |
setFolderName('') |
||||||
} |
} |
||||||
|
|
||||||
useEffect(() => { |
useEffect(() => { |
||||||
handleClearData() |
handleClearData() |
||||||
}, [openDialog]) |
}, [openDialog]) |
||||||
|
|
||||||
const handleSave = () => { |
const handleSave = () => { |
||||||
saveFolder() |
saveFolder() |
||||||
handleClearData() |
handleClearData() |
||||||
} |
} |
||||||
|
|
||||||
const saveFolder = async () => { |
const saveFolder = async () => { |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
let payload = { |
let payload = { |
||||||
"proyek_id": idTask, |
"proyek_id": idTask, |
||||||
"name_folder": folderName |
"name_folder": folderName |
||||||
} |
} |
||||||
|
|
||||||
if (parentIdNewFolder > 0) { |
if (parentIdNewFolder > 0) { |
||||||
payload.parent_id = parentIdNewFolder |
payload.parent_id = parentIdNewFolder |
||||||
} |
} |
||||||
|
|
||||||
const result = await axios |
const result = await axios |
||||||
.post(FOLDER_DOCUMENT_PROYEK_ADD, payload, HEADER) |
.post(FOLDER_DOCUMENT_PROYEK_ADD, payload, HEADER) |
||||||
.then(res => res) |
.then(res => res) |
||||||
.catch((error) => error.response); |
.catch((error) => error.response); |
||||||
|
|
||||||
if (result && result.data && result.data.code == 200) { |
if (result && result.data && result.data.code == 200) { |
||||||
NotificationManager.success('Success create folder!!', 'Success'); |
NotificationManager.success('Success create folder!!', 'Success'); |
||||||
closeDialog("upload"); |
closeDialog("upload"); |
||||||
} else { |
} else { |
||||||
NotificationManager.error('Failed to create folder!!', 'Failed'); |
NotificationManager.error('Failed to create folder!!', 'Failed'); |
||||||
} |
} |
||||||
} |
} |
||||||
|
|
||||||
const handleCancel = () => { |
const handleCancel = () => { |
||||||
closeDialog('cancel') |
closeDialog('cancel') |
||||||
handleClearData() |
handleClearData() |
||||||
} |
} |
||||||
|
|
||||||
const renderForm = () => { |
const renderForm = () => { |
||||||
return ( |
return ( |
||||||
<Form> |
<Form> |
||||||
<FormGroup> |
<FormGroup> |
||||||
<Label className="capitalize">Folder Name</Label> |
<Label className="capitalize">Folder Name</Label> |
||||||
<Input type="text" onChange={(e) => setFolderName(e.target.value)} /> |
<Input type="text" onChange={(e) => setFolderName(e.target.value)} /> |
||||||
</FormGroup> |
</FormGroup> |
||||||
</Form> |
</Form> |
||||||
) |
) |
||||||
} |
} |
||||||
|
|
||||||
|
|
||||||
return ( |
return ( |
||||||
<> |
<> |
||||||
<Modal isOpen={openDialog} toggle={toggleDialog}> |
<Modal isOpen={openDialog} toggle={toggleDialog}> |
||||||
<ModalHeader className="capitalize" toggle={closeDialog}>Create New Folder</ModalHeader> |
<ModalHeader className="capitalize" toggle={closeDialog}>Create New Folder</ModalHeader> |
||||||
<ModalBody> |
<ModalBody> |
||||||
{renderForm()} |
{renderForm()} |
||||||
</ModalBody> |
</ModalBody> |
||||||
<ModalFooter> |
<ModalFooter> |
||||||
<Button color="primary" onClick={() => handleSave()}>Save</Button>{' '} |
<Button color="primary" onClick={() => handleSave()}>Save</Button>{' '} |
||||||
<Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Cancel</Button> |
<Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Cancel</Button> |
||||||
</ModalFooter> |
</ModalFooter> |
||||||
</Modal> |
</Modal> |
||||||
</> |
</> |
||||||
) |
) |
||||||
|
|
||||||
} |
} |
||||||
|
|
||||||
export default DialogRequestFolder; |
export default DialogRequestFolder; |
||||||
|
Loading…
Reference in new issue