Skip to content

T
Tia-dev
Commit 867ddf10 authored by Rifka Kurnia Irfiana's avatar Rifka Kurnia Irfiana
Browse files
Options

Merge branch 'master' of http://103.44.149.204/d.arizona/tia-dev into rifka

parents 02873894 90ca8295
Hide whitespace changes
Inline Side-by-side
Showing with 914 additions and 396 deletions
src/container/Home.js
View file @ 867ddf10
...@@ -483,7 +483,7 @@ export default function MiniDrawer() { ...@@ -483,7 +483,7 @@ export default function MiniDrawer() {
<div style={{ width: '100%', textAlign: '-webkit-center', marginTop: -45, display: 'flex', justifyContent: 'center' }}> <div style={{ width: '100%', textAlign: '-webkit-center', marginTop: -45, display: 'flex', justifyContent: 'center' }}>
<div className={"sub-color"} style={{ width: 90, height: 90, borderRadius: 50, display: 'flex', justifyContent: 'center' }}> <div className={"sub-color"} style={{ width: 90, height: 90, borderRadius: 50, display: 'flex', justifyContent: 'center' }}>
<div style={{ width: 72, height: 72, backgroundColor: '#838383', borderRadius: 50, alignSelf: 'center' }}> <div style={{ width: 72, height: 72, backgroundColor: '#838383', borderRadius: 50, alignSelf: 'center' }}>
<img src={userPhoto} style={{ width: 72, height: 72, borderRadius: 50 }} /> {userPhoto === "" ? null : <img src={userPhoto} style={{ width: 72, height: 72, borderRadius: 50 }} />}
</div> </div>
</div> </div>
......
src/container/Login.js
View file @ 867ddf10
...@@ -75,25 +75,29 @@ class Login extends Component { ...@@ -75,25 +75,29 @@ class Login extends Component {
"password": this.state.password "password": this.state.password
} }
api.create().login(payload).then((response) => { api.create().login(payload).then((response) => {
if (response.data.status === 'success') { if (response.data) {
console.log(response.data.data) if (response.data.status === 'success') {
localStorage.setItem(Constant.TOKEN, response.data.data.token) console.log(response.data.data)
localStorage.setItem(Constant.USER, response.data.data.user_id) localStorage.setItem(Constant.TOKEN, response.data.data.token)
if (this.state.rememberMe) { localStorage.setItem(Constant.USER, response.data.data.user_id)
localStorage.setItem(Constant.EMAIL, this.state.email) if (this.state.rememberMe) {
localStorage.setItem(Constant.PASSWORD, this.state.password) localStorage.setItem(Constant.EMAIL, this.state.email)
// console.log(this.state.email, this.state.password) localStorage.setItem(Constant.PASSWORD, this.state.password)
// console.log(this.state.email, this.state.password)
} else {
localStorage.setItem(Constant.EMAIL, '')
localStorage.setItem(Constant.PASSWORD, '')
}
this.props.history.push('/home/beranda')
} else { } else {
localStorage.setItem(Constant.EMAIL, '') if (response.data.message == 'Kata sandi tidak sesuai.') {
localStorage.setItem(Constant.PASSWORD, '') this.setState({ errorPassword: true, msgPassword: response.data.message })
} else {
this.setState({ errorEmail: true, msgEmail: response.data.message })
}
} }
this.props.history.push('/home/beranda')
} else { } else {
if (response.data.message == 'Kata sandi tidak sesuai.') { alert(response.problem)
this.setState({ errorPassword: true, msgPassword: response.data.message })
} else {
this.setState({ errorEmail: true, msgEmail: response.data.message })
}
} }
}) })
} }
...@@ -185,7 +189,7 @@ class Login extends Component { ...@@ -185,7 +189,7 @@ class Login extends Component {
borderColor: 'transparent', borderColor: 'transparent',
}} }}
disabled={this.state.email.trim() == '' && this.state.password.trim() == '' ? true : false} disabled={this.state.email.trim() == '' && this.state.password.trim() == '' ? true : false}
// onClick={() => this.validateLogin()} // onClick={() => this.validateLogin()}
> >
<Button name="submit" variant="contained" disabled={this.state.email.trim() == '' && this.state.password.trim() == '' ? true : false} style={{ marginTop: 23, width: '100%', height: 35, borderRadius: 4, color: this.state.email.trim() == '' && this.state.password.trim() == '' ? '#4b4b4b' : '#fff', backgroundColor: this.state.email.trim() == '' && this.state.password.trim() == '' ? '#d8d8d8' : '#51c6ea' }}> <Button name="submit" variant="contained" disabled={this.state.email.trim() == '' && this.state.password.trim() == '' ? true : false} style={{ marginTop: 23, width: '100%', height: 35, borderRadius: 4, color: this.state.email.trim() == '' && this.state.password.trim() == '' ? '#4b4b4b' : '#fff', backgroundColor: this.state.email.trim() == '' && this.state.password.trim() == '' ? '#d8d8d8' : '#51c6ea' }}>
<Typography style={{ fontSize: 12, fontFamily: 'Nunito Sans, sans-serif' }}>Login</Typography> <Typography style={{ fontSize: 12, fontFamily: 'Nunito Sans, sans-serif' }}>Login</Typography>
......
src/container/MasterData/Parameter/CreateParameter.js
View file @ 867ddf10
...@@ -54,18 +54,22 @@ export default class CreateParameter extends Component { ...@@ -54,18 +54,22 @@ export default class CreateParameter extends Component {
componentDidMount() { componentDidMount() {
if (this.props.type === 'edit') { if (this.props.type === 'edit') {
this.setState({ this.setState({
getSettingTypeID: this.props.data.setting_type_id, getSettingTypeID: this.props.data[0],
}) })
this.getDetailParameter() this.getDetailParameter()
this.getParameterByGroup(this.props.data.setting_group_id)
} else { } else {
let date = format(new Date, 'yyyy-MM-dd')
this.setState({
startDate: date,
endDate: date
})
this.getDataGroup() this.getDataGroup()
this.getDataPerusahaan() this.getDataPerusahaan()
} }
} }
getDetailParameter() { getDetailParameter() {
api.create().getDetailParameter(this.props.data.setting_id).then((response) => { api.create().getDetailParameter(this.props.data[0]).then((response) => {
console.log(response); console.log(response);
if (response.data.status === 'success') { if (response.data.status === 'success') {
let data = response.data.data let data = response.data.data
...@@ -74,7 +78,7 @@ export default class CreateParameter extends Component { ...@@ -74,7 +78,7 @@ export default class CreateParameter extends Component {
getSettingGroupID: data.setting_group_id, getSettingGroupID: data.setting_group_id,
getCompanyID: data.company_id, getCompanyID: data.company_id,
settingType: data.setting_type, settingType: data.setting_type,
}, () => this.getAllGroup(), this.getPerusahaan()) }, () => this.getAllGroup(), this.getPerusahaan(), this.getParameterByGroup(data.setting_group_id))
} else { } else {
alert(response.data.message) alert(response.data.message)
} }
......
src/container/MasterData/Parameter/Parameter.js
View file @ 867ddf10
...@@ -36,10 +36,11 @@ export default class Parameter extends Component { ...@@ -36,10 +36,11 @@ export default class Parameter extends Component {
getAllParameter() { getAllParameter() {
api.create().getAllParameter().then(response => { api.create().getAllParameter().then(response => {
if (response.data.status === "success") { if (response.data.status === "success") {
console.log(response);
let data = response.data.data let data = response.data.data
let listData = data.map((item, index) => { let listData = data.map((item, index) => {
return [ return [
index, item.setting_id,
item.setting_group, item.setting_group,
item.setting_type, item.setting_type,
item.company_name, item.company_name,
...@@ -58,15 +59,15 @@ export default class Parameter extends Component { ...@@ -58,15 +59,15 @@ export default class Parameter extends Component {
}) })
} }
openPopUp(index, type) { openPopUp(rowData, type) {
if (type === 'edit') { if (type === 'edit') {
this.setState({ this.setState({
selectIndex: index, rowData: rowData,
visibleEdit: true visibleEdit: true
}) })
} else { } else {
this.setState({ this.setState({
data: this.state.data[index], rowData: rowData,
visibleCreate: true visibleCreate: true
}) })
} }
...@@ -510,6 +511,7 @@ export default class Parameter extends Component { ...@@ -510,6 +511,7 @@ export default class Parameter extends Component {
const columns = [{ const columns = [{
name: "Action", name: "Action",
options: { options: {
sort: false,
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
...@@ -519,7 +521,8 @@ export default class Parameter extends Component { ...@@ -519,7 +521,8 @@ export default class Parameter extends Component {
cursor: 'pointer', cursor: 'pointer',
borderColor: 'transparent' borderColor: 'transparent'
}} }}
onClick={() => this.openPopUp(tableMeta.rowIndex, 'edit')} onClick={() => this.openPopUp(tableMeta.rowData, 'edit')}
// onClick={()=> console.log(tableMeta)}
> >
<img src={Images.editCopy} /> <img src={Images.editCopy} />
</button> </button>
...@@ -641,8 +644,8 @@ export default class Parameter extends Component { ...@@ -641,8 +644,8 @@ export default class Parameter extends Component {
{this.state.visibleParameter === true ? {this.state.visibleParameter === true ?
<div> <div>
<div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', paddingRight: 25, paddingLeft: 25, marginTop: -150 }}> <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', paddingRight: 25, paddingLeft: 25, marginTop: -150 }}>
<label style={{ color: 'white', fontSize: 16, alignSelf: 'center' }}>Parameter</label> <label style={{ color: 'white', fontSize: 16, alignSelf: 'center', width: '20%', }}>Parameter</label>
<div style={{ color: 'white', width: '50%', height: 37, display: 'flex', backgroundColor: 'white', borderWidth: 2, alignItems: 'center', borderRadius: 6, paddingLeft: 5, paddingRight: 5 }}> <div style={{ color: 'white', width: '50%', height: 37, display: 'flex', backgroundColor: 'white', borderWidth: 2, alignItems: 'center', borderRadius: 6, paddingLeft: 5, paddingRight: 5, alignSelf: 'center' }}>
<img src={Images.searchBlack} style={{ marginRight: 10 }} /> <img src={Images.searchBlack} style={{ marginRight: 10 }} />
<InputBase <InputBase
style={{ width: '100%' }} style={{ width: '100%' }}
...@@ -652,7 +655,7 @@ export default class Parameter extends Component { ...@@ -652,7 +655,7 @@ export default class Parameter extends Component {
inputProps={{ 'aria-label': 'naked' }} inputProps={{ 'aria-label': 'naked' }}
/> />
</div> </div>
<div style={{ width: '20%', justifyContent: 'space-around', display: 'flex' }}> <div style={{ width: '30%', justifyContent: 'flex-end', display: 'flex', flexFlow: 'wrap' }}>
<a data-tip={'Download Template'} data-for="template"> <a data-tip={'Download Template'} data-for="template">
<button <button
style={{ style={{
...@@ -773,7 +776,7 @@ export default class Parameter extends Component { ...@@ -773,7 +776,7 @@ export default class Parameter extends Component {
<CreateParameter <CreateParameter
type={"edit"} type={"edit"}
onClickClose={() => this.setState({ visibleEdit: false })} onClickClose={() => this.setState({ visibleEdit: false })}
data={this.state.data[this.state.selectIndex]} data={this.state.rowData}
updateParameter={this.updateParameter.bind(this)} updateParameter={this.updateParameter.bind(this)}
/> />
)} )}
......
src/container/MasterData/Perusahaan/CreatePerusahaan.js
View file @ 867ddf10
...@@ -112,7 +112,7 @@ export default class CreatePerusahaan extends Component { ...@@ -112,7 +112,7 @@ export default class CreatePerusahaan 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>
...@@ -230,8 +230,8 @@ export default class CreatePerusahaan extends Component { ...@@ -230,8 +230,8 @@ export default class CreatePerusahaan extends Component {
</div> </div>
<div className="margin-top-10px" style={{ padding: 10, borderRadius: 5 }}> <div className="margin-top-10px" style={{ padding: 10, borderRadius: 5 }}>
<Typography style={{ fontSize: 11 }}>Dibuat : Admin - 21 Jul 2020, 18:45</Typography> <Typography style={{ fontSize: 11 }}>Dibuat : </Typography>
<Typography style={{ fontSize: 11 }}>Diubah : Admin - 21 Jul 2020, 18:45</Typography> <Typography style={{ fontSize: 11 }}>Diubah : </Typography>
</div> </div>
</div> </div>
......
src/container/MasterData/Perusahaan/EditPerusahaan.js
View file @ 867ddf10
...@@ -13,11 +13,13 @@ export default class EditPerusahaan extends Component { ...@@ -13,11 +13,13 @@ export default class EditPerusahaan extends Component {
this.state = { this.state = {
id: '', id: '',
company: '', company: '',
companyID: '',
parent: '', parent: '',
unitBisnis: '', unitBisnis: '',
totalReport: '', totalReport: '',
startDate: '', startDate: '',
endDate: '', endDate: '',
status: '',
types: null, types: null,
getTypes: null, getTypes: null,
perusahaan: null, perusahaan: null,
...@@ -166,7 +168,7 @@ export default class EditPerusahaan extends Component { ...@@ -166,7 +168,7 @@ export default class EditPerusahaan extends Component {
return ( return (
<div className="test app-popup-show"> <div className="test app-popup-show">
<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' }}>Ubah Data</span> <span style={{ color: '#fff', fontSize: 16, fontWeight: 'bold' }}>Ubah Data</span>
...@@ -189,7 +191,7 @@ export default class EditPerusahaan extends Component { ...@@ -189,7 +191,7 @@ export default class EditPerusahaan extends Component {
<div style={{ backgroundColor: '#e8e8e8', padding: 10, borderRadius: 5 }}> <div style={{ backgroundColor: '#e8e8e8', padding: 10, borderRadius: 5 }}>
<TextField <TextField
style={{ width: '100%' }} style={{ width: '100%' }}
value={this.state.businessID} value={this.state.companyID}
id="id" id="id"
label="ID" label="ID"
disabled disabled
......
src/container/MasterData/UnitBisnis.js
View file @ 867ddf10
...@@ -64,112 +64,114 @@ export default class UnitBisnis extends Component { ...@@ -64,112 +64,114 @@ export default class UnitBisnis extends Component {
} }
this.setState({ payload: body, buttonError: false }) this.setState({ payload: body, buttonError: false })
api.create().checkUploadUnitBisnis(body).then(response => { api.create().checkUploadUnitBisnis(body).then(response => {
if (response.data.status === "success") { if (response.data) {
let dataRow = response.data.data.map((item, index) => { if (response.data.status === "success") {
return [ let dataRow = response.data.data.map((item, index) => {
index + 1, return [
item.business_unit_name, index + 1,
item.start_date, item.business_unit_name,
item.end_date, item.start_date,
item.error item.end_date,
] item.error
}) ]
let columns = [ })
"Data Ke-", let columns = [
{ "Data Ke-",
name: "Unit Bisnis", {
options: { name: "Unit Bisnis",
customBodyRender: (val, tableMeta) => { options: {
let check = null customBodyRender: (val, tableMeta) => {
if (tableMeta.rowData[4] != null) { let check = null
check = tableMeta.rowData[4].findIndex((val) => val.field.includes('business_unit_name')) if (tableMeta.rowData[4] != null) {
if (check > -1) { check = tableMeta.rowData[4].findIndex((val) => val.field.includes('business_unit_name'))
this.setState({ buttonError: true }) if (check > -1) {
this.setState({ buttonError: true })
}
} }
} return (
return ( <div style={{ display: 'flex' }}>
<div style={{ display: 'flex' }}> {tableMeta.rowData[4] != null && check > -1 ?
{tableMeta.rowData[4] != null && check > -1 ? <a data-tip={tableMeta.rowData[4][check].message} data-for="unitbisnis">
<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="unitbisnis" place="bottom" type="light" effect="solid" />
} </div >
<ReactTooltip border={true} id="unitbisnis" 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[4] != null) {
if (tableMeta.rowData[4] != null) { check = tableMeta.rowData[4].findIndex((val) => val.field.includes('start_date'))
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[4] != null && check > -1 ?
{tableMeta.rowData[4] != null && check > -1 ? <a data-tip={tableMeta.rowData[4][check].message} data-for="startdate">
<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="startdate" place="bottom" type="light" effect="solid" />
} </div >
<ReactTooltip border={true} id="startdate" place="bottom" type="light" effect="solid" /> );
</div > }
);
} }
} },
}, {
{ name: "Berakhir Hingga",
name: "Berakhir Hingga", options: {
options: { customBodyRender: (val, tableMeta) => {
customBodyRender: (val, tableMeta) => { let check = null
let check = null if (tableMeta.rowData[4] != null) {
if (tableMeta.rowData[4] != null) { check = tableMeta.rowData[4].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[4] != null && check > -1 ?
{tableMeta.rowData[4] != null && check > -1 ? <a data-tip={tableMeta.rowData[4][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({ this.setState({
dataLoaded: true, dataLoaded: false,
cols: columns,
rows: dataRow
}); });
} }
console.log(response);
}) })
} }
...@@ -300,6 +302,7 @@ export default class UnitBisnis extends Component { ...@@ -300,6 +302,7 @@ export default class UnitBisnis extends Component {
const columns = [{ const columns = [{
name: "Action", name: "Action",
options: { options: {
sort: false,
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
......
src/container/MasterData/formReportItems/VisualReportItems.js
View file @ 867ddf10
...@@ -143,8 +143,10 @@ export default class VisualReportItems extends Component { ...@@ -143,8 +143,10 @@ export default class VisualReportItems extends Component {
} }
api.create().getItemReportHierarki(payload).then((response) => { api.create().getItemReportHierarki(payload).then((response) => {
console.log(response.data) console.log(response.data)
if (response.data.status == 'success') { if (response.data) {
this.setState({ items: response.data.data }) if (response.data.status == 'success') {
this.setState({ items: response.data.data })
}
} }
}) })
} }
...@@ -219,7 +221,7 @@ export default class VisualReportItems extends Component { ...@@ -219,7 +221,7 @@ export default class VisualReportItems extends Component {
id="report" id="report"
onChange={(event, newInputValue) => this.setState({ report: newInputValue }, () => this.getItemHierarki())} onChange={(event, newInputValue) => this.setState({ report: newInputValue }, () => this.getItemHierarki())}
debug debug
disableClearable
renderInput={(params) => <TextField {...params} label="Jenis Laporan" margin="normal" style={{ marginTop: 7 }} />} renderInput={(params) => <TextField {...params} label="Jenis Laporan" margin="normal" style={{ marginTop: 7 }} />}
value={this.state.report} value={this.state.report}
/> />
...@@ -230,8 +232,8 @@ export default class VisualReportItems extends Component { ...@@ -230,8 +232,8 @@ export default class VisualReportItems extends Component {
id="company" id="company"
onChange={(event, newInputValue) => this.setState({ company: newInputValue }, () => this.getItemHierarki())} onChange={(event, newInputValue) => this.setState({ company: newInputValue }, () => this.getItemHierarki())}
debug debug
disableClearable
renderInput={(params) => <TextField {...params} label="Compan" margin="normal" style={{ marginTop: 7 }} />} renderInput={(params) => <TextField {...params} label="Company" margin="normal" style={{ marginTop: 7 }} />}
value={this.state.company} value={this.state.company}
/> />
</div> </div>
......
src/container/MasterData/formUnitBisnis/CreateUnitBisnis.js
View file @ 867ddf10
...@@ -119,9 +119,9 @@ export default class CreateUnitBisnis extends Component { ...@@ -119,9 +119,9 @@ export default class CreateUnitBisnis extends Component {
validasiCreate() { validasiCreate() {
if (R.isEmpty(this.state.name)) { if (R.isEmpty(this.state.name)) {
this.setState({ errorName: true, msgErrorName: 'Unit Bisnis tidak boleh kosong' }) this.setState({ errorName: true, msgErrorName: 'Unit Bisnis tidak boleh kosong' })
} else if (R.isEmpty(this.state.startDate)) { } else if (R.isNil(this.state.startDate)) {
this.setState({ errorStartDate: true, msgErrorStartDate: 'Berlaku Mulai tidak boleh kosong' }) this.setState({ errorStartDate: true, msgErrorStartDate: 'Berlaku Mulai tidak boleh kosong' })
} else if (R.isEmpty(this.state.endDate)) { } else if (R.isNil(this.state.endDate)) {
this.setState({ errorEndDate: true, msgErrorEndDate: 'Berkahir Hingga tidak boleh kosong' }) this.setState({ errorEndDate: true, msgErrorEndDate: 'Berkahir Hingga tidak boleh kosong' })
} else { } else {
let payload = { let payload = {
......
src/container/Otorisasi/User.js
View file @ 867ddf10
...@@ -102,136 +102,138 @@ export default class UserRole extends Component { ...@@ -102,136 +102,138 @@ export default class UserRole extends Component {
this.setState({ payload: body }) this.setState({ payload: body })
api.create().checkUploadUser(body).then(response => { api.create().checkUploadUser(body).then(response => {
console.log(response); console.log(response);
if (response.data.status === "success") { if (response.data) {
let dataRow = response.data.data.map((item, index) => { if (response.data.status === "success") {
return [ let dataRow = response.data.data.map((item, index) => {
index + 1, return [
item.fullname, index + 1,
item.email, item.fullname,
item.role, item.email,
item.start_date, item.role,
item.end_date, item.start_date,
item.error item.end_date,
] item.error
}) ]
})
let columns = [
"Data Ke-", let columns = [
"Nama Lengkap", "Data Ke-",
{ "Nama Lengkap",
name: "Email", {
options: { name: "Email",
customBodyRender: (val, tableMeta) => { options: {
console.log(tableMeta) customBodyRender: (val, tableMeta) => {
let check = null console.log(tableMeta)
if (tableMeta.rowData[6] != null) { let check = null
check = tableMeta.rowData[6].findIndex((val) => val.field.includes('email')) if (tableMeta.rowData[6] != null) {
if (check > -1) { check = tableMeta.rowData[6].findIndex((val) => val.field.includes('email'))
this.setState({ buttonError: true }) if (check > -1) {
this.setState({ buttonError: true })
}
}
return (
<div style={{ display: 'flex' }}>
{tableMeta.rowData[6] != null && check > -1 ?
<a data-tip={tableMeta.rowData[6][check].message} data-for="email">
<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="email" place="bottom" type="light" effect="solid" />
</div >
);
} }
} }
return ( },
<div style={{ display: 'flex' }}> {
{tableMeta.rowData[6] != null && check > -1 ? name: "Role",
<a data-tip={tableMeta.rowData[6][check].message} data-for="email"> options: {
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> customBodyRender: (val, tableMeta) => {
</a> : let check = null
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> if (tableMeta.rowData[6] != null) {
check = tableMeta.rowData[6].findIndex((val) => val.field.includes('role'))
if (check > -1) {
this.setState({ buttonError: true })
}
} }
<ReactTooltip border={true} id="email" place="bottom" type="light" effect="solid" /> return (
</div > <div style={{ display: 'flex' }}>
); {tableMeta.rowData[6] != null && check > -1 ?
} <a data-tip={tableMeta.rowData[6][check].message} data-for="role">
} <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
}, </a> :
{ <span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
name: "Role", }
options: { <ReactTooltip border={true} id="role" place="bottom" type="light" effect="solid" />
customBodyRender: (val, tableMeta) => { </div >
let check = null );
if (tableMeta.rowData[6] != null) {
check = tableMeta.rowData[6].findIndex((val) => val.field.includes('role'))
if (check > -1) {
this.setState({ buttonError: true })
} }
} }
return ( },
<div style={{ display: 'flex' }}> {
{tableMeta.rowData[6] != null && check > -1 ? name: "Berlaku Mulai",
<a data-tip={tableMeta.rowData[6][check].message} data-for="role"> options: {
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> customBodyRender: (val, tableMeta) => {
</a> : let check = null
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> if (tableMeta.rowData[6] != null) {
check = tableMeta.rowData[6].findIndex((val) => val.field.includes('start_date'))
if (check > -1) {
this.setState({ buttonError: true })
}
} }
<ReactTooltip border={true} id="role" place="bottom" type="light" effect="solid" /> return (
</div > <div style={{ display: 'flex' }}>
); {tableMeta.rowData[6] != null && check > -1 ?
} <a data-tip={tableMeta.rowData[6][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>
name: "Berlaku Mulai", }
options: { <ReactTooltip border={true} id="startdate" place="bottom" type="light" effect="solid" />
customBodyRender: (val, tableMeta) => { </div >
let check = null );
if (tableMeta.rowData[6] != null) {
check = tableMeta.rowData[6].findIndex((val) => val.field.includes('start_date'))
if (check > -1) {
this.setState({ buttonError: true })
} }
} }
return ( },
<div style={{ display: 'flex' }}> {
{tableMeta.rowData[6] != null && check > -1 ? name: "Berakhir Hingga",
<a data-tip={tableMeta.rowData[6][check].message} data-for="startdate"> options: {
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> customBodyRender: (val, tableMeta) => {
</a> : let check = null
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> if (tableMeta.rowData[6] != null) {
check = tableMeta.rowData[6].findIndex((val) => val.field.includes('end_date'))
if (check > -1) {
this.setState({ buttonError: true })
}
} }
<ReactTooltip border={true} id="startdate" place="bottom" type="light" effect="solid" /> return (
</div > <div style={{ display: 'flex' }}>
); {tableMeta.rowData[6] != null && check > -1 ?
} <a data-tip={tableMeta.rowData[6][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>
name: "Berakhir Hingga", }
options: { <ReactTooltip border={true} id="enddate" place="bottom" type="light" effect="solid" />
customBodyRender: (val, tableMeta) => { </div >
let check = null );
if (tableMeta.rowData[6] != null) {
check = tableMeta.rowData[6].findIndex((val) => val.field.includes('end_date'))
if (check > -1) {
this.setState({ buttonError: true })
} }
} }
return ( },
<div style={{ display: 'flex' }}> {
{tableMeta.rowData[6] != null && check > -1 ? name: "",
<a data-tip={tableMeta.rowData[6][check].message} data-for="enddate"> options: {
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span> display: false
</a> : }
<span style={{ color: check != null && check > -1 ? "red" : 'black' }}>{val}</span>
}
<ReactTooltip border={true} id="enddate" place="bottom" type="light" effect="solid" />
</div >
);
} }
} ]
},
{ this.setState({
name: "", dataLoaded: true,
options: { cols: columns,
display: false rows: dataRow
} });
} }
]
this.setState({
dataLoaded: true,
cols: columns,
rows: dataRow
});
} }
}) })
} }
...@@ -261,7 +263,7 @@ export default class UserRole extends Component { ...@@ -261,7 +263,7 @@ export default class UserRole 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 = 'Data User.xlsx'; a.download = 'User.xlsx';
a.click(); a.click();
} }
} }
......
src/container/Otorisasi/User/AddUser.js
View file @ 867ddf10
...@@ -13,16 +13,26 @@ import Images from '../../../assets/Images'; ...@@ -13,16 +13,26 @@ import Images from '../../../assets/Images';
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} />);
const CustomCheckboxDisabled = withStyles({
root: {
color: '#d5d5d5',
'&$checked': {
color: '#d5d5d5',
},
},
checked: {},
})((props) => <Checkbox color="default" {...props} />);
export default class AddUser extends Component { export default class AddUser extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
this.state = { this.state = {
...@@ -54,12 +64,22 @@ export default class AddUser extends Component { ...@@ -54,12 +64,22 @@ export default class AddUser extends Component {
} }
handleChecked() { handleChecked() {
this.setState({checked: !this.state.checked}) this.setState({ checked: !this.state.checked })
} }
componentDidMount() { componentDidMount() {
this.getRole() this.getRole()
this.getPerusahaan() this.getPerusahaan()
if (this.props.type === 'edit') {
//
} else {
let date = format(new Date, 'yyyy-MM-dd')
console.log(date);
this.setState({
startDate: date,
endDate: date
})
}
} }
handleChange(e, type) { handleChange(e, type) {
...@@ -67,36 +87,73 @@ export default class AddUser extends Component { ...@@ -67,36 +87,73 @@ export default class AddUser extends Component {
let isDate = type !== '' ? true : false let isDate = type !== '' ? true : false
if (isDate && type === 'start_date') { if (isDate && type === 'start_date') {
this.setState({ ...data, startDate: format(e, 'yyyy-MM-dd'), endDate: null, this.setState({ ...data, startDate: format(e, 'yyyy-MM-dd'), endDate: null,
errorFullname: false,
errorEmail: false,
errorRoleName: false, errorRoleName: false,
errorStartDate: false, errorStartDate: false,
errorEndDate: false, errorEndDate: false,
msgErrorFN: '',
msgErrorEM: '',
msgErrorRN: '', msgErrorRN: '',
msgErrorSD: '', msgErrorSD: '',
msgErrorED: '', msgErrorED: '',
}) })
} else if (isDate && type === 'end_date') { } else if (isDate && type === 'end_date') {
this.setState({ ...data, endDate: format(e, 'yyyy-MM-dd') , this.setState({ ...data, endDate: format(e, 'yyyy-MM-dd') ,
errorFullname: false,
errorEmail: false,
errorRoleName: false, errorRoleName: false,
errorStartDate: false, errorStartDate: false,
errorEndDate: false, errorEndDate: false,
msgErrorFN: '',
msgErrorEM: '',
msgErrorRN: '', msgErrorRN: '',
msgErrorSD: '', msgErrorSD: '',
msgErrorED: '', msgErrorED: '',
}) })
} else { } else {
this.setState({ ...data, [e.target.name]: e.target.value, this.setState({ ...data, [e.target.name]: e.target.value,
errorFullname: false,
errorEmail: false,
errorRoleName: false, errorRoleName: false,
errorStartDate: false, errorStartDate: false,
errorEndDate: false, errorEndDate: false,
msgErrorFN: '',
msgErrorEM: '',
msgErrorRN: '', msgErrorRN: '',
msgErrorSD: '', msgErrorSD: '',
msgErrorED: '', msgErrorED: '',
}) })
} }
} }
isEmail(email) {
const re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(String(email).toLowerCase());
}
validasi() { validasi() {
var isEmail = this.isEmail(this.state.email)
if (R.isEmpty(this.state.fullname)) {
this.setState({ errorFullname: true, msgErrorFN: 'Nama Lengkap tidak boleh kosong' })
} else if (R.isEmpty(this.state.email)) {
this.setState({ errorEmail: true, msgErrorEM: 'Email tidak boleh kosong' })
} else if (!isEmail) {
this.setState({ errorEmail: true, msgErrorEM: 'Format email tidak sesuai!' })
} else if (R.isNil(this.state.role)) {
this.setState({ errorRoleName: true, msgErrorRN: 'Role Name tidak boleh kosong' })
} else if (R.isNil(this.state.startDate)) {
this.setState({ errorStartDate: true, msgErrorSD: 'Start Date tidak boleh kosong' })
} else if (R.isNil(this.state.endDate)) {
this.setState({ errorEndDate: true, msgErrorED: 'End Date tidak boleh kosong' })
}
// else if (this.state.privileges.length < 1) {
// alert('Hak Akses belum di pilih !!')
// }
else {
this.createUser() this.createUser()
}
} }
createUser() { createUser() {
...@@ -112,10 +169,10 @@ export default class AddUser extends Component { ...@@ -112,10 +169,10 @@ export default class AddUser extends Component {
api.create().createUser(payload).then((response) => { api.create().createUser(payload).then((response) => {
// console.log(response) // console.log(response)
// if (String(response.data.status).toLocaleUpperCase === 'Success' || String(response.data.status).toLocaleUpperCase === 'success') { // if (String(response.data.status).toLocaleUpperCase === 'Success' || String(response.data.status).toLocaleUpperCase === 'success') {
this.props.onClickClose() this.props.onClickClose()
this.props.refresh() this.props.refresh()
// } else { // } else {
// alert(response.data.message) // alert(response.data.message)
// this.props.onClickClose() // this.props.onClickClose()
// this.props.refresh() // this.props.refresh()
// } // }
...@@ -124,7 +181,7 @@ export default class AddUser extends Component { ...@@ -124,7 +181,7 @@ export default class AddUser 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 {
...@@ -135,8 +192,8 @@ export default class AddUser extends Component { ...@@ -135,8 +192,8 @@ export default class AddUser extends Component {
let defaultProps = { let defaultProps = {
options: roleData, options: roleData,
getOptionLabel: (option) => titleCase(option.role_name), getOptionLabel: (option) => titleCase(option.role_name),
}; };
this.setState({listRole: defaultProps}) this.setState({ listRole: defaultProps })
} else { } else {
alert(response.data.message) alert(response.data.message)
} }
...@@ -145,8 +202,8 @@ export default class AddUser extends Component { ...@@ -145,8 +202,8 @@ export default class AddUser 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)
} }
}) })
...@@ -180,28 +237,39 @@ export default class AddUser extends Component { ...@@ -180,28 +237,39 @@ export default class AddUser extends Component {
{item.children.map((data, index) => { {item.children.map((data, index) => {
return ( return (
// <li> // <li>
<Collapse key={index} timeout="auto" unmountOnExit in={item.collapse}> <Collapse key={index} timeout="auto" unmountOnExit in={item.collapse}>
<div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start', paddingLeft: R.isNil(data.children) ? (padding + 20) : padding }}> <div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start', paddingLeft: R.isNil(data.children) ? (padding + 20) : padding }}>
{R.isNil(data.children)? {R.isNil(data.children) ?
null null
: :
data.children.length < 1? data.children.length < 1 ?
null null
: :
<span onClick={() => this.handleCollapse(data)} style={{ marginLeft: 7, marginRight: 2 }}> <span onClick={() => this.handleCollapse(data)} style={{ marginLeft: 7, marginRight: 2 }}>
{data.collapse? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />} {data.collapse ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />}
</span> </span>
} }
<span> <span>
{this.state.role ? this.state.role.role_id === 1 ?
<CustomCheckboxDisabled
disabled={true}
checked={true}
// onChange={() => this.handleItemClick(item)}
/> :
<CustomCheckbox
checked={this.handleItemChecked(data)}
onChange={() => this.handleItemClick(data)}
/> :
<CustomCheckbox <CustomCheckbox
checked={this.handleItemChecked(data)} checked={this.handleItemChecked(data)}
onChange={() => this.handleItemClick(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.children) && this.renderChildren(data, padding + 20)} </div>
</Collapse> {!R.isNil(data.children) && this.renderChildren(data, padding + 20)}
</Collapse>
// </li> // </li>
) )
})} })}
...@@ -210,51 +278,51 @@ export default class AddUser extends Component { ...@@ -210,51 +278,51 @@ export default class AddUser extends Component {
} }
handleCollapse(item) { handleCollapse(item) {
let path = this.searchIt({children: this.state.listCompany}, item.id) let path = this.searchIt({ children: this.state.listCompany }, item.id)
let listCompany = this.state.listCompany let listCompany = this.state.listCompany
let arrayPath = [] let arrayPath = []
if (path.length > 1) { if (path.length > 1) {
arrayPath = path.split('-'); arrayPath = path.split('-');
arrayPath = arrayPath.map((item) => {return item}) arrayPath = arrayPath.map((item) => { return item })
} else { } else {
arrayPath.push(path) arrayPath.push(path)
} }
let pathSelect = null let pathSelect = null
if (arrayPath.length == 1) { if (arrayPath.length == 1) {
pathSelect= listCompany[arrayPath[0]] pathSelect = listCompany[arrayPath[0]]
} else if (arrayPath.length == 2) { } else if (arrayPath.length == 2) {
pathSelect= listCompany[arrayPath[0]].children[arrayPath[1]] pathSelect = listCompany[arrayPath[0]].children[arrayPath[1]]
} else if (arrayPath.length == 3) { } else if (arrayPath.length == 3) {
pathSelect= listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]] pathSelect = listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]]
} else if (arrayPath.length == 4) { } else if (arrayPath.length == 4) {
pathSelect= listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]].children[arrayPath[3]] pathSelect = listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]].children[arrayPath[3]]
} else if (arrayPath.length == 5) { } else if (arrayPath.length == 5) {
pathSelect= listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]].children[arrayPath[3]].children[arrayPath[4]] pathSelect = listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]].children[arrayPath[3]].children[arrayPath[4]]
} else if (arrayPath.length == 6) { } else if (arrayPath.length == 6) {
pathSelect= listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]].children[arrayPath[3]].children[arrayPath[4]].children[arrayPath[5]] pathSelect = listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]].children[arrayPath[3]].children[arrayPath[4]].children[arrayPath[5]]
} else if (arrayPath.length == 7) { } else if (arrayPath.length == 7) {
pathSelect= listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]].children[arrayPath[3]].children[arrayPath[4]].children[arrayPath[5]].children[arrayPath[6]] pathSelect = listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]].children[arrayPath[3]].children[arrayPath[4]].children[arrayPath[5]].children[arrayPath[6]]
} }
pathSelect.collapse = !pathSelect.collapse pathSelect.collapse = !pathSelect.collapse
// console.log(pathSelect.collapse) // console.log(pathSelect.collapse)
this.setState({listCompany}, () => console.log(pathSelect)) this.setState({ listCompany }, () => console.log(pathSelect))
} }
searchIt = (node, search, path = '', position = 0) => { searchIt = (node, search, path = '', position = 0) => {
if (node.id && node.id === search) {return path !== '' ? `${path}-${position}` : position;} if (node.id && node.id === search) { return path !== '' ? `${path}-${position}` : position; }
if (!node.children) {return false} if (!node.children) { return false }
const index = node.children.findIndex((x) => x.id && x.id === search); const index = node.children.findIndex((x) => x.id && x.id === search);
if (index >= 0) { if (index >= 0) {
return path !== '' ? `${path}-${index}` : index; return path !== '' ? `${path}-${index}` : index;
} }
for (let i = 0; i < node.children.length; i++) { for (let i = 0; i < node.children.length; i++) {
const result = this.searchIt(node.children[i], search, path !== '' ? `${path}-${i}` : i , i); const result = this.searchIt(node.children[i], search, path !== '' ? `${path}-${i}` : i, i);
if (result){ if (result) {
return result; return result;
} }
} }
return false; return false;
}; };
...@@ -275,7 +343,7 @@ export default class AddUser extends Component { ...@@ -275,7 +343,7 @@ export default class AddUser extends Component {
className="btn btn-circle btn-white" className="btn btn-circle btn-white"
onClick={() => this.props.onClickClose()} onClick={() => this.props.onClickClose()}
> >
<img src={Images.close}/> <img src={Images.close} />
</button> </button>
</div> </div>
</div> </div>
...@@ -292,6 +360,19 @@ export default class AddUser extends Component { ...@@ -292,6 +360,19 @@ export default class AddUser extends Component {
variant="filled" variant="filled"
value={'-'} value={'-'}
onChange={(e) => null} onChange={(e) => null}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085',
}
}}
> >
{/* {periode.map((option) => ( {/* {periode.map((option) => (
<MenuItem key={option.value} value={option.value}> <MenuItem key={option.value} value={option.value}>
...@@ -310,7 +391,22 @@ export default class AddUser extends Component { ...@@ -310,7 +391,22 @@ export default class AddUser extends Component {
name="fullname" name="fullname"
label="Nama Lengkap" label="Nama Lengkap"
value={this.state.fullname} value={this.state.fullname}
error={this.state.errorFullname}
helperText={this.state.msgErrorFN}
onChange={(e) => this.handleChange(e, '')} onChange={(e) => this.handleChange(e, '')}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085',
}
}}
// defaultValue="Default Value" // defaultValue="Default Value"
// helperText="Some important text" // helperText="Some important text"
/> />
...@@ -327,7 +423,22 @@ export default class AddUser extends Component { ...@@ -327,7 +423,22 @@ export default class AddUser extends Component {
name="email" name="email"
label="Email" label="Email"
value={this.state.email} value={this.state.email}
error={this.state.errorEmail}
helperText={this.state.msgErrorEM}
onChange={(e) => this.handleChange(e, '')} onChange={(e) => this.handleChange(e, '')}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085',
}
}}
// defaultValue="Default Value" // defaultValue="Default Value"
// helperText="Some important text" // helperText="Some important text"
/> />
...@@ -339,9 +450,26 @@ export default class AddUser extends Component { ...@@ -339,9 +450,26 @@ export default class AddUser 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}}
onChange={(e) => this.handleChange(e, '')}
error={this.state.errorRoleName}
helperText={this.state.msgErrorRN}
InputLabelProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085'
}
}}
InputProps={{ ...params.InputProps, style: { fontSize: 11, fontFamily: 'Nunito Sans, sans-serif' } }}
/>}
value={this.state.role} value={this.state.role}
/> />
</div> </div>
...@@ -349,7 +477,7 @@ export default class AddUser extends Component { ...@@ -349,7 +477,7 @@ export default class AddUser extends Component {
</div> </div>
<div className="grid grid-2x grid-mobile-none gap-15px" style={{ paddingLeft: 20, paddingRight: 20 }}> <div className="grid grid-2x grid-mobile-none gap-15px" style={{ paddingLeft: 20, paddingRight: 20 }}>
<div className="column-1"> <div className="column-1">
<div className="margin-bottom-20px"> <div className="margin-bottom-20px">
<DatePicker <DatePicker
margin="normal" margin="normal"
...@@ -363,6 +491,19 @@ export default class AddUser extends Component { ...@@ -363,6 +491,19 @@ export default class AddUser extends Component {
KeyboardButtonProps={{ KeyboardButtonProps={{
'aria-label': 'change date', 'aria-label': 'change date',
}} }}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
style={{ padding: 0, margin: 0, width: '100%' }} style={{ padding: 0, margin: 0, width: '100%' }}
/> />
...@@ -384,6 +525,19 @@ export default class AddUser extends Component { ...@@ -384,6 +525,19 @@ export default class AddUser extends Component {
KeyboardButtonProps={{ KeyboardButtonProps={{
'aria-label': 'change date', 'aria-label': 'change date',
}} }}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
style={{ padding: 0, margin: 0, width: '100%' }} style={{ padding: 0, margin: 0, width: '100%' }}
/> />
...@@ -402,6 +556,19 @@ export default class AddUser extends Component { ...@@ -402,6 +556,19 @@ export default class AddUser extends Component {
// id="outlined-read-only-input" // id="outlined-read-only-input"
variant="filled" variant="filled"
value={'Aktif'} value={'Aktif'}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
> >
{/* {periode.map((option) => ( {/* {periode.map((option) => (
<MenuItem key={option.value} value={option.value}> <MenuItem key={option.value} value={option.value}>
...@@ -423,6 +590,19 @@ export default class AddUser extends Component { ...@@ -423,6 +590,19 @@ export default class AddUser extends Component {
// id="outlined-read-only-input" // id="outlined-read-only-input"
variant="filled" variant="filled"
value={'T'} value={'T'}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
> >
{/* {periode.map((option) => ( {/* {periode.map((option) => (
<MenuItem key={option.value} value={option.value}> <MenuItem key={option.value} value={option.value}>
...@@ -433,33 +613,44 @@ export default class AddUser extends Component { ...@@ -433,33 +613,44 @@ export default class AddUser 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 : ${format(this.state.date, 'dd MMMM yyyy', {locale: localeID})}`}</Typography> <Typography style={{ fontSize: 12 }}>{`Dibuat : ${format(this.state.date, 'dd MMMM yyyy', { locale: localeID })}`}</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> */}
<div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start' }}> <div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start' }}>
{item.children.length > 0 && <span onClick={() => this.handleCollapse(item)} style={{ marginLeft: 7, marginRight: 2 }}> {item.children.length > 0 && <span onClick={() => this.handleCollapse(item)} style={{ marginLeft: 7, marginRight: 2 }}>
{item.collapse ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />} {item.collapse ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />}
</span>} </span>}
<span> <span>
<CustomCheckbox {this.state.role ? this.state.role.role_id === 1 ?
checked={this.handleItemChecked(item)} <CustomCheckboxDisabled
onChange={() => this.handleItemClick(item)} disabled={true}
/> checked={true}
</span> // onChange={() => this.handleItemClick(item)}
<Typography style={{ fontSize: 12 }}>{titleCase(item.company_name)}</Typography> /> :
</div> <CustomCheckbox
{!R.isNil(item.children) && this.renderChildren(item)} checked={this.handleItemChecked(item)}
{/* </li> onChange={() => this.handleItemClick(item)}
/> :
<CustomCheckbox
checked={this.handleItemChecked(item)}
onChange={() => this.handleItemClick(item)}
/>
}
</span>
<Typography style={{ fontSize: 12 }}>{titleCase(item.company_name)}</Typography>
</div>
{!R.isNil(item.children) && this.renderChildren(item)}
{/* </li>
</ul> */} </ul> */}
</div> </div>
) )
...@@ -474,7 +665,7 @@ export default class AddUser extends Component { ...@@ -474,7 +665,7 @@ export default class AddUser 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>
......
src/container/Otorisasi/User/EditUser.js
View file @ 867ddf10
...@@ -20,6 +20,16 @@ const CustomCheckbox = withStyles({ ...@@ -20,6 +20,16 @@ const CustomCheckbox = withStyles({
checked: {}, checked: {},
})((props) => <Checkbox color="default" {...props} />); })((props) => <Checkbox color="default" {...props} />);
const CustomCheckboxDisabled = withStyles({
root: {
color: '#d5d5d5',
'&$checked': {
color: '#d5d5d5',
},
},
checked: {},
})((props) => <Checkbox color="default" {...props} />);
export default class EditUser extends Component { export default class EditUser extends Component {
constructor(props) { constructor(props) {
...@@ -116,12 +126,22 @@ export default class EditUser extends Component { ...@@ -116,12 +126,22 @@ export default class EditUser extends Component {
}) })
} }
isEmail(email) {
const re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
return re.test(String(email).toLowerCase());
}
validasi() { validasi() {
var isEmail = this.isEmail(this.state.tempData.email)
// console.log(this.state.tempData)
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 (!isEmail) {
this.setState({ errorEmail: true, msgErrorEM: 'Format email tidak sesuai!' })
} else if (R.isNil(this.state.role)) {
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' })
...@@ -216,28 +236,39 @@ export default class EditUser extends Component { ...@@ -216,28 +236,39 @@ export default class EditUser extends Component {
{item.children.map((data, index) => { {item.children.map((data, index) => {
return ( return (
// <li> // <li>
<Collapse key={index} timeout="auto" unmountOnExit in={item.collapse}> <Collapse key={index} timeout="auto" unmountOnExit in={item.collapse}>
<div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start', paddingLeft: R.isNil(data.children) ? (padding + 20) : padding }}> <div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start', paddingLeft: R.isNil(data.children) ? (padding + 20) : padding }}>
{R.isNil(data.children)? {R.isNil(data.children) ?
null null
: :
data.children.length < 1? data.children.length < 1 ?
null null
: :
<span onClick={() => this.handleCollapse(data)} style={{ marginLeft: 7, marginRight: 2 }}> <span onClick={() => this.handleCollapse(data)} style={{ marginLeft: 7, marginRight: 2 }}>
{data.collapse? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />} {data.collapse ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />}
</span> </span>
} }
<span> <span>
{this.state.role ? this.state.role.role_id === 1 ?
<CustomCheckboxDisabled
disabled={true}
checked={true}
// onChange={() => this.handleItemClick(item)}
/> :
<CustomCheckbox
checked={this.handleItemChecked(data)}
onChange={() => this.handleItemClick(data)}
/> :
<CustomCheckbox <CustomCheckbox
checked={this.handleItemChecked(data)} checked={this.handleItemChecked(data)}
onChange={() => this.handleItemClick(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.children) && this.renderChildren(data, padding + 20)} </div>
</Collapse> {!R.isNil(data.children) && this.renderChildren(data, padding + 20)}
</Collapse>
// </li> // </li>
) )
})} })}
...@@ -246,51 +277,51 @@ export default class EditUser extends Component { ...@@ -246,51 +277,51 @@ export default class EditUser extends Component {
} }
handleCollapse(item) { handleCollapse(item) {
let path = this.searchIt({children: this.state.listCompany}, item.id) let path = this.searchIt({ children: this.state.listCompany }, item.id)
let listCompany = this.state.listCompany let listCompany = this.state.listCompany
let arrayPath = [] let arrayPath = []
if (path.length > 1) { if (path.length > 1) {
arrayPath = path.split('-'); arrayPath = path.split('-');
arrayPath = arrayPath.map((item) => {return item}) arrayPath = arrayPath.map((item) => { return item })
} else { } else {
arrayPath.push(path) arrayPath.push(path)
} }
let pathSelect = null let pathSelect = null
if (arrayPath.length == 1) { if (arrayPath.length == 1) {
pathSelect= listCompany[arrayPath[0]] pathSelect = listCompany[arrayPath[0]]
} else if (arrayPath.length == 2) { } else if (arrayPath.length == 2) {
pathSelect= listCompany[arrayPath[0]].children[arrayPath[1]] pathSelect = listCompany[arrayPath[0]].children[arrayPath[1]]
} else if (arrayPath.length == 3) { } else if (arrayPath.length == 3) {
pathSelect= listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]] pathSelect = listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]]
} else if (arrayPath.length == 4) { } else if (arrayPath.length == 4) {
pathSelect= listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]].children[arrayPath[3]] pathSelect = listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]].children[arrayPath[3]]
} else if (arrayPath.length == 5) { } else if (arrayPath.length == 5) {
pathSelect= listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]].children[arrayPath[3]].children[arrayPath[4]] pathSelect = listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]].children[arrayPath[3]].children[arrayPath[4]]
} else if (arrayPath.length == 6) { } else if (arrayPath.length == 6) {
pathSelect= listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]].children[arrayPath[3]].children[arrayPath[4]].children[arrayPath[5]] pathSelect = listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]].children[arrayPath[3]].children[arrayPath[4]].children[arrayPath[5]]
} else if (arrayPath.length == 7) { } else if (arrayPath.length == 7) {
pathSelect= listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]].children[arrayPath[3]].children[arrayPath[4]].children[arrayPath[5]].children[arrayPath[6]] pathSelect = listCompany[arrayPath[0]].children[arrayPath[1]].children[arrayPath[2]].children[arrayPath[3]].children[arrayPath[4]].children[arrayPath[5]].children[arrayPath[6]]
} }
pathSelect.collapse = !pathSelect.collapse pathSelect.collapse = !pathSelect.collapse
// console.log(pathSelect.collapse) // console.log(pathSelect.collapse)
this.setState({listCompany}, () => console.log(pathSelect)) this.setState({ listCompany }, () => console.log(pathSelect))
} }
searchIt = (node, search, path = '', position = 0) => { searchIt = (node, search, path = '', position = 0) => {
if (node.id && node.id === search) {return path !== '' ? `${path}-${position}` : position;} if (node.id && node.id === search) { return path !== '' ? `${path}-${position}` : position; }
if (!node.children) {return false} if (!node.children) { return false }
const index = node.children.findIndex((x) => x.id && x.id === search); const index = node.children.findIndex((x) => x.id && x.id === search);
if (index >= 0) { if (index >= 0) {
return path !== '' ? `${path}-${index}` : index; return path !== '' ? `${path}-${index}` : index;
} }
for (let i = 0; i < node.children.length; i++) { for (let i = 0; i < node.children.length; i++) {
const result = this.searchIt(node.children[i], search, path !== '' ? `${path}-${i}` : i , i); const result = this.searchIt(node.children[i], search, path !== '' ? `${path}-${i}` : i, i);
if (result){ if (result) {
return result; return result;
} }
} }
return false; return false;
}; };
...@@ -311,7 +342,7 @@ export default class EditUser extends Component { ...@@ -311,7 +342,7 @@ export default class EditUser extends Component {
className="btn btn-circle btn-white" className="btn btn-circle btn-white"
onClick={() => this.props.onClickClose()} onClick={() => this.props.onClickClose()}
> >
<img src={Images.close}/> <img src={Images.close} />
</button> </button>
</div> </div>
</div> </div>
...@@ -328,6 +359,19 @@ export default class EditUser extends Component { ...@@ -328,6 +359,19 @@ export default class EditUser extends Component {
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}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
> >
{/* {periode.map((option) => ( {/* {periode.map((option) => (
<MenuItem key={option.value} value={option.value}> <MenuItem key={option.value} value={option.value}>
...@@ -350,6 +394,19 @@ export default class EditUser extends Component { ...@@ -350,6 +394,19 @@ export default class EditUser extends Component {
// defaultValue="Default Value" // defaultValue="Default Value"
error={this.state.errorFullname} error={this.state.errorFullname}
helperText={this.state.msgErrorFN} helperText={this.state.msgErrorFN}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
/> />
</div> </div>
</div> </div>
...@@ -367,6 +424,19 @@ export default class EditUser extends Component { ...@@ -367,6 +424,19 @@ export default class EditUser extends Component {
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}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
/> />
</div> </div>
</div> </div>
...@@ -379,7 +449,23 @@ export default class EditUser extends Component { ...@@ -379,7 +449,23 @@ export default class EditUser extends Component {
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 }}
onChange={(e) => this.handleChange(e, '')}
error={this.state.errorRoleName}
helperText={this.state.msgErrorRN}
InputLabelProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085'
}
}}
InputProps={{ ...params.InputProps, style: { fontSize: 11, fontFamily: 'Nunito Sans, sans-serif' } }}
/>}
value={this.state.role} value={this.state.role}
/> />
</div> </div>
...@@ -401,6 +487,19 @@ export default class EditUser extends Component { ...@@ -401,6 +487,19 @@ export default class EditUser extends Component {
KeyboardButtonProps={{ KeyboardButtonProps={{
'aria-label': 'change date', 'aria-label': 'change date',
}} }}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
style={{ padding: 0, margin: 0, width: '100%' }} style={{ padding: 0, margin: 0, width: '100%' }}
/> />
</div> </div>
...@@ -421,7 +520,19 @@ export default class EditUser extends Component { ...@@ -421,7 +520,19 @@ export default class EditUser extends Component {
KeyboardButtonProps={{ KeyboardButtonProps={{
'aria-label': 'change date', 'aria-label': 'change date',
}} }}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
style={{ padding: 0, margin: 0, width: '100%' }} style={{ padding: 0, margin: 0, width: '100%' }}
/> />
</div> </div>
...@@ -439,6 +550,19 @@ export default class EditUser extends Component { ...@@ -439,6 +550,19 @@ export default class EditUser extends Component {
// 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}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
> >
{/* {periode.map((option) => ( {/* {periode.map((option) => (
<MenuItem key={option.value} value={option.value}> <MenuItem key={option.value} value={option.value}>
...@@ -460,6 +584,19 @@ export default class EditUser extends Component { ...@@ -460,6 +584,19 @@ export default class EditUser extends Component {
// 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}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
> >
{/* {periode.map((option) => ( {/* {periode.map((option) => (
<MenuItem key={option.value} value={option.value}> <MenuItem key={option.value} value={option.value}>
...@@ -483,20 +620,31 @@ export default class EditUser extends Component { ...@@ -483,20 +620,31 @@ export default class EditUser extends Component {
<div> <div>
{/* <ul> {/* <ul>
<li> */} <li> */}
<div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start' }}> <div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start' }}>
{item.children.length > 0 && <span onClick={() => this.handleCollapse(item)} style={{ marginLeft: 7, marginRight: 2 }}> {item.children.length > 0 && <span onClick={() => this.handleCollapse(item)} style={{ marginLeft: 7, marginRight: 2 }}>
{item.collapse ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />} {item.collapse ? <RemoveIcon color={'action'} fontSize={'small'} /> : <AddIcon color={'action'} fontSize={'small'} />}
</span>} </span>}
<span> <span>
<CustomCheckbox {this.state.role ? this.state.role.role_id === 1 ?
checked={this.handleItemChecked(item)} <CustomCheckboxDisabled
onChange={() => this.handleItemClick(item)} disabled={true}
/> checked={true}
</span> // onChange={() => this.handleItemClick(item)}
<Typography style={{ fontSize: 12 }}>{titleCase(item.company_name)}</Typography> /> :
</div> <CustomCheckbox
{!R.isNil(item.children) && this.renderChildren(item)} checked={this.handleItemChecked(item)}
{/* </li> onChange={() => this.handleItemClick(item)}
/> :
<CustomCheckbox
checked={this.handleItemChecked(item)}
onChange={() => this.handleItemClick(item)}
/>
}
</span>
<Typography style={{ fontSize: 12 }}>{titleCase(item.company_name)}</Typography>
</div>
{!R.isNil(item.children) && this.renderChildren(item)}
{/* </li>
</ul> */} </ul> */}
</div> </div>
) )
......
src/container/Otorisasi/UserRole.js
View file @ 867ddf10
...@@ -100,6 +100,7 @@ class UserRole extends Component { ...@@ -100,6 +100,7 @@ class UserRole extends Component {
name: "Action", name: "Action",
options: { options: {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
console.log(tableMeta);
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<button <button
...@@ -112,7 +113,7 @@ class UserRole extends Component { ...@@ -112,7 +113,7 @@ class UserRole extends Component {
onClick={() => this.setState({ edit: true, indexData: tableMeta.rowData[1] })} onClick={() => this.setState({ edit: true, indexData: tableMeta.rowData[1] })}
> >
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
{tableMeta.rowData[4] === "Aktif" ? {tableMeta.rowData[2] !== "superadmin" && tableMeta.rowData[4] === "Aktif" ?
<img src={Images.editCopy} /> : <img src={Images.editCopy} /> :
null null
} }
......
src/container/Otorisasi/UserRole/AddRole.js
View file @ 867ddf10
...@@ -52,6 +52,16 @@ export default class AddRole extends Component { ...@@ -52,6 +52,16 @@ export default class AddRole extends Component {
componentDidMount() { componentDidMount() {
this.getMenu() this.getMenu()
if (this.props.type === 'edit') {
//
} else {
let date = format(new Date, 'yyyy-MM-dd')
console.log(date);
this.setState({
startDate: date,
endDate: date
})
}
} }
handleChange(e, type) { handleChange(e, type) {
...@@ -266,6 +276,19 @@ export default class AddRole extends Component { ...@@ -266,6 +276,19 @@ export default class AddRole extends Component {
variant="filled" variant="filled"
value={'-'} value={'-'}
onChange={(e) => null} onChange={(e) => null}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085',
}
}}
> >
{/* {periode.map((option) => ( {/* {periode.map((option) => (
<MenuItem key={option.value} value={option.value}> <MenuItem key={option.value} value={option.value}>
...@@ -287,6 +310,19 @@ export default class AddRole extends Component { ...@@ -287,6 +310,19 @@ export default class AddRole extends Component {
error={this.state.errorRoleName} error={this.state.errorRoleName}
helperText={this.state.msgErrorRN} helperText={this.state.msgErrorRN}
onChange={(e) => this.handleChange(e, '')} onChange={(e) => this.handleChange(e, '')}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085',
}
}}
// defaultValue="Default Value" // defaultValue="Default Value"
// helperText="Some important text" // helperText="Some important text"
/> />
...@@ -309,6 +345,19 @@ export default class AddRole extends Component { ...@@ -309,6 +345,19 @@ export default class AddRole extends Component {
KeyboardButtonProps={{ KeyboardButtonProps={{
'aria-label': 'change date', 'aria-label': 'change date',
}} }}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
style={{ padding: 0, margin: 0, width: '100%' }} style={{ padding: 0, margin: 0, width: '100%' }}
/> />
...@@ -330,6 +379,19 @@ export default class AddRole extends Component { ...@@ -330,6 +379,19 @@ export default class AddRole extends Component {
KeyboardButtonProps={{ KeyboardButtonProps={{
'aria-label': 'change date', 'aria-label': 'change date',
}} }}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
style={{ padding: 0, margin: 0, width: '100%' }} style={{ padding: 0, margin: 0, width: '100%' }}
/> />
...@@ -348,6 +410,20 @@ export default class AddRole extends Component { ...@@ -348,6 +410,20 @@ export default class AddRole extends Component {
// id="outlined-read-only-input" // id="outlined-read-only-input"
variant="filled" variant="filled"
value={'Aktif'} value={'Aktif'}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
> >
{/* {periode.map((option) => ( {/* {periode.map((option) => (
<MenuItem key={option.value} value={option.value}> <MenuItem key={option.value} value={option.value}>
......
src/container/Otorisasi/UserRole/EditRole.js
View file @ 867ddf10
...@@ -274,6 +274,19 @@ export default class EditRole extends Component { ...@@ -274,6 +274,19 @@ export default class EditRole extends Component {
variant="filled" variant="filled"
value={this.state.tempData === null ? '' : this.state.tempData.role_id} value={this.state.tempData === null ? '' : this.state.tempData.role_id}
onChange={(e) => null} onChange={(e) => null}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
> >
{/* {periode.map((option) => ( {/* {periode.map((option) => (
<MenuItem key={option.value} value={option.value}> <MenuItem key={option.value} value={option.value}>
...@@ -295,6 +308,19 @@ export default class EditRole extends Component { ...@@ -295,6 +308,19 @@ export default class EditRole extends Component {
error={this.state.errorRoleName} error={this.state.errorRoleName}
helperText={this.state.msgErrorRN} helperText={this.state.msgErrorRN}
onChange={(e) => this.handleChange(e, '')} onChange={(e) => this.handleChange(e, '')}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
// defaultValue="Default Value" // defaultValue="Default Value"
// helperText="Some important text" // helperText="Some important text"
/> />
...@@ -317,6 +343,19 @@ export default class EditRole extends Component { ...@@ -317,6 +343,19 @@ export default class EditRole extends Component {
KeyboardButtonProps={{ KeyboardButtonProps={{
'aria-label': 'change date', 'aria-label': 'change date',
}} }}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
style={{ padding: 0, margin: 0, width: '100%' }} style={{ padding: 0, margin: 0, width: '100%' }}
/> />
...@@ -338,6 +377,19 @@ export default class EditRole extends Component { ...@@ -338,6 +377,19 @@ export default class EditRole extends Component {
KeyboardButtonProps={{ KeyboardButtonProps={{
'aria-label': 'change date', 'aria-label': 'change date',
}} }}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
style={{ padding: 0, margin: 0, width: '100%' }} style={{ padding: 0, margin: 0, width: '100%' }}
/> />
...@@ -356,6 +408,19 @@ export default class EditRole extends Component { ...@@ -356,6 +408,19 @@ export default class EditRole extends Component {
// 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}
inputProps={{
style: {
fontSize: 11,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontFamily: 'Nunito Sans, sans-serif',
}
}}
> >
{/* {periode.map((option) => ( {/* {periode.map((option) => (
<MenuItem key={option.value} value={option.value}> <MenuItem key={option.value} value={option.value}>
......
src/container/Profile.js
View file @ 867ddf10
...@@ -253,18 +253,8 @@ export default class Profile extends Component { ...@@ -253,18 +253,8 @@ export default class Profile extends Component {
}; };
async onDrop(pictureFiles) { async onDrop(pictureFiles) {
let formData = new FormData() console.log(pictureFiles);
formData.append('file', pictureFiles[0]) this.setState({ pictures: pictureFiles })
let response = await api.create().uploadFoto(formData)
if (response.data) {
if (response.data.status === "success") {
this.setState({ uploadVisible: false }, () => {
alert(response.data.message)
this.getUser()
window.location.reload()
})
}
}
// console.log(response); // console.log(response);
// console.log(pictureFiles); // console.log(pictureFiles);
// console.log(pictureDataURLs); // console.log(pictureDataURLs);
...@@ -273,6 +263,23 @@ export default class Profile extends Component { ...@@ -273,6 +263,23 @@ export default class Profile extends Component {
// }); // });
} }
async uploadFoto(){
let formData = new FormData()
formData.append('file', this.state.pictures[0])
api.create().uploadFoto(formData).then(response => {
console.log(response)
if (response.data) {
if (response.data.status === "success") {
this.setState({ uploadVisible: false }, () => {
alert(response.data.message)
this.getUser()
window.location.reload()
})
}
}
})
}
render() { render() {
return ( return (
<div style={{ height: this.props.height, backgroundColor: '#f8f8f8', marginBottom: 100, minHeight: 1000 }}> <div style={{ height: this.props.height, backgroundColor: '#f8f8f8', marginBottom: 100, minHeight: 1000 }}>
...@@ -487,11 +494,21 @@ export default class Profile extends Component { ...@@ -487,11 +494,21 @@ export default class Profile extends Component {
</div> </div>
<ImageUploader <ImageUploader
withIcon={true} withIcon={true}
buttonText='Choose images' withPreview
buttonText='Pilih Gambar'
onChange={this.onDrop} onChange={this.onDrop}
imgExtension={['.jpg', '.gif', '.png', '.gif', '.jpeg']} imgExtension={['.jpg', '.gif', '.png', '.gif', '.jpeg']}
maxFileSize={5242880} maxFileSize={1000000}
label={"Max file size: 1 Mb, accepted: jpg or png"}
/> />
{this.state.pictures.length > 0 ?
<div style={{ display: 'grid', margin: 20 }}>
<div style={{ justifySelf: 'center' }}>
<span className="main-color" style={{ color: '#fff', padding: 20, paddingBottom: 10, paddingTop: 10, borderRadius: 15, cursor: 'pointer' }} onClick={() => this.uploadFoto()}>Upload Foto</span>
</div>
</div> : null
}
</div> </div>
</div> </div>
)} )}
......
src/library/Upload.js
View file @ 867ddf10
...@@ -124,7 +124,7 @@ class Upload extends Component { ...@@ -124,7 +124,7 @@ class Upload extends Component {
onClick={this.state.uploadProgress === true ? null : this.onRemove} onClick={this.state.uploadProgress === true ? null : this.onRemove}
className="btn btn-small-circle btn-black" className="btn btn-small-circle btn-black"
type="button"> type="button">
<i className="fa fa-1x fa-times" /> <img src={Images.close} />
</button> </button>
</div> </div>
<div className="width width-full margin-left-10px"> <div className="width width-full margin-left-10px">
......
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