Commit e97ee85e authored by Deni Rinaldi's avatar Deni Rinaldi

+++

parent e552be16
...@@ -173,6 +173,10 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') => ...@@ -173,6 +173,10 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') =>
// UPLOAD FOTO // UPLOAD FOTO
const uploadFoto = (body) => api.post('attachment/upload_foto', body) const uploadFoto = (body) => api.post('attachment/upload_foto', body)
// MANAGEMENT DOCUMENT
const getDocumentCategory = () => api.get('document_category/get_all_document_category')
const getAllDocument = (body) => api.post('document/get_all_document', body)
// ------ // ------
// STEP 3 // STEP 3
// ------ // ------
...@@ -275,7 +279,9 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') => ...@@ -275,7 +279,9 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') =>
deleteUnitBisnis, deleteUnitBisnis,
deleteParameter, deleteParameter,
deletePerusahaan, deletePerusahaan,
deleteReportItems deleteReportItems,
getDocumentCategory,
getAllDocument
} }
} }
......
import React, { Component } from 'react'
import MUIDataTable from 'mui-datatables'
import { createMuiTheme, MuiThemeProvider } from '@material-ui/core';
import api from '../../api';
var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable());
const options = ct.customOptionsManagementDocument();
export default class AuditTahunan extends Component {
constructor(props) {
super(props)
this.state = {
dataTable: []
}
}
componentDidMount() {
console.log(this.props.data)
this.getData()
}
getData() {
let payload = {
"company_id": 1,
"document_category_id": 1
}
api.create().getAllDocument(payload).then(respone => {
let dataTable = respone.data.data.map(item => {
return [
item.document_name,
item.description,
item.company_name,
"",
item.document_type,
String(Number(item.document_size) / 1000 + ' MB'),
item.created_by,
item.created_at,
]
})
this.setState({ dataTable })
})
}
render() {
let columns = [
"Nama File", "Keterangan", "Perusahaan", "Periode", "Tipe", "Ukuran", "Ditambahkan Oleh", "Ditambahkan Tanggal"
]
return (
<div style={{ width: '100%' }}>
<div style={{ display: 'grid', justifyContent: 'flex-end' }}>
<button
type="button"
onClick={() => null}
style={{ marginRight: 25 }}
>
<div style={{ width: 150, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<span style={{ color: '#fff', fontSize: 11 }}>Add</span>
</div>
</button>
</div>
<div style={{ padding: 25 }}>
<MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
theme={getMuiTheme()}
data={this.state.dataTable}
columns={columns}
options={options}
/>
</MuiThemeProvider>
</div>
</div>
)
}
}
import React, {useEffect} from 'react';
import PropTypes from 'prop-types';
import { makeStyles } from '@material-ui/core/styles';
import Tabs from '@material-ui/core/Tabs';
import Tab from '@material-ui/core/Tab';
import Typography from '@material-ui/core/Typography';
import Box from '@material-ui/core/Box';
import ReactTooltip from 'react-tooltip';
import Images from '../../assets/Images';
import { Paper } from '@material-ui/core';
import ManualBookTia from './ManualBookTia';
import api from '../../api';
function TabPanel(props) {
const { children, value, index, ...other } = props;
return (
<div
role="tabpanel"
hidden={value !== index}
id={`vertical-tabpanel-${index}`}
aria-labelledby={`vertical-tab-${index}`}
{...other}
>
{value === index && (
<Box p={3}>
<Typography>{children}</Typography>
</Box>
)}
</div>
);
}
TabPanel.propTypes = {
children: PropTypes.node,
index: PropTypes.any.isRequired,
value: PropTypes.any.isRequired,
};
function a11yProps(index) {
return {
id: `vertical-tab-${index}`,
'aria-controls': `vertical-tabpanel-${index}`,
};
}
const useStyles = makeStyles((theme) => ({
root: {
display: 'flex',
// height: 244,
},
tabs: {
borderRight: `1px solid ${theme.palette.divider}`,
},
}));
export default function DocumentManagement() {
const classes = useStyles();
const [value, setValue] = React.useState(0);
const [listData, setListData] = React.useState([])
const handleChange = (event, newValue) => {
setValue(newValue);
};
useEffect(() => {
getDataDocument()
})
const getDataDocument = () => {
api.create().getDocumentCategory().then(response => {
let data = response.data.data
setListData(data)
})
}
return (
<div style={{ flex: 1 }}>
<div className={"main-color"} style={{ height: 78, display: 'flex', alignItems: 'center', paddingLeft: 20 }}>
<Typography style={{ fontSize: '16px', color: 'white' }}>Document Management</Typography>
</div>
<Paper style={{ padding: 20 }}>
<div style={{ display: 'grid', justifyContent: 'flex-end' }}>
<a data-tip={'Add New'} data-for="create">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
margin: 5,
marginRight: 20
}}
onClick={() => null}
>
<img src={Images.add} />
</button>
</a>
<ReactTooltip border={true} id="create" place="bottom" type="light" effect="solid" />
</div>
<div className={classes.root}>
<Tabs
orientation="vertical"
variant="scrollable"
value={value}
onChange={handleChange}
aria-label="Vertical tabs example"
className={classes.tabs}
>
{listData.map((item, index) => {
return (
<Tab label={item.document_category_name} {...a11yProps(index)} />
)
})}
</Tabs>
{listData.map((item, index) => {
return (
<TabPanel value={value} index={index} style={{ width: '100%'}}>
{index === 0 ?
<ManualBookTia /> :
<span>Test</span>
}
</TabPanel>
)
})}
</div>
</Paper>
</div>
);
}
\ No newline at end of file
import React, { Component } from 'react'
import { Tabs, Tab, Typography, Paper } from '@material-ui/core'
import ReactTooltip from 'react-tooltip'
import Images from '../../assets/Images'
import ManualBookTia from './ManualBookTia'
import api from '../../api'
import AuditTahunan from './AuditTahunan'
export default class DocumentManagement extends Component {
constructor(props) {
super(props)
this.state = {
tab: 0,
listData: [],
id: 0
}
}
selectTab = (event, newEvent) => {
this.setState({ tab: newEvent })
}
componentDidMount() {
this.getDataDocument()
}
getDataDocument() {
api.create().getDocumentCategory().then(response => {
this.setState({
listData: response.data.data,
id: response.data.data[0].document_category_id,
loadTable: true
})
})
}
getID(id) {
console.log(id);
this.setState({ id })
}
render() {
return (
<div style={{ height: this.props.height, backgroundColor: '#f8f8f8' }}>
<div className={"main-color"} style={{ height: 78, display: 'flex', alignItems: 'center', paddingLeft: 20 }}>
<Typography style={{ fontSize: '16px', color: 'white' }}>Management Document</Typography>
</div>
<div style={{ padding: 20 }}>
<Paper style={{ padding: 20 }}>
<div style={{ display: 'flex' }}>
<Tabs
orientation="vertical"
variant="scrollable"
value={this.state.tab}
onChange={this.selectTab}
aria-label="simple tabs example"
style={{ width: 350 }}
>
{this.state.listData.map((item, index) => {
return (
<Tab
onClick={() => this.setState({ id: item.document_category_id })}
label={item.document_category_name}
/>
)
})}
</Tabs>
{this.state.loadTable && (
this.state.id === 2 ?
<AuditTahunan
data={this.state.listData[this.state.tab]}
/> :
this.state.id === 1 ?
<ManualBookTia /> :
<span>Test2</span>
)}
</div>
</Paper>
</div>
</div>
)
}
}
import React, { Component } from 'react'
import MUIDataTable from 'mui-datatables'
import { createMuiTheme, MuiThemeProvider } from '@material-ui/core';
var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable());
const options = ct.customOptions();
export default class ManualBookTia extends Component {
constructor(props) {
super(props)
this.state = {
dataTable: []
}
}
render() {
let columns = [
"Nama File", "Keterangan", "Perusahaan", "Tipe", "Ukuran", "Ditambahkan Oleh", "Ditambahkan Tanggal"
]
return (
<div style={{ width: '100%' }}>
<div style={{ display: 'grid', justifyContent: 'flex-end' }}>
<button
type="button"
onClick={() => null}
style={{ marginRight: 25 }}
>
<div style={{ width: 150, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<span style={{ color: '#fff', fontSize: 11 }}>Add</span>
</div>
</button>
</div>
<div style={{ padding: 25 }}>
<MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
theme={getMuiTheme()}
data={this.state.dataTable}
columns={columns}
options={options}
/>
</MuiThemeProvider>
</div>
</div>
)
}
}
...@@ -433,7 +433,7 @@ export default class CreateParameter extends Component { ...@@ -433,7 +433,7 @@ export default class CreateParameter extends Component {
// } else if (R.isEmpty(this.state.tempData.description)) { // } else if (R.isEmpty(this.state.tempData.description)) {
// this.setState({ errorDeskripsi: true, msgErrorDeskripsi: 'Deskripsi tidak boleh kosong' }) // this.setState({ errorDeskripsi: true, msgErrorDeskripsi: 'Deskripsi tidak boleh kosong' })
} else if (R.isEmpty(this.state.tempData.value) && R.isEmpty(this.state.tempData.min_value) && R.isEmpty(this.state.tempData.max_value)) { } else if (R.isEmpty(this.state.tempData.value) && R.isEmpty(this.state.tempData.min_value) && R.isEmpty(this.state.tempData.max_value)) {
this.setState({ errorValue: true, msgErrorValue: 'Value tidak boleh kosong' }) this.setState({ errorValue: true, msgErrorValue: 'Value Cannot be Empty.' })
} else if ((!R.isEmpty(this.state.tempData.max_value) && R.isEmpty(this.state.tempData.min_value))) { } else if ((!R.isEmpty(this.state.tempData.max_value) && R.isEmpty(this.state.tempData.min_value))) {
this.setState({ errorMinValue: true, msgErrorMinValue: 'Min Value Cannot be Empty.' }) this.setState({ errorMinValue: true, msgErrorMinValue: 'Min Value Cannot be Empty.' })
} else if (R.isNil(this.state.tempData.start_date)) { } else if (R.isNil(this.state.tempData.start_date)) {
...@@ -459,7 +459,7 @@ export default class CreateParameter extends Component { ...@@ -459,7 +459,7 @@ export default class CreateParameter extends Component {
// } else if (R.isEmpty(this.state.description)) { // } else if (R.isEmpty(this.state.description)) {
// this.setState({ errorDeskripsi: true, msgErrorDeskripsi: 'Deskripsi tidak boleh kosong' }) // this.setState({ errorDeskripsi: true, msgErrorDeskripsi: 'Deskripsi tidak boleh kosong' })
} else if ((R.isEmpty(this.state.value) && R.isEmpty(this.state.maxValue) && R.isEmpty(this.state.minValue))) { } else if ((R.isEmpty(this.state.value) && R.isEmpty(this.state.maxValue) && R.isEmpty(this.state.minValue))) {
this.setState({ errorValue: true, msgErrorValue: 'Value tidak boleh kosong' }) this.setState({ errorValue: true, msgErrorValue: 'Value Cannot be Empty.' })
} else if ((!R.isEmpty(this.state.maxValue) && R.isEmpty(this.state.minValue))) { } else if ((!R.isEmpty(this.state.maxValue) && R.isEmpty(this.state.minValue))) {
this.setState({ errorMinValue: true, msgErrorMinValue: 'Min Value Cannot be Empty.' }) this.setState({ errorMinValue: true, msgErrorMinValue: 'Min Value Cannot be Empty.' })
} else if (R.isNil(this.state.startDate)) { } else if (R.isNil(this.state.startDate)) {
......
...@@ -527,4 +527,21 @@ exports.customOptionsFixedColumn = function () { ...@@ -527,4 +527,21 @@ exports.customOptionsFixedColumn = function () {
search:false, search:false,
pagination: false pagination: false
} }
}
exports.customOptionsManagementDocument = function () {
return {
// selectableRows: false,
selectableRows: 'none',
filterType: 'multiselect',
responsive: 'scroll',
viewColumns:true,
rowsPerPage: 10,
rowsPerPageOptions: [10, 20, 30, 50],
print: false,
download: false,
elevation: 5,
filter: true,
search: true,
}
} }
\ No newline at end of file
...@@ -14,6 +14,7 @@ import BudgetTahunan from '../container/BudgetTahunan'; ...@@ -14,6 +14,7 @@ import BudgetTahunan from '../container/BudgetTahunan';
import RollingOutlook from '../container/RollingOutlook'; import RollingOutlook from '../container/RollingOutlook';
import OperatingIndicator from '../container/OperatingIndicator/OperatingIndicator' import OperatingIndicator from '../container/OperatingIndicator/OperatingIndicator'
import MonthlyReport from '../container/MonthlyReport'; import MonthlyReport from '../container/MonthlyReport';
import DocumentManagement from '../container/DocumentManagement/DocumentManagement';
const routes = [ const routes = [
{ {
...@@ -76,6 +77,10 @@ const routes = [ ...@@ -76,6 +77,10 @@ const routes = [
path: "/home/monthly-report", path: "/home/monthly-report",
main: MonthlyReport main: MonthlyReport
}, },
{
path: "/home/document-management",
main: DocumentManagement
},
{ {
path: "*", path: "*",
main: screen404 main: screen404
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment