Skip to content

T
Tia-dev
Commit 784f249d authored by Deni Rinaldi's avatar Deni Rinaldi
Browse files
Options

upload parameter

parent 39b359a0
Hide whitespace changes
Inline Side-by-side
Showing with 380 additions and 344 deletions
src/api/index.js
View file @ 784f249d
...@@ -66,7 +66,7 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') => ...@@ -66,7 +66,7 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') =>
const resetPassword = (body) => api.post('auth/reset_password', body) const resetPassword = (body) => api.post('auth/reset_password', body)
const verification = (body) => api.post('email/reset_password', body) const verification = (body) => api.post('email/reset_password', body)
const isResetPassword = (userId) => api.post(`auth/is_reset_password/${userId}`) const isResetPassword = (userId) => api.post(`auth/is_reset_password/${userId}`)
//Role //Role
const getRole = () => api.get('role/get_all_role') const getRole = () => api.get('role/get_all_role')
const getRoleActive = () => api.get('role/get_all_role_active') const getRoleActive = () => api.get('role/get_all_role_active')
...@@ -83,7 +83,7 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') => ...@@ -83,7 +83,7 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') =>
const getUnitBisnis = () => api.get('business_unit/get_all_business_unit') const getUnitBisnis = () => api.get('business_unit/get_all_business_unit')
const createUnitBisnis = (body) => api.post('/business_unit/create_business_unit', body) const createUnitBisnis = (body) => api.post('/business_unit/create_business_unit', body)
const updateUnitBisnis = (body) => api.post('/business_unit/update_business_unit', body) const updateUnitBisnis = (body) => api.post('/business_unit/update_business_unit', body)
const searchUnitBisnis = (body) => api.post('/business_unit/search_business_unit', body) const searchUnitBisnis = (body) => api.post('/business_unit/search_business_unit', body)
const checkUploadUnitBisnis = (body) => api.post('/business_unit/check_import', body) const checkUploadUnitBisnis = (body) => api.post('/business_unit/check_import', body)
const uploadUnitBisnis = (body) => api.post('/business_unit/import_business_unit', body) const uploadUnitBisnis = (body) => api.post('/business_unit/import_business_unit', body)
...@@ -125,12 +125,14 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') => ...@@ -125,12 +125,14 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') =>
const getAllParameter = () => api.get('/setting/get_all_setting') const getAllParameter = () => api.get('/setting/get_all_setting')
const getDetailParameter = (id) => api.get(`setting/get_setting_by_id/${id}`) const getDetailParameter = (id) => api.get(`setting/get_setting_by_id/${id}`)
const getAllGroup = () => api.get('/setting_group/get_all_setting_group') const getAllGroup = () => api.get('/setting_group/get_all_setting_group')
const getParameterByGroup = (groupID) => api.get(`/setting_type/get_all_setting_type_by_group/${groupID}`) const getParameterByGroup = (groupID) => api.get(`/setting_type/get_all_setting_type_by_group/${groupID}`)
const createParameter = (body) => api.post('setting/create_setting', body) const createParameter = (body) => api.post('setting/create_setting', body)
const updateParameter = (body) => api.post('setting/update_setting', body) const updateParameter = (body) => api.post('setting/update_setting', body)
const checkUploadParameter = (body) => api.post('setting/check_import', body)
const uploadParameter = (body) => api.post('/setting/import_setting', body)
//Template //Template
const downloadTemplate = (fileName,fileType) => api.get(`attachment/download_file?fileName=${fileName}&&fileType=${fileType}`) const downloadTemplate = (fileName, fileType) => api.get(`attachment/download_file?fileName=${fileName}&&fileType=${fileType}`)
// ------ // ------
// STEP 3 // STEP 3
// ------ // ------
...@@ -196,7 +198,9 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') => ...@@ -196,7 +198,9 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') =>
updateParameter, updateParameter,
createParameter, createParameter,
getPerusahaanActive, getPerusahaanActive,
getRoleActive getRoleActive,
checkUploadParameter,
uploadParameter
} }
} }
......
src/container/MasterData/Parameter/Parameter.js
View file @ 784f249d
...@@ -104,7 +104,7 @@ export default class Parameter extends Component { ...@@ -104,7 +104,7 @@ export default class Parameter extends Component {
let url = window.URL.createObjectURL(res); let url = window.URL.createObjectURL(res);
let a = document.createElement('a'); let a = document.createElement('a');
a.href = url; a.href = url;
a.download = 'Template Parameter Unit.xlsx'; a.download = 'Template Parameter.xlsx';
a.click(); a.click();
} }
} }
...@@ -119,7 +119,7 @@ export default class Parameter extends Component { ...@@ -119,7 +119,7 @@ export default class Parameter extends Component {
let url = window.URL.createObjectURL(res); let url = window.URL.createObjectURL(res);
let a = document.createElement('a'); let a = document.createElement('a');
a.href = url; a.href = url;
a.download = 'Parameter Unit.xlsx'; a.download = 'Parameter.xlsx';
a.click(); a.click();
} }
} }
...@@ -141,9 +141,9 @@ export default class Parameter extends Component { ...@@ -141,9 +141,9 @@ export default class Parameter extends Component {
id: index + 1, id: index + 1,
group: item[0], group: item[0],
parameter: item[1], parameter: item[1],
perusahaan: item[2], company: item[2],
description: item[3], description: item[3],
order: item[4], orders: item[4],
value: item[5], value: item[5],
min_value: item[6], min_value: item[6],
max_value: item[7], max_value: item[7],
...@@ -153,296 +153,309 @@ export default class Parameter extends Component { ...@@ -153,296 +153,309 @@ export default class Parameter extends Component {
} }
}) })
let body = { let body = {
business_unit: payload setting: payload
} }
this.setState({ payload: body }) this.setState({ payload: body })
api.create().checkUploadUnitBisnis(body).then(response => { api.create().checkUploadParameter(body).then(response => {
if (response.data.status === "success") { console.log(response);
let dataRow = response.data.data.map((item, index) => { if (response.data !== null) {
return [ if (response.data.status === "success") {
index + 1, let dataRow = response.data.data.map((item, index) => {
item.group, return [
item.paramter, index + 1,
item.perusahaan, item.group,
item.description, item.parameter,
item.order, item.company,
item.value, item.description,
item.min_value, item.orders,
item.max_value, item.value,
item.start_date, item.min_value,
item.end_date, item.max_value,
] item.start_date,
}) item.end_date,
let columns = [ item.error,
"Data Ke-", ]
{ })
name: "Group", let columns = [
options: { "Data Ke-",
customBodyRender: (val, tableMeta) => { {
let check = null name: "Group",
if (tableMeta.rowData[4] != null) { options: {
check = tableMeta.rowData[4].findIndex((val) => val.field.includes('business_unit_name')) customBodyRender: (val, tableMeta) => {
if (check > -1) { let check = null
this.setState({ buttonError: true }) if (tableMeta.rowData[11] != null) {
check = tableMeta.rowData[11].findIndex((val) => val.field.includes('group'))
if (check > -1) {
this.setState({ buttonError: true })
}
} }
} return (
return ( <div style={{ display: 'flex' }}>
<div style={{ display: 'flex' }}> {tableMeta.rowData[11] != null && check > -1 ?
{tableMeta.rowData[4] != null && check > -1 ? <a data-tip={tableMeta.rowData[11][check].message} data-for="group">
<a data-tip={tableMeta.rowData[4][check].message} data-for="unitbisnis"> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> :
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> : }
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <ReactTooltip border={true} id="group" place="bottom" type="light" effect="solid" />
} </div >
<ReactTooltip border={true} id="unitbisnis" place="bottom" type="light" effect="solid" /> );
</div > }
);
} }
} },
}, {
{ name: "Parameter",
name: "Parameter", options: {
options: { customBodyRender: (val, tableMeta) => {
customBodyRender: (val, tableMeta) => { let check = null
let check = null if (tableMeta.rowData[11] != null) {
if (tableMeta.rowData[4] != null) { check = tableMeta.rowData[11].findIndex((val) => val.field.includes('parameter'))
check = tableMeta.rowData[4].findIndex((val) => val.field.includes('start_date')) if (check > -1) {
if (check > -1) { this.setState({ buttonError: true })
this.setState({ buttonError: true }) }
} }
} return (
return ( <div style={{ display: 'flex' }}>
<div style={{ display: 'flex' }}> {tableMeta.rowData[11] != null && check > -1 ?
{tableMeta.rowData[4] != null && check > -1 ? <a data-tip={tableMeta.rowData[11][check].message} data-for="parameter">
<a data-tip={tableMeta.rowData[4][check].message} data-for="startdate"> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> :
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> : }
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <ReactTooltip border={true} id="parameter" place="bottom" type="light" effect="solid" />
} </div >
<ReactTooltip border={true} id="startdate" place="bottom" type="light" effect="solid" /> );
</div > }
);
} }
} },
}, {
{ name: "Perusahaan",
name: "Perusahaan", options: {
options: { customBodyRender: (val, tableMeta) => {
customBodyRender: (val, tableMeta) => { let check = null
let check = null if (tableMeta.rowData[11] != null) {
if (tableMeta.rowData[4] != null) { check = tableMeta.rowData[11].findIndex((val) => val.field.includes('company'))
check = tableMeta.rowData[4].findIndex((val) => val.field.includes('end_date')) if (check > -1) {
if (check > -1) { this.setState({ buttonError: true })
this.setState({ buttonError: true }) }
} }
} return (
return ( <div style={{ display: 'flex' }}>
<div style={{ display: 'flex' }}> {tableMeta.rowData[11] != null && check > -1 ?
{tableMeta.rowData[4] != null && check > -1 ? <a data-tip={tableMeta.rowData[11][check].message} data-for="company">
<a data-tip={tableMeta.rowData[4][check].message} data-for="enddate"> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> :
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> : }
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <ReactTooltip border={true} id="company" place="bottom" type="light" effect="solid" />
} </div >
<ReactTooltip border={true} id="enddate" place="bottom" type="light" effect="solid" /> );
</div > }
);
} }
} },
}, {
{ name: "Deskripsi",
name: "Deskripsi", options: {
options: { customBodyRender: (val, tableMeta) => {
customBodyRender: (val, tableMeta) => { let check = null
let check = null if (tableMeta.rowData[11] != null) {
if (tableMeta.rowData[4] != null) { check = tableMeta.rowData[11].findIndex((val) => val.field.includes('description'))
check = tableMeta.rowData[4].findIndex((val) => val.field.includes('end_date')) if (check > -1) {
if (check > -1) { this.setState({ buttonError: true })
this.setState({ buttonError: true }) }
} }
} return (
return ( <div style={{ display: 'flex' }}>
<div style={{ display: 'flex' }}> {tableMeta.rowData[11] != null && check > -1 ?
{tableMeta.rowData[4] != null && check > -1 ? <a data-tip={tableMeta.rowData[11][check].message} data-for="description">
<a data-tip={tableMeta.rowData[4][check].message} data-for="enddate"> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> :
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> : }
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <ReactTooltip border={true} id="description" place="bottom" type="light" effect="solid" />
} </div >
<ReactTooltip border={true} id="enddate" place="bottom" type="light" effect="solid" /> );
</div > }
);
} }
} },
}, {
{ name: "Order",
name: "Order", options: {
options: { customBodyRender: (val, tableMeta) => {
customBodyRender: (val, tableMeta) => { let check = null
let check = null if (tableMeta.rowData[11] != null) {
if (tableMeta.rowData[4] != null) { check = tableMeta.rowData[11].findIndex((val) => val.field.includes('order'))
check = tableMeta.rowData[4].findIndex((val) => val.field.includes('end_date')) if (check > -1) {
if (check > -1) { this.setState({ buttonError: true })
this.setState({ buttonError: true }) }
} }
} return (
return ( <div style={{ display: 'flex' }}>
<div style={{ display: 'flex' }}> {tableMeta.rowData[11] != null && check > -1 ?
{tableMeta.rowData[4] != null && check > -1 ? <a data-tip={tableMeta.rowData[11][check].message} data-for="order">
<a data-tip={tableMeta.rowData[4][check].message} data-for="enddate"> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> :
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> : }
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <ReactTooltip border={true} id="order" place="bottom" type="light" effect="solid" />
} </div >
<ReactTooltip border={true} id="enddate" place="bottom" type="light" effect="solid" /> );
</div > }
);
} }
} },
}, {
{ name: "Value",
name: "Value", options: {
options: { customBodyRender: (val, tableMeta) => {
customBodyRender: (val, tableMeta) => { let check = null
let check = null if (tableMeta.rowData[11] != null) {
if (tableMeta.rowData[4] != null) { check = tableMeta.rowData[11].findIndex((val) => val.field.includes('value'))
check = tableMeta.rowData[4].findIndex((val) => val.field.includes('end_date')) if (check > -1) {
if (check > -1) { this.setState({ buttonError: true })
this.setState({ buttonError: true }) }
} }
} return (
return ( <div style={{ display: 'flex' }}>
<div style={{ display: 'flex' }}> {tableMeta.rowData[11] != null && check > -1 ?
{tableMeta.rowData[4] != null && check > -1 ? <a data-tip={tableMeta.rowData[11][check].message} data-for="value">
<a data-tip={tableMeta.rowData[4][check].message} data-for="enddate"> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> :
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> : }
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <ReactTooltip border={true} id="value" place="bottom" type="light" effect="solid" />
} </div >
<ReactTooltip border={true} id="enddate" place="bottom" type="light" effect="solid" /> );
</div > }
);
} }
} },
}, {
{ name: "Min Value",
name: "Min Value", options: {
options: { customBodyRender: (val, tableMeta) => {
customBodyRender: (val, tableMeta) => { let check = null
let check = null if (tableMeta.rowData[11] != null) {
if (tableMeta.rowData[4] != null) { check = tableMeta.rowData[11].findIndex((val) => val.field.includes('min_value'))
check = tableMeta.rowData[4].findIndex((val) => val.field.includes('end_date')) if (check > -1) {
if (check > -1) { this.setState({ buttonError: true })
this.setState({ buttonError: true }) }
} }
} return (
return ( <div style={{ display: 'flex' }}>
<div style={{ display: 'flex' }}> {tableMeta.rowData[11] != null && check > -1 ?
{tableMeta.rowData[4] != null && check > -1 ? <a data-tip={tableMeta.rowData[11][check].message} data-for="min_value">
<a data-tip={tableMeta.rowData[4][check].message} data-for="enddate"> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> :
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> : }
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <ReactTooltip border={true} id="min_value" place="bottom" type="light" effect="solid" />
} </div >
<ReactTooltip border={true} id="enddate" place="bottom" type="light" effect="solid" /> );
</div > }
);
} }
} },
}, {
{ name: "Max Value",
name: "Max Value", options: {
options: { customBodyRender: (val, tableMeta) => {
customBodyRender: (val, tableMeta) => { let check = null
let check = null if (tableMeta.rowData[11] != null) {
if (tableMeta.rowData[4] != null) { check = tableMeta.rowData[11].findIndex((val) => val.field.includes('max_value'))
check = tableMeta.rowData[4].findIndex((val) => val.field.includes('end_date')) if (check > -1) {
if (check > -1) { this.setState({ buttonError: true })
this.setState({ buttonError: true }) }
} }
} return (
return ( <div style={{ display: 'flex' }}>
<div style={{ display: 'flex' }}> {tableMeta.rowData[11] != null && check > -1 ?
{tableMeta.rowData[4] != null && check > -1 ? <a data-tip={tableMeta.rowData[11][check].message} data-for="max_value">
<a data-tip={tableMeta.rowData[4][check].message} data-for="enddate"> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> :
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> : }
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <ReactTooltip border={true} id="max_value" place="bottom" type="light" effect="solid" />
} </div >
<ReactTooltip border={true} id="enddate" place="bottom" type="light" effect="solid" /> );
</div > }
);
} }
} },
}, {
{ name: "Berlaku Mulai",
name: "Berlaku Mulai", options: {
options: { customBodyRender: (val, tableMeta) => {
customBodyRender: (val, tableMeta) => { let check = null
let check = null if (tableMeta.rowData[11] != null) {
if (tableMeta.rowData[4] != null) { check = tableMeta.rowData[11].findIndex((val) => val.field.includes('start_date'))
check = tableMeta.rowData[4].findIndex((val) => val.field.includes('end_date')) if (check > -1) {
if (check > -1) { this.setState({ buttonError: true })
this.setState({ buttonError: true }) }
} }
} return (
return ( <div style={{ display: 'flex' }}>
<div style={{ display: 'flex' }}> {tableMeta.rowData[11] != null && check > -1 ?
{tableMeta.rowData[4] != null && check > -1 ? <a data-tip={tableMeta.rowData[11][check].message} data-for="start_date">
<a data-tip={tableMeta.rowData[4][check].message} data-for="enddate"> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> :
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> : }
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <ReactTooltip border={true} id="start_date" place="bottom" type="light" effect="solid" />
} </div >
<ReactTooltip border={true} id="enddate" place="bottom" type="light" effect="solid" /> );
</div > }
);
} }
} },
}, {
{ name: "Berlaku Hingga",
name: "Berlaku Hingga", options: {
options: { customBodyRender: (val, tableMeta) => {
customBodyRender: (val, tableMeta) => { let check = null
let check = null if (tableMeta.rowData[11] != null) {
if (tableMeta.rowData[4] != null) { check = tableMeta.rowData[11].findIndex((val) => val.field.includes('end_date'))
check = tableMeta.rowData[4].findIndex((val) => val.field.includes('end_date')) if (check > -1) {
if (check > -1) { this.setState({ buttonError: true })
this.setState({ buttonError: true }) }
} }
} return (
return ( <div style={{ display: 'flex' }}>
<div style={{ display: 'flex' }}> {tableMeta.rowData[11] != null && check > -1 ?
{tableMeta.rowData[4] != null && check > -1 ? <a data-tip={tableMeta.rowData[11][check].message} data-for="enddate">
<a data-tip={tableMeta.rowData[4][check].message} data-for="enddate"> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> :
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
</a> : }
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> <ReactTooltip border={true} id="enddate" place="bottom" type="light" effect="solid" />
} </div >
<ReactTooltip border={true} id="enddate" place="bottom" type="light" effect="solid" /> );
</div > }
); }
},
{
name: "",
options: {
display: false
} }
} }
}, ]
{
name: "",
options: {
display: false
}
}
]
console.log(dataRow); console.log(dataRow);
this.setState({
dataLoaded: true,
cols: columns,
rows: dataRow
});
} else {
this.setState({
dataLoaded: true,
cols: [],
rows: []
});
}
} else {
this.setState({ this.setState({
dataLoaded: true, dataLoaded: true,
cols: columns, cols: [],
rows: dataRow rows: []
}); });
} }
console.log(response);
}) })
...@@ -450,6 +463,14 @@ export default class Parameter extends Component { ...@@ -450,6 +463,14 @@ export default class Parameter extends Component {
}); });
} }
uploadParameter() {
api.create().uploadParameter(this.state.payload).then(response => {
console.log(response)
this.getAllParameter()
this.setState({ visibleParameter: true })
})
}
render() { render() {
const columns = [{ const columns = [{
name: "Action", name: "Action",
...@@ -658,7 +679,7 @@ export default class Parameter extends Component { ...@@ -658,7 +679,7 @@ export default class Parameter extends Component {
<label style={{ color: 'white', fontSize: 16, alignSelf: 'center' }}>Preview Data</label> <label style={{ color: 'white', fontSize: 16, alignSelf: 'center' }}>Preview Data</label>
</div> </div>
<div style={{ padding: 25 }}> <div style={{ padding: 25 }}>
{/* {this.state.dataLoaded && ( {this.state.dataLoaded && (
<MuiThemeProvider theme={getMuiTheme()}> <MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable <MUIDataTable
theme={getMuiTheme()} theme={getMuiTheme()}
...@@ -667,7 +688,7 @@ export default class Parameter extends Component { ...@@ -667,7 +688,7 @@ export default class Parameter extends Component {
options={options2} options={options2}
/> />
</MuiThemeProvider> </MuiThemeProvider>
)} */} )}
</div> </div>
<div style={{ display: 'flex', width: '100%', placeContent: 'flex-end', padding: 20 }}> <div style={{ display: 'flex', width: '100%', placeContent: 'flex-end', padding: 20 }}>
<button <button
...@@ -707,7 +728,7 @@ export default class Parameter extends Component { ...@@ -707,7 +728,7 @@ export default class Parameter extends Component {
/> />
)} )}
{this.state.popupError && ( {this.state.popupError && (
<PopUpFailedSave onClickClose={()=> this.setState({ popupError: false })} /> <PopUpFailedSave onClickClose={() => this.setState({ popupError: false })} />
)} )}
{this.state.visibleUpload && ( {this.state.visibleUpload && (
<div className="test app-popup-show"> <div className="test app-popup-show">
......
src/container/MasterData/formUnitBisnis/CreateUnitBisnis.js
View file @ 784f249d
...@@ -261,7 +261,7 @@ export default class CreateUnitBisnis extends Component { ...@@ -261,7 +261,7 @@ export default class CreateUnitBisnis extends Component {
return ( return (
<div className="test app-popup-show" style={{ paddingTop: 100 }}> <div className="test app-popup-show" style={{ paddingTop: 100 }}>
<div className="popup-content background-white border-radius" style={{ borderRadius: 8 }}> <div className="popup-content background-white border-radius" style={{ borderRadius: 8 }}>
<div className="popup-panel grid grid-2x" style={{ backgroundColor: '#51c6ea', height: 64, borderTopRightRadius: 8, borderTopLeftRadius: 8 }}> <div className="popup-panel grid grid-2x main-color" style={{ height: 64, borderTopRightRadius: 8, borderTopLeftRadius: 8 }}>
<div className="col-1" style={{ maxWidth: "inherit", display: 'flex', alignItems: 'center' }}> <div className="col-1" style={{ maxWidth: "inherit", display: 'flex', alignItems: 'center' }}>
<div className="popup-title"> <div className="popup-title">
<span style={{ color: '#fff', fontSize: 16, fontWeight: 'bold' }}>Create Data</span> <span style={{ color: '#fff', fontSize: 16, fontWeight: 'bold' }}>Create Data</span>
......
src/container/Otorisasi/User/EditUser.js
View file @ 784f249d
...@@ -11,16 +11,16 @@ import * as R from 'ramda' ...@@ -11,16 +11,16 @@ import * as R from 'ramda'
const CustomCheckbox = withStyles({ const CustomCheckbox = withStyles({
root: { root: {
color: '#51c6ea',
'&$checked': {
color: '#51c6ea', color: '#51c6ea',
}, '&$checked': {
color: '#51c6ea',
},
}, },
checked: {}, checked: {},
})((props) => <Checkbox color="default" {...props} />); })((props) => <Checkbox color="default" {...props} />);
export default class EditUser extends Component { export default class EditUser extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
this.state = { this.state = {
...@@ -47,9 +47,9 @@ export default class EditUser extends Component { ...@@ -47,9 +47,9 @@ export default class EditUser extends Component {
} }
handleChecked() { handleChecked() {
this.setState({checked: !this.state.checked}) this.setState({ checked: !this.state.checked })
} }
componentDidMount() { componentDidMount() {
this.getDetailUser() this.getDetailUser()
this.getPerusahaan() this.getPerusahaan()
...@@ -59,9 +59,10 @@ export default class EditUser extends Component { ...@@ -59,9 +59,10 @@ export default class EditUser extends Component {
let data = this.state let data = this.state
let isDate = type !== '' ? true : false let isDate = type !== '' ? true : false
if (isDate && type === 'start_date') { if (isDate && type === 'start_date') {
this.setState({ ...data, tempData: { ...this.state.tempData, start_date: format(e, 'yyyy-MM-dd'), end_date: null }, this.setState({
...data, tempData: { ...this.state.tempData, start_date: format(e, 'yyyy-MM-dd'), end_date: null },
errorFullname: false, errorFullname: false,
errorEmail: false, errorEmail: false,
errorRoleName: false, errorRoleName: false,
errorStartDate: false, errorStartDate: false,
errorEndDate: false, errorEndDate: false,
...@@ -72,9 +73,10 @@ export default class EditUser extends Component { ...@@ -72,9 +73,10 @@ export default class EditUser extends Component {
msgErrorED: '', msgErrorED: '',
}) })
} else if (isDate && type === 'end_date') { } else if (isDate && type === 'end_date') {
this.setState({ ...data, tempData: { ...this.state.tempData, end_date: format(e, 'yyyy-MM-dd') }, this.setState({
...data, tempData: { ...this.state.tempData, end_date: format(e, 'yyyy-MM-dd') },
errorFullname: false, errorFullname: false,
errorEmail: false, errorEmail: false,
errorRoleName: false, errorRoleName: false,
errorStartDate: false, errorStartDate: false,
errorEndDate: false, errorEndDate: false,
...@@ -85,9 +87,10 @@ export default class EditUser extends Component { ...@@ -85,9 +87,10 @@ export default class EditUser extends Component {
msgErrorED: '', msgErrorED: '',
}) })
} else { } else {
this.setState({ ...data, tempData: { ...this.state.tempData, [e.target.name]: e.target.value }, this.setState({
...data, tempData: { ...this.state.tempData, [e.target.name]: e.target.value },
errorFullname: false, errorFullname: false,
errorEmail: false, errorEmail: false,
errorRoleName: false, errorRoleName: false,
errorStartDate: false, errorStartDate: false,
errorEndDate: false, errorEndDate: false,
...@@ -104,7 +107,7 @@ export default class EditUser extends Component { ...@@ -104,7 +107,7 @@ export default class EditUser extends Component {
api.create().getDetailUser(this.state.paramsId).then((response) => { api.create().getDetailUser(this.state.paramsId).then((response) => {
this.getRole() this.getRole()
if (response.data.status === 'success') { if (response.data.status === 'success') {
this.setState({tempData: response.data.data, company: response.data.data.company}) this.setState({ tempData: response.data.data, company: response.data.data.company })
console.log(response.data.data) console.log(response.data.data)
} else { } else {
alert(response.data.message) alert(response.data.message)
...@@ -114,16 +117,16 @@ export default class EditUser extends Component { ...@@ -114,16 +117,16 @@ export default class EditUser extends Component {
validasi() { validasi() {
if (R.isEmpty(this.state.tempData.fullname)) { if (R.isEmpty(this.state.tempData.fullname)) {
this.setState({errorFullname: true, msgErrorFN: 'Nama Lengkap tidak boleh kosong'}) this.setState({ errorFullname: true, msgErrorFN: 'Nama Lengkap tidak boleh kosong' })
} else if (R.isEmpty(this.state.tempData.email)) { } else if (R.isEmpty(this.state.tempData.email)) {
this.setState({errorEmail: true, msgErrorEM: 'Email tidak boleh kosong'}) this.setState({ errorEmail: true, msgErrorEM: 'Email tidak boleh kosong' })
} else if (R.isEmpty(this.state.tempData.role_name)) { } else if (R.isEmpty(this.state.tempData.role_name)) {
this.setState({errorRoleName: true, msgErrorRN: 'Role Name tidak boleh kosong'}) this.setState({ errorRoleName: true, msgErrorRN: 'Role Name tidak boleh kosong' })
} else if (R.isNil(this.state.tempData.start_date)) { } else if (R.isNil(this.state.tempData.start_date)) {
this.setState({errorStartDate: true, msgErrorSD: 'Start Date tidak boleh kosong'}) this.setState({ errorStartDate: true, msgErrorSD: 'Start Date tidak boleh kosong' })
} else if (R.isNil(this.state.tempData.end_date)) { } else if (R.isNil(this.state.tempData.end_date)) {
this.setState({errorEndDate: true, msgErrorED: 'End Date tidak boleh kosong'}) this.setState({ errorEndDate: true, msgErrorED: 'End Date tidak boleh kosong' })
} }
// else if (this.state.privileges.length < 1) { // else if (this.state.privileges.length < 1) {
// alert('Hak Akses belum di pilih !!') // alert('Hak Akses belum di pilih !!')
// } // }
...@@ -143,7 +146,7 @@ export default class EditUser extends Component { ...@@ -143,7 +146,7 @@ export default class EditUser extends Component {
"end_date": this.state.tempData.end_date "end_date": this.state.tempData.end_date
} }
api.create().updateUser(payload).then((response) => { api.create().updateUser(payload).then((response) => {
if (response.data.status === 'success') { if (response.data.status === 'success') {
this.props.onClickClose() this.props.onClickClose()
this.props.refresh() this.props.refresh()
...@@ -155,7 +158,7 @@ export default class EditUser extends Component { ...@@ -155,7 +158,7 @@ export default class EditUser extends Component {
getRole() { getRole() {
api.create().getRoleActive().then((response) => { api.create().getRoleActive().then((response) => {
if(response.data.status === 'success') { if (response.data.status === 'success') {
let data = response.data.data let data = response.data.data
let roleData = data.map((item) => { let roleData = data.map((item) => {
return { return {
...@@ -166,10 +169,10 @@ export default class EditUser extends Component { ...@@ -166,10 +169,10 @@ export default class EditUser extends Component {
let defaultProps = { let defaultProps = {
options: roleData, options: roleData,
getOptionLabel: (option) => titleCase(option.role_name), getOptionLabel: (option) => titleCase(option.role_name),
}; };
let index = roleData.findIndex((val) => val.role_id === this.state.tempData.role_id) let index = roleData.findIndex((val) => val.role_id === this.state.tempData.role_id)
this.setState({listRole: defaultProps, role: index === -1? roleData[0] : roleData[index]}) this.setState({ listRole: defaultProps, role: index === -1 ? roleData[0] : roleData[index] })
} else { } else {
alert(response.data.message) alert(response.data.message)
} }
...@@ -178,8 +181,8 @@ export default class EditUser extends Component { ...@@ -178,8 +181,8 @@ export default class EditUser extends Component {
getPerusahaan() { getPerusahaan() {
api.create().getPerusahaanHierarki().then((response) => { api.create().getPerusahaanHierarki().then((response) => {
if(response.data.status === 'success') { if (response.data.status === 'success') {
this.setState({listCompany: response.data.data}) this.setState({ listCompany: response.data.data })
console.log(response.data.data) console.log(response.data.data)
} }
}) })
...@@ -201,25 +204,33 @@ export default class EditUser extends Component { ...@@ -201,25 +204,33 @@ export default class EditUser extends Component {
this.setState({ company }) this.setState({ company })
} }
renderChildren = (item) => { renderChildren = (item, pad) => {
let padding = null
if (pad !== undefined) {
padding = pad
} else {
padding = 20
}
return ( return (
<ul> <ul>
{item.child.map((data, index) => { {item.child.map((data, index) => {
return ( return (
<li> <li>
<div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start' }}> {/* <Collapse timeout="auto" unmountOnExit in={data.company_id === this.state.selectedIndex}> */}
{!R.isNil(data.child) && <span onClick={() => this.setState({ selectedIndex: index === this.state.selectedIndex ? 0 : index })} style={{ marginLeft: 7, marginRight: 2 }}> <div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start', paddingLeft: R.isNil(data.child) ? (padding + 20) : padding }}>
{index === this.state.selectedIndex ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />} {!R.isNil(data.child) && <span onClick={() => this.setState({ selectedIndex: data.company_id === this.state.selectedIndex ? 0 : data.company_id })} style={{ marginLeft: 7, marginRight: 2 }}>
</span>} {data.company_id === this.state.selectedIndex ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />}
<span> </span>}
<CustomCheckbox <span>
checked={this.handleItemChecked(data)} <CustomCheckbox
onChange={() => this.handleItemClick(data)} checked={this.handleItemChecked(data)}
/> onChange={() => this.handleItemClick(data)}
</span> />
<Typography style={{ fontSize: 12 }}>{titleCase(data.company_name)}</Typography> </span>
</div> <Typography style={{ fontSize: 12 }}>{titleCase(data.company_name)}</Typography>
{!R.isNil(data.child) && this.renderChildren(data)} </div>
{!R.isNil(data.child) && this.renderChildren(data, padding + 20)}
{/* </Collapse> */}
</li> </li>
) )
})} })}
...@@ -227,12 +238,12 @@ export default class EditUser extends Component { ...@@ -227,12 +238,12 @@ export default class EditUser extends Component {
) )
} }
renderChild(item,index){ renderChild(item, index) {
return ( return (
item.child.map((items,indexs, paddingLeft) => { item.child.map((items, indexs, paddingLeft) => {
return ( return (
<div> <div>
<div style={{ paddingLeft: R.isNil(items.child)? 120 : 60, display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start' }}> <div style={{ paddingLeft: R.isNil(items.child) ? 120 : 60, display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start' }}>
{/* {item.sub_menu.length > 0 && <span onClick={() => this.setState({ selectedIndex: index === this.state.selectedIndex ? 0 : index })} style={{ marginLeft: 7, marginRight: 2 }}> {/* {item.sub_menu.length > 0 && <span onClick={() => this.setState({ selectedIndex: index === this.state.selectedIndex ? 0 : index })} style={{ marginLeft: 7, marginRight: 2 }}>
{index === this.state.selectedIndex ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />} {index === this.state.selectedIndex ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />}
</span>} */} </span>} */}
...@@ -245,7 +256,7 @@ export default class EditUser extends Component { ...@@ -245,7 +256,7 @@ export default class EditUser extends Component {
</span> </span>
<Typography style={{ fontSize: 12 }}>{titleCase(items.company_name)}</Typography> <Typography style={{ fontSize: 12 }}>{titleCase(items.company_name)}</Typography>
</div> </div>
{!R.isNil(items.child) && this.renderChild(items,indexs)} {!R.isNil(items.child) && this.renderChild(items, indexs)}
</div> </div>
) )
}) })
...@@ -282,7 +293,7 @@ export default class EditUser extends Component { ...@@ -282,7 +293,7 @@ export default class EditUser extends Component {
disabled disabled
// id="outlined-read-only-input" // id="outlined-read-only-input"
variant="filled" variant="filled"
value={this.state.tempData === null? '' : this.state.tempData.user_id} value={this.state.tempData === null ? '' : this.state.tempData.user_id}
onChange={(e) => null} onChange={(e) => null}
> >
{/* {periode.map((option) => ( {/* {periode.map((option) => (
...@@ -297,15 +308,15 @@ export default class EditUser extends Component { ...@@ -297,15 +308,15 @@ export default class EditUser extends Component {
<div className="column-2"> <div className="column-2">
<div className=""> <div className="">
<TextField <TextField
style={{ width: '100%' , marginTop: 7}} style={{ width: '100%', marginTop: 7 }}
id="fullname" id="fullname"
name="fullname" name="fullname"
label="Nama Lengkap" label="Nama Lengkap"
value={this.state.tempData === null? '' : this.state.tempData.fullname} value={this.state.tempData === null ? '' : this.state.tempData.fullname}
onChange={(e) => this.handleChange(e, '')} onChange={(e) => this.handleChange(e, '')}
// defaultValue="Default Value" // defaultValue="Default Value"
error={this.state.errorFullname} error={this.state.errorFullname}
helperText={this.state.msgErrorFN} helperText={this.state.msgErrorFN}
/> />
</div> </div>
</div> </div>
...@@ -315,14 +326,14 @@ export default class EditUser extends Component { ...@@ -315,14 +326,14 @@ export default class EditUser extends Component {
<div className="column-1"> <div className="column-1">
<div className="margin-bottom-20px"> <div className="margin-bottom-20px">
<TextField <TextField
style={{ width: '100%' , marginTop: 7}} style={{ width: '100%', marginTop: 7 }}
id="email" id="email"
name="email" name="email"
label="Email" label="Email"
value={this.state.tempData === null? '' : this.state.tempData.email} value={this.state.tempData === null ? '' : this.state.tempData.email}
onChange={(e) => this.handleChange(e, '')} onChange={(e) => this.handleChange(e, '')}
error={this.state.errorEmail} error={this.state.errorEmail}
helperText={this.state.msgErrorEM} helperText={this.state.msgErrorEM}
/> />
</div> </div>
</div> </div>
...@@ -332,10 +343,10 @@ export default class EditUser extends Component { ...@@ -332,10 +343,10 @@ export default class EditUser extends Component {
<Autocomplete <Autocomplete
{...this.state.listRole} {...this.state.listRole}
id="role" id="role"
onChange={(event, newInputValue) => this.setState({role: newInputValue})} onChange={(event, newInputValue) => this.setState({ role: newInputValue })}
debug debug
renderInput={(params) => <TextField {...params} label="Role" margin="normal" style={{marginTop: 7}}/>} renderInput={(params) => <TextField {...params} label="Role" margin="normal" style={{ marginTop: 7 }} />}
value={this.state.role} value={this.state.role}
/> />
</div> </div>
...@@ -394,7 +405,7 @@ export default class EditUser extends Component { ...@@ -394,7 +405,7 @@ export default class EditUser extends Component {
disabled disabled
// id="outlined-read-only-input" // id="outlined-read-only-input"
variant="filled" variant="filled"
value={this.state.tempData === null? '' : this.state.tempData.status} value={this.state.tempData === null ? '' : this.state.tempData.status}
> >
{/* {periode.map((option) => ( {/* {periode.map((option) => (
<MenuItem key={option.value} value={option.value}> <MenuItem key={option.value} value={option.value}>
...@@ -415,7 +426,7 @@ export default class EditUser extends Component { ...@@ -415,7 +426,7 @@ export default class EditUser extends Component {
disabled disabled
// id="outlined-read-only-input" // id="outlined-read-only-input"
variant="filled" variant="filled"
value={this.state.tempData === null? '' : this.state.tempData.is_expired} value={this.state.tempData === null ? '' : this.state.tempData.is_expired}
> >
{/* {periode.map((option) => ( {/* {periode.map((option) => (
<MenuItem key={option.value} value={option.value}> <MenuItem key={option.value} value={option.value}>
...@@ -426,16 +437,16 @@ export default class EditUser extends Component { ...@@ -426,16 +437,16 @@ export default class EditUser extends Component {
</div> </div>
</div> </div>
</div> </div>
<div style={{flexDirection:'column', display: 'flex', paddingLeft: 20, paddingRight: 20 }}> <div style={{ flexDirection: 'column', display: 'flex', paddingLeft: 20, paddingRight: 20 }}>
<Typography style={{fontSize: 12}}>{`Dibuat : ${this.state.tempData === null? '' : this.state.tempData.created}`}</Typography> <Typography style={{ fontSize: 12 }}>{`Dibuat : ${this.state.tempData === null ? '' : this.state.tempData.created}`}</Typography>
<Typography style={{fontSize: 12}}>{`Diubah: ${this.state.tempData === null? '' : this.state.tempData.updated}`}</Typography> <Typography style={{ fontSize: 12 }}>{`Diubah: ${this.state.tempData === null ? '' : this.state.tempData.updated}`}</Typography>
</div> </div>
<Divider style={{margin: 20}}/> <Divider style={{ margin: 20 }} />
<div style={{paddingLeft: 20, paddingRight: 20}}> <div style={{ paddingLeft: 20, paddingRight: 20 }}>
<h5>Otorisasi Perusahaan</h5> <h5>Otorisasi Perusahaan</h5>
<div style={{paddingLeft: 10, overflow:'scroll', height: '25vh'}}> <div style={{ paddingLeft: 10, overflow: 'scroll', height: '25vh' }}>
{this.state.listCompany.map((item,index) => { {this.state.listCompany.map((item, index) => {
return( return (
<div> <div>
<ul> <ul>
<li> <li>
...@@ -451,7 +462,7 @@ export default class EditUser extends Component { ...@@ -451,7 +462,7 @@ export default class EditUser extends Component {
</span> </span>
<Typography style={{ fontSize: 12 }}>{titleCase(item.company_name)}</Typography> <Typography style={{ fontSize: 12 }}>{titleCase(item.company_name)}</Typography>
</div> </div>
{!R.isNil(item.child) && this.renderChildren(item, semriwing)} {!R.isNil(item.child) && this.renderChildren(item)}
</li> </li>
</ul> </ul>
{/* <div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start' }}> {/* <div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start' }}>
...@@ -471,7 +482,7 @@ export default class EditUser extends Component { ...@@ -471,7 +482,7 @@ export default class EditUser extends Component {
) )
})} })}
</div> </div>
</div> </div>
<div className="border-top grid grid-2x" style={{ height: 56, backgroundColor: '#f5f5f5', paddingLeft: 20, paddingRight: 20 }}> <div className="border-top grid grid-2x" style={{ height: 56, backgroundColor: '#f5f5f5', paddingLeft: 20, paddingRight: 20 }}>
<div className="column-1" style={{ alignSelf: 'center' }}> <div className="column-1" style={{ alignSelf: 'center' }}>
...@@ -481,7 +492,7 @@ export default class EditUser extends Component { ...@@ -481,7 +492,7 @@ export default class EditUser extends Component {
</div> </div>
</button> </button>
</div> </div>
<div className="column-2" style={{display: 'flex', justifyContent: 'flex-end', alignItems: 'center'}}> <div className="column-2" style={{ display: 'flex', justifyContent: 'flex-end', alignItems: 'center' }}>
<button onClick={() => this.validasi()}> <button onClick={() => this.validasi()}>
<div style={{ width: 102, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}> <div style={{ width: 102, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<span style={{ color: '#fff', fontSize: 11 }}>Simpan</span> <span style={{ color: '#fff', fontSize: 11 }}>Simpan</span>
......
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