Skip to content

T
Tia-dev
Commit f5b4e102 authored by syadziy's avatar syadziy
Browse files
Options

update doc management

parent 25105f54
Show whitespace changes
Inline Side-by-side
Showing with 6 additions and 1374 deletions
src/container/DocumentManagement/AuditTahunan.js deleted 100644 → 0
View file @ 25105f54
import React, { Component } from 'react'
import MUIDataTable from 'mui-datatables'
import { withStyles } from '@material-ui/core/styles';
import { createMuiTheme, MuiThemeProvider, Snackbar } from '@material-ui/core';
import MuiAlert from '@material-ui/lab/Alert';
import Constant from '../../library/Constant';
import Images from '../../assets/Images';
import ReactTooltip from 'react-tooltip';
import PopUpDelete from "./PopUpDelete";
import api from '../../api';
import CreateManagementDoc from './CreateManagementDoc';
import EditManagementDoc from './EditManagementDoc';
var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable());
const options = ct.customOptionsManagementDocument();
const Alert = withStyles({
})((props) => <MuiAlert elevation={6} variant="filled" {...props} />);
export default class AuditTahunan extends Component {
constructor(props) {
super(props)
this.state = {
dataTable: [],
visibleCreate: false,
visibleEdit: false,
refresh: '',
alert: false,
popupDel: false,
}
}
componentDidMount() {
// console.log(this.props.data)
this.getData()
}
componentWillReceiveProps(props) {
// console.log(props);
const { refresh, id } = this.props;
if (props.refresh !== refresh) {
this.getData()
}
}
getData() {
let payload = {
"setting_id": this.props.data.setting_id
}
api.create().getAllDocument(payload).then(response => {
console.log(response)
if (response.data) {
if (response.ok) {
if (response.data.status == 'success') {
let dataTable = response.data.data.map((item, index) => {
return [
index,
item.document_name,
item.description,
item.company_name,
item.document_periode,
item.document_type,
String(Number(item.document_size) / 1000 + ' KB'),
item.created_by,
item.created_at,
]
})
this.setState({ dataTable })
let docPath = response.data.data.map((item) => {
return [
item.document_filepath
]
})
this.setState({ docPath })
let docId = response.data.data.map((item) => {
return [
item.document_id
]
})
this.setState({ docId })
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning', loading: false }, () => {
if (response.data.message.includes("Someone Logged In") || response.data.message.includes("Token Expired")) {
setTimeout(() => {
localStorage.removeItem(Constant.TOKEN)
window.location.reload();
}, 1000);
}
})
}
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error', loading: false })
}
} else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error', loading: false })
}
})
}
openPopUp = async (index, val, type) =>{
if (type === 'download') {
console.log(this.state.docPath[val])
let res = await fetch(
`${process.env.REACT_APP_URL_MAIN_BE}/public/document/download_document?documentName=`+this.state.docPath[val]+"&&fileType="+index[5]
)
res = await res.blob()
// console.log(res)
if (res.size > 0) {
let url = window.URL.createObjectURL(res);
let a = document.createElement('a');
a.href = url;
a.download = index[1];
a.click();
}
}
if (type === 'delete') {
this.setState({
id: this.state.docId[val],
rowData: index,
popupDel: true
})
}
if (type === 'edit') {
this.setState({
id: this.state.docId[val],
rowData: index,
visibleEdit: true
})
}
}
deleteDoc = (payload) => {
this.setState({ popupDel: false })
api.create().deleteDocument(payload).then(response => {
console.log(response.data)
if (response.data) {
if (response.ok) {
if (response.data.status == 'success') {
this.getData()
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'success' })
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }, () => {
if (response.data.message.includes("Someone Logged In") || response.data.message.includes("Token Expired")) {
setTimeout(() => {
localStorage.removeItem(Constant.TOKEN)
window.location.reload();
}, 1000);
}
})
}
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' })
}
} else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' })
}
})
}
updateDocument(payload) {
api.create().updateDocument(payload).then(response => {
console.log(response)
if (response.data) {
if (response.ok) {
if (response.data.status === "success") {
this.getData()
this.setState({ konfirmasi: false, alert: true, messageAlert: response.data.message, tipeAlert: 'success', visibleEdit: false })
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }, () => {
if (response.data.message.includes("Someone Logged In") || response.data.message.includes("Token Expired")) {
setTimeout(() => {
localStorage.removeItem(Constant.TOKEN)
window.location.reload();
}, 1000);
}
})
}
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' })
}
} else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' })
}
})
}
closeAlert() {
this.setState({ alert: false })
}
render() {
let columns = [{
name: "Action",
options: {
filter: false,
sort: false,
customBodyRender: (val, tableMeta) => {
console.log(tableMeta)
return (
<div style={{ display: 'flex' }}>
{/* {this.state.btnedit && <span> */}
<a data-tip={'Download'} data-for="download">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
marginRight: 15
}}
// onClick={() => console.log(tableMeta)}
onClick={() => this.openPopUp(tableMeta.rowData, val, 'download')}
>
<img src={Images.download} />
</button>
</a>
<ReactTooltip border={true} id="download" place="bottom" type="light" effect="solid" />
{/* </span>} */}
{this.props.btnedit && <span>
<a data-tip={'Edit'} data-for="edit">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
marginRight: 15
}}
// onClick={() => console.log(tableMeta)}
onClick={() => this.openPopUp(tableMeta.rowData, val, 'edit')}
>
<img src={Images.editCopy} />
</button>
</a>
<ReactTooltip border={true} id="edit" place="bottom" type="light" effect="solid" />
</span>}
{this.props.btndelete && <span>
<a data-tip={'Delete'} data-for="delete">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
}}
// onClick={() => console.log(tableMeta)}
onClick={() => this.openPopUp(tableMeta.rowData, val, 'delete')}
>
<img src={Images.delete} />
</button>
</a>
<ReactTooltip border={true} id="delete" place="bottom" type="light" effect="solid" />
</span>}
</div >
);
}
}
}, "File Name", "Description", "Company Name", "Period", "Type", "File Size", "Created By", "Created Date"
]
return (
<div style={{ width: '100%' }}>
<div style={{ padding: 25 }}>
<Snackbar open={this.state.alert} autoHideDuration={6000} onClose={() => this.closeAlert()}>
<Alert onClose={() => this.closeAlert()} severity={this.state.tipeAlert}>
{this.state.messageAlert}
</Alert>
</Snackbar>
<MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
theme={getMuiTheme()}
data={this.state.dataTable}
columns={columns}
options={options}
/>
</MuiThemeProvider>
</div>
{this.state.popupDel && (
<PopUpDelete
type={"delete"}
onClickClose={() => this.setState({ popupDel: false })}
data={this.state.rowData}
idoc={this.state.id}
// getList={() => this.getData.bind(this)}
deleteDoc={this.deleteDoc.bind(this)}
/>
)}
{this.state.visibleEdit && (
<EditManagementDoc
type={"edit"}
onClickClose={() => this.setState({ visibleEdit: false })}
data={this.state.rowData}
idoc={this.state.id}
updateDocument={this.updateDocument.bind(this)}
/>
)}
</div>
)
}
}
src/container/DocumentManagement/BOD.js deleted 100644 → 0
View file @ 25105f54
import React, { Component } from 'react'
import MUIDataTable from 'mui-datatables'
import { withStyles } from '@material-ui/core/styles';
import { createMuiTheme, MuiThemeProvider, Snackbar } from '@material-ui/core';
import MuiAlert from '@material-ui/lab/Alert';
import Constant from '../../library/Constant';
import api from '../../api';
import Images from '../../assets/Images';
import ReactTooltip from 'react-tooltip';
import PopUpDelete from "./PopUpDelete";
import CreateManagementDoc from './CreateManagementDoc';
import EditManagementDoc from './EditManagementDoc';
var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable());
const options = ct.customOptionsManagementDocument();
const Alert = withStyles({
})((props) => <MuiAlert elevation={6} variant="filled" {...props} />);
export default class BOD extends Component {
constructor(props) {
super(props)
this.state = {
dataTable: [],
visibleCreate: false,
visibleEdit: false,
refresh: '',
alert: false,
popupDel: false,
}
}
componentDidMount() {
// console.log(this.props.data)
this.getData()
}
componentWillReceiveProps(props) {
// console.log(props);
const { refresh, id } = this.props;
if (props.refresh !== refresh) {
this.getData()
}
}
getData() {
let payload = {
"setting_id": this.props.data.setting_id
}
api.create().getAllDocument(payload).then((response) => {
console.log(response)
if (response.problem){
alert(response.problem)
}
if (response.data) {
if (response.ok) {
if (response.data.status == 'success') {
let dataTable = response.data.data.map((item, index) => {
return [
index,
item.document_name,
item.description,
item.company_name,
item.document_periode,
item.document_type,
String(Number(item.document_size) / 1000 + ' KB'),
item.created_by,
item.created_at,
]
})
this.setState({ dataTable })
let docPath = response.data.data.map((item) => {
return [
item.document_filepath
]
})
this.setState({ docPath })
let docId = response.data.data.map((item) => {
return [
item.document_id
]
})
this.setState({ docId })
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning', loading: false }, () => {
if (response.data.message.includes("Someone Logged In") || response.data.message.includes("Token Expired")) {
setTimeout(() => {
localStorage.removeItem(Constant.TOKEN)
window.location.reload();
}, 1000);
}
})
}
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error', loading: false })
}
} else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error', loading: false })
}
})
}
openPopUp = async (index, val, type) =>{
if (type === 'download') {
console.log(this.state.docPath[val])
let res = await fetch(
`${process.env.REACT_APP_URL_MAIN_BE}/public/document/download_document?documentName=`+this.state.docPath[val]+"&&fileType="+index[5]
)
res = await res.blob()
// console.log(res)
if (res.size > 0) {
let url = window.URL.createObjectURL(res);
let a = document.createElement('a');
a.href = url;
a.download = index[1];
a.click();
}
}
if (type === 'delete') {
this.setState({
id: this.state.docId[val],
rowData: index,
popupDel: true
})
}
if (type === 'edit') {
this.setState({
id: this.state.docId[val],
rowData: index,
visibleEdit: true
})
}
}
updateDocument(payload) {
api.create().updateDocument(payload).then(response => {
console.log(response)
if (response.data) {
if (response.ok) {
if (response.data.status === "success") {
this.getData()
this.setState({ konfirmasi: false, alert: true, messageAlert: response.data.message, tipeAlert: 'success', visibleEdit: false })
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }, () => {
if (response.data.message.includes("Someone Logged In") || response.data.message.includes("Token Expired")) {
setTimeout(() => {
localStorage.removeItem(Constant.TOKEN)
window.location.reload();
}, 1000);
}
})
}
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' })
}
} else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' })
}
})
}
closeAlert() {
this.setState({ alert: false })
}
deleteDoc = (payload) => {
this.setState({ popupDel: false })
api.create().deleteDocument(payload).then(response => {
console.log(response.data)
if (response.data) {
if (response.ok) {
if (response.data.status == 'success') {
this.getData()
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'success' })
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }, () => {
if (response.data.message.includes("Someone Logged In") || response.data.message.includes("Token Expired")) {
setTimeout(() => {
localStorage.removeItem(Constant.TOKEN)
window.location.reload();
}, 1000);
}
})
}
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' })
}
} else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' })
}
})
}
render() {
let columns = [
{
name: "Action",
options: {
filter: false,
sort: false,
customBodyRender: (val, tableMeta) => {
console.log(tableMeta)
return (
<div style={{ display: 'flex' }}>
{/* {this.state.btnedit && <span> */}
<a data-tip={'Download'} data-for="download">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
marginRight: 15
}}
// onClick={() => console.log(tableMeta)}
onClick={() => this.openPopUp(tableMeta.rowData, val, 'download')}
>
<img src={Images.download} />
</button>
</a>
<ReactTooltip border={true} id="download" place="bottom" type="light" effect="solid" />
{/* </span>} */}
{this.props.btnedit && <span>
<a data-tip={'Edit'} data-for="edit">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
marginRight: 15
}}
// onClick={() => console.log(tableMeta)}
onClick={() => this.openPopUp(tableMeta.rowData, val, 'edit')}
>
<img src={Images.editCopy} />
</button>
</a>
<ReactTooltip border={true} id="edit" place="bottom" type="light" effect="solid" />
</span>}
{this.props.btndelete && <span>
<a data-tip={'Delete'} data-for="delete">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
}}
// onClick={() => console.log(tableMeta)}
onClick={() => this.openPopUp(tableMeta.rowData, val, 'delete')}
>
<img src={Images.delete} />
</button>
</a>
<ReactTooltip border={true} id="delete" place="bottom" type="light" effect="solid" />
</span>}
</div >
);
}
}
}, "File Name", "Description", "Company Name", "Period", "Type", "File Size", "Created By", "Created Date"
]
return (
<div style={{ width: '100%' }}>
<div style={{ padding: 25 }}>
<Snackbar open={this.state.alert} autoHideDuration={6000} onClose={() => this.closeAlert()}>
<Alert onClose={() => this.closeAlert()} severity={this.state.tipeAlert}>
{this.state.messageAlert}
</Alert>
</Snackbar>
<MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
theme={getMuiTheme()}
data={this.state.dataTable}
columns={columns}
options={options}
/>
</MuiThemeProvider>
</div>
{this.state.popupDel && (
<PopUpDelete
type={"delete"}
onClickClose={() => this.setState({ popupDel: false })}
data={this.state.rowData}
idoc={this.state.id}
// getList={() => this.getData.bind(this)}
deleteDoc={this.deleteDoc.bind(this)}
/>
)}
{this.state.visibleEdit && (
<EditManagementDoc
type={"edit"}
onClickClose={() => this.setState({ visibleEdit: false })}
data={this.state.rowData}
idoc={this.state.id}
updateDocument={this.updateDocument.bind(this)}
/>
)}
</div>
)
}
}
src/container/DocumentManagement/DocumentManagement.js
View file @ f5b4e102
...@@ -2,14 +2,14 @@ import React, { Component } from 'react' ...@@ -2,14 +2,14 @@ import React, { Component } from 'react'
import { Tabs, Tab, Typography, Paper, withStyles, Snackbar } from '@material-ui/core' import { Tabs, Tab, Typography, Paper, withStyles, Snackbar } from '@material-ui/core'
import ReactTooltip from 'react-tooltip' import ReactTooltip from 'react-tooltip'
import Images from '../../assets/Images' import Images from '../../assets/Images'
import ManualBookTia from './ManualBookTia' // import ManualBookTia from './ManualBookTia'
import api from '../../api' import api from '../../api'
import AuditTahunan from './AuditTahunan' // import AuditTahunan from './AuditTahunan'
import CreateManagementDoc from './CreateManagementDoc' import CreateManagementDoc from './CreateManagementDoc'
import AllDocument from './AllDocument' import AllDocument from './AllDocument'
import QReview from './QReview' // import QReview from './QReview'
import BOD from './BOD' // import BOD from './BOD'
import ManualBookETMS from './ManualBookETMS' // import ManualBookETMS from './ManualBookETMS'
import PopUpKonfirmasi from "./PopUpKonfirmasi"; import PopUpKonfirmasi from "./PopUpKonfirmasi";
import Constant from '../../library/Constant' import Constant from '../../library/Constant'
import MuiAlert from '@material-ui/lab/Alert'; import MuiAlert from '@material-ui/lab/Alert';
...@@ -61,7 +61,7 @@ export default class DocumentManagement extends Component { ...@@ -61,7 +61,7 @@ export default class DocumentManagement extends Component {
selectTab = (event, newEvent) => { selectTab = (event, newEvent) => {
this.setState({ tab: newEvent }) this.setState({ tab: newEvent })
// console.log(this.state.tab) console.log(this.state.tab)
} }
componentDidMount() { componentDidMount() {
...@@ -304,50 +304,6 @@ export default class DocumentManagement extends Component { ...@@ -304,50 +304,6 @@ export default class DocumentManagement extends Component {
handleLoading={this.handleLoading.bind(this)} handleLoading={this.handleLoading.bind(this)}
name={this.state.name} name={this.state.name}
/> />
// this.state.id === 68542 ?
// <AuditTahunan
// data={this.state.listData[this.state.tab]}
// refresh={this.state.refresh}
// btnedit={this.state.btnedit}
// btndelete={this.state.btndelete}
// load={this.state.load}
// />
// :
// this.state.id === 68541 ?
// <ManualBookTia
// data={this.state.listData[this.state.tab]}
// refresh={this.state.refresh}
// btnedit={this.state.btnedit}
// btndelete={this.state.btndelete}
// load={this.state.load}
// />
// :
// this.state.id === 68544 ?
// <QReview
// data={this.state.listData[this.state.tab]}
// refresh={this.state.refresh}
// btnedit={this.state.btnedit}
// btndelete={this.state.btndelete}
// load={this.state.load}
// />
// :
// this.state.id === 68543 ?
// <BOD
// data={this.state.listData[this.state.tab]}
// refresh={this.state.refresh}
// btnedit={this.state.btnedit}
// btndelete={this.state.btndelete}
// load={this.state.load}
// />
// // :
// // this.state.id === 68545 ?
// // <ManualBookETMS
// // data={this.state.listData[this.state.tab]}
// // refresh={this.state.refresh}
// // />
// :
// <span>Coming Soon</span>
)} )}
</div> </div>
......
src/container/DocumentManagement/ManualBookETMS.js deleted 100644 → 0
View file @ 25105f54
import React, { Component } from 'react'
import MUIDataTable from 'mui-datatables'
import { createMuiTheme, MuiThemeProvider } from '@material-ui/core';
import api from '../../api';
import Images from '../../assets/Images';
import ReactTooltip from 'react-tooltip';
var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable());
const options = ct.customOptions();
export default class ManualBookETMS extends Component {
constructor(props) {
super(props)
this.state = {
dataTable: [],
visibleCreate: false,
refresh: ''
}
}
componentDidMount() {
// console.log(this.props.data)
this.getData()
}
componentWillReceiveProps(props) {
// console.log(props);
const { refresh, id } = this.props;
if (props.refresh !== refresh) {
this.getData()
}
}
getData() {
let payload = {
"setting_id": this.props.data.setting_id
}
api.create().getAllDocument(payload).then(response => {
console.log(response)
let dataTable = response.data.data.map((item, index) => {
return [
index,
item.document_name,
item.description,
item.company_name,
item.document_type,
String(Number(item.document_size) / 1000 + ' KB'),
item.created_by,
item.created_at,
]
})
this.setState({ dataTable })
let docPath = response.data.data.map((item) => {
return [
item.document_filepath
]
})
this.setState({ docPath })
})
}
openPopUp = async (index, val, type) =>{
if (type === 'download') {
console.log(this.state.docPath[val])
let res = await fetch(
`${process.env.REACT_APP_URL_MAIN_BE}/public/document/download_document?documentName=`+this.state.docPath[val]+"&&fileType="+index[5]
)
res = await res.blob()
// console.log(res)
if (res.size > 0) {
let url = window.URL.createObjectURL(res);
let a = document.createElement('a');
a.href = url;
a.download = index[1];
a.click();
}
}
}
render() {
let columns = [{
name: "Action",
options: {
filter: false,
sort: false,
customBodyRender: (val, tableMeta) => {
console.log(tableMeta)
return (
<div style={{ display: 'flex' }}>
{/* {this.state.btnedit && <span> */}
<a data-tip={'Download'} data-for="download">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
marginRight: 15
}}
// onClick={() => console.log(tableMeta)}
onClick={() => this.openPopUp(tableMeta.rowData, val, 'download')}
>
<img src={Images.download} />
</button>
</a>
<ReactTooltip border={true} id="download" place="bottom" type="light" effect="solid" />
{/* </span>} */}
</div >
);
}
}
}, "Nama File", "Keterangan", "Perusahaan", "Tipe", "Ukuran", "Ditambahkan Oleh", "Ditambahkan Tanggal"
]
return (
<div style={{ width: '100%' }}>
<div style={{ padding: 25 }}>
<MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
theme={getMuiTheme()}
data={this.state.dataTable}
columns={columns}
options={options}
/>
</MuiThemeProvider>
</div>
</div>
)
}
}
src/container/DocumentManagement/ManualBookTia.js deleted 100644 → 0
View file @ 25105f54
import React, { Component } from 'react'
import ReactTooltip from 'react-tooltip';
import { createMuiTheme, MuiThemeProvider, Snackbar } from '@material-ui/core';
import { withStyles } from '@material-ui/core/styles';
import MuiAlert from '@material-ui/lab/Alert';
import MUIDataTable from 'mui-datatables'
import Constant from '../../library/Constant';
import Images from '../../assets/Images';
import EditManagementDoc from "./EditManagementDoc";
import PopUpDelete from "./PopUpDelete";
import api from '../../api';
var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable());
const options = ct.customOptions();
const Alert = withStyles({
})((props) => <MuiAlert elevation={6} variant="filled" {...props} />);
export default class ManualBookTia extends Component {
constructor(props) {
super(props)
this.state = {
dataTable: [],
visibleCreate: false,
visibleEdit: false,
refresh: '',
alert: false,
popupDel: false,
}
}
componentDidMount() {
// console.log(this.props.data)
this.getData()
}
componentWillReceiveProps(props) {
// console.log(props);
const { refresh, id } = this.props;
if (props.refresh !== refresh) {
this.getData()
}
}
getData() {
let payload = {
"setting_id": this.props.data.setting_id
}
api.create().getAllDocument(payload).then(response => {
console.log(response)
if (response.data) {
if (response.ok) {
if (response.data.status == 'success') {
let dataTable = response.data.data.map((item, index) => {
return [
index,
item.document_name,
item.description,
item.company_name,
item.document_periode,
item.document_type,
String(Number(item.document_size) / 1000 + ' KB'),
item.created_by,
item.created_at,
]
})
this.setState({ dataTable })
let docPath = response.data.data.map((item) => {
return [
item.document_filepath
]
})
this.setState({ docPath })
let docId = response.data.data.map((item) => {
return [
item.document_id
]
})
this.setState({ docId })
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning', loading: false }, () => {
if (response.data.message.includes("Someone Logged In") || response.data.message.includes("Token Expired")) {
setTimeout(() => {
localStorage.removeItem(Constant.TOKEN)
window.location.reload();
}, 1000);
}
})
}
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error', loading: false })
}
} else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error', loading: false })
}
})
}
closeAlert() {
this.setState({ alert: false })
}
openPopUp = async (index, val, type) =>{
if (type === 'download') {
let res = await fetch(
`${process.env.REACT_APP_URL_MAIN_BE}/public/document/download_document?documentName=`+this.state.docPath[val]+"&&fileType="+index[5]
)
res = await res.blob()
// console.log(res)
if (res.size > 0) {
let url = window.URL.createObjectURL(res);
let a = document.createElement('a');
a.href = url;
a.download = index[1];
a.click();
}
}
if (type === 'delete') {
this.setState({
id: this.state.docId[val],
rowData: index,
popupDel: true
})
}
if (type === 'edit') {
this.setState({
id: this.state.docId[val],
rowData: index,
visibleEdit: true
})
}
}
deleteDoc = (payload) => {
this.setState({ popupDel: false })
api.create().deleteDocument(payload).then(response => {
console.log(response.data)
if (response.data) {
if (response.ok) {
if (response.data.status == 'success') {
this.getData()
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'success' })
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }, () => {
if (response.data.message.includes("Someone Logged In") || response.data.message.includes("Token Expired")) {
setTimeout(() => {
localStorage.removeItem(Constant.TOKEN)
window.location.reload();
}, 1000);
}
})
}
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' })
}
} else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' })
}
})
}
updateDocument(payload) {
api.create().updateDocument(payload).then(response => {
console.log(response)
if (response.data) {
if (response.ok) {
if (response.data.status === "success") {
this.getData()
this.setState({ konfirmasi: false, alert: true, messageAlert: response.data.message, tipeAlert: 'success', visibleEdit: false })
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }, () => {
if (response.data.message.includes("Someone Logged In") || response.data.message.includes("Token Expired")) {
setTimeout(() => {
localStorage.removeItem(Constant.TOKEN)
window.location.reload();
}, 1000);
}
})
}
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' })
}
} else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' })
}
})
}
render() {
let columns = [{
name: "Action",
options: {
filter: false,
sort: false,
customBodyRender: (val, tableMeta) => {
// console.log(tableMeta)
return (
<div style={{ display: 'flex' }}>
{/* {this.state.btnedit && <span> */}
<a data-tip={'Download'} data-for="download">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
marginRight: 15
}}
// onClick={() => console.log(tableMeta)}
onClick={() => this.openPopUp(tableMeta.rowData, val, 'download')}
>
<img src={Images.download} style={{ width: 33}} />
</button>
</a>
<ReactTooltip border={true} id="download" place="bottom" type="light" effect="solid" />
{/* </span>} */}
{this.props.btnedit && <span>
<a data-tip={'Edit'} data-for="edit">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
marginRight: 15
}}
// onClick={() => console.log(tableMeta)}
onClick={() => this.openPopUp(tableMeta.rowData, val, 'edit')}
>
<img src={Images.editCopy} />
</button>
</a>
<ReactTooltip border={true} id="edit" place="bottom" type="light" effect="solid" />
</span>}
{this.props.btndelete && <span>
<a data-tip={'Delete'} data-for="delete">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
}}
// onClick={() => console.log(tableMeta)}
onClick={() => this.openPopUp(tableMeta.rowData, val, 'delete')}
>
<img src={Images.delete} />
</button>
</a>
<ReactTooltip border={true} id="delete" place="bottom" type="light" effect="solid" />
</span>}
</div >
);
}
}
}, "File Name", "Description", "Company Name", "Type", "File Size", "Created By", "Created Date"
]
return (
<div style={{ width: '100%' }}>
<div style={{ padding: 25 }}>
<Snackbar open={this.state.alert} autoHideDuration={6000} onClose={() => this.closeAlert()}>
<Alert onClose={() => this.closeAlert()} severity={this.state.tipeAlert}>
{this.state.messageAlert}
</Alert>
</Snackbar>
<MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
theme={getMuiTheme()}
data={this.state.dataTable}
columns={columns}
options={options}
/>
</MuiThemeProvider>
</div>
{this.state.popupDel && (
<PopUpDelete
type={"delete"}
onClickClose={() => this.setState({ popupDel: false })}
data={this.state.rowData}
idoc={this.state.id}
// getList={() => this.getData.bind(this)}
deleteDoc={this.deleteDoc.bind(this)}
/>
)}
{this.state.visibleEdit && (
<EditManagementDoc
type={"edit"}
onClickClose={() => this.setState({ visibleEdit: false })}
data={this.state.rowData}
idoc={this.state.id}
updateDocument={this.updateDocument.bind(this)}
/>
)}
</div>
)
}
}
src/container/DocumentManagement/QReview.js deleted 100644 → 0
View file @ 25105f54
import React, { Component } from 'react'
import MUIDataTable from 'mui-datatables'
import { withStyles } from '@material-ui/core/styles';
import { createMuiTheme, MuiThemeProvider, Snackbar } from '@material-ui/core';
import MuiAlert from '@material-ui/lab/Alert';
import Constant from '../../library/Constant';
import Images from '../../assets/Images';
import ReactTooltip from 'react-tooltip';
import api from '../../api';
import PopUpDelete from "./PopUpDelete";
import CreateManagementDoc from './CreateManagementDoc';
import EditManagementDoc from './EditManagementDoc';
var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable());
const options = ct.customOptionsManagementDocument();
const Alert = withStyles({
})((props) => <MuiAlert elevation={6} variant="filled" {...props} />);
export default class QReview extends Component {
constructor(props) {
super(props)
this.state = {
dataTable: [],
visibleCreate: false,
visibleEdit: false,
refresh: '',
alert: false,
popupDel: false,
}
}
componentDidMount() {
// console.log(this.props.data)
this.getData()
}
componentWillReceiveProps(props) {
// console.log(props);
const { refresh, id } = this.props;
if (props.refresh !== refresh) {
this.getData()
}
}
getData() {
let payload = {
"setting_id": this.props.data.setting_id
}
api.create().getAllDocument(payload).then((response) => {
console.log(response)
if (response.data) {
if (response.ok) {
if (response.data.status == 'success') {
let dataTable = response.data.data.map((item, index) => {
return [
index,
item.document_name,
item.description,
item.company_name,
item.document_periode,
item.document_type,
String(Number(item.document_size) / 1000 + ' KB'),
item.created_by,
item.created_at
]
})
this.setState({ dataTable })
let docPath = response.data.data.map((item) => {
return [
item.document_filepath
]
})
this.setState({ docPath })
let docId = response.data.data.map((item) => {
return [
item.document_id
]
})
this.setState({ docId })
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning', loading: false }, () => {
if (response.data.message.includes("Someone Logged In") || response.data.message.includes("Token Expired")) {
setTimeout(() => {
localStorage.removeItem(Constant.TOKEN)
window.location.reload();
}, 1000);
}
})
}
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error', loading: false })
}
} else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error', loading: false })
}
})
}
openPopUp = async (index, val, type) =>{
if (type === 'download') {
let res = await fetch(
`${process.env.REACT_APP_URL_MAIN_BE}/public/document/download_document?documentName=`+this.state.docPath[val]+"&&fileType="+index[5]
)
res = await res.blob()
// console.log(res)
if (res.size > 0) {
let url = window.URL.createObjectURL(res);
let a = document.createElement('a');
a.href = url;
a.download = index[1];
a.click();
}
}
if (type === 'delete') {
this.setState({
id: this.state.docId[val],
rowData: index,
popupDel: true
})
}
if (type === 'edit') {
this.setState({
id: this.state.docId[val],
rowData: index,
visibleEdit: true
})
}
}
closeAlert() {
this.setState({ alert: false })
}
deleteDoc = (payload) => {
this.setState({ popupDel: false })
api.create().deleteDocument(payload).then(response => {
console.log(response.data)
if (response.data) {
if (response.ok) {
if (response.data.status == 'success') {
this.getData()
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'success' })
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }, () => {
if (response.data.message.includes("Someone Logged In") || response.data.message.includes("Token Expired")) {
setTimeout(() => {
localStorage.removeItem(Constant.TOKEN)
window.location.reload();
}, 1000);
}
})
}
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' })
}
} else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' })
}
})
}
updateDocument(payload) {
api.create().updateDocument(payload).then(response => {
console.log(response)
if (response.data) {
if (response.ok) {
if (response.data.status === "success") {
this.getData()
this.setState({ konfirmasi: false, alert: true, messageAlert: response.data.message, tipeAlert: 'success', visibleEdit: false })
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }, () => {
if (response.data.message.includes("Someone Logged In") || response.data.message.includes("Token Expired")) {
setTimeout(() => {
localStorage.removeItem(Constant.TOKEN)
window.location.reload();
}, 1000);
}
})
}
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' })
}
} else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' })
}
})
}
render() {
let columns = [{
name: "Action",
options: {
filter: false,
sort: false,
customBodyRender: (val, tableMeta) => {
return (
<div style={{ display: 'flex' }}>
<a data-tip={'Download'} data-for="download">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
marginRight: 15
}}
// onClick={() => console.log(tableMeta)}
onClick={() => this.openPopUp(tableMeta.rowData, val, 'download')}
>
<img src={Images.download} />
</button>
</a>
<ReactTooltip border={true} id="download" place="bottom" type="light" effect="solid" />
{this.props.btnedit && <span>
<a data-tip={'Edit'} data-for="edit">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
marginRight: 15
}}
// onClick={() => console.log(tableMeta)}
onClick={() => this.openPopUp(tableMeta.rowData, val, 'edit')}
>
<img src={Images.editCopy} />
</button>
</a>
<ReactTooltip border={true} id="edit" place="bottom" type="light" effect="solid" />
</span>}
{this.props.btndelete && <span>
<a data-tip={'Delete'} data-for="delete">
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
}}
// onClick={() => console.log(tableMeta)}
onClick={() => this.openPopUp(tableMeta.rowData, val, 'delete')}
>
<img src={Images.delete} />
</button>
</a>
<ReactTooltip border={true} id="delete" place="bottom" type="light" effect="solid" />
</span>}
</div >
);
}
}
}, "File Name", "Description", "Company Name", "Period", "Type", "File Size", "Created By", "Created Date"
]
return (
<div style={{ width: '100%' }}>
<div style={{ padding: 25 }}>
<Snackbar open={this.state.alert} autoHideDuration={6000} onClose={() => this.closeAlert()}>
<Alert onClose={() => this.closeAlert()} severity={this.state.tipeAlert}>
{this.state.messageAlert}
</Alert>
</Snackbar>
<MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
theme={getMuiTheme()}
data={this.state.dataTable}
columns={columns}
options={options}
/>
</MuiThemeProvider>
</div>
{this.state.popupDel && (
<PopUpDelete
type={"delete"}
onClickClose={() => this.setState({ popupDel: false })}
data={this.state.rowData}
idoc={this.state.id}
// getList={() => this.getData.bind(this)}
deleteDoc={this.deleteDoc.bind(this)}
/>
)}
{this.state.visibleEdit && (
<EditManagementDoc
type={"edit"}
onClickClose={() => this.setState({ visibleEdit: false })}
data={this.state.rowData}
idoc={this.state.id}
updateDocument={this.updateDocument.bind(this)}
/>
)}
</div>
)
}
}
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