Skip to content

T
Tia-dev
Commit 8fa58802 authored by Dida Adams Arizona's avatar Dida Adams Arizona
Browse files
Options

Merge branch 'didam' into 'master' 

update didam

See merge request !42
parents 8a734896 430ef26b
Hide whitespace changes
Inline Side-by-side
Showing with 226 additions and 41 deletions
src/api/index.js
View file @ 8fa58802
......@@ -65,9 +65,13 @@ const create = (baseURL = 'https://trftia.eksad.com/tia-reporting-dev/public/')
//Role
const getRole = () => api.get('role/get_all_role')
const getDetailRole = (roleId) => api.get(`role/get_role_by_id/${roleId}`)
const addRole = (body) => api.post('role/create_role', body)
const editRole = (body) => api.post('role/update_role', body)
const deleteRole = (roleId) => api.post(`role/delete_role/${roleId}`)
//Menu
const getMenu = () => api.get('menu/get_menu_hierarki')
// ------
// STEP 3
// ------
......@@ -86,9 +90,11 @@ const create = (baseURL = 'https://trftia.eksad.com/tia-reporting-dev/public/')
login,
verification,
getRole,
getDetailRole,
addRole,
editRole,
deleteRole,
getMenu
}
}
......
src/container/Otorisasi/UserRole.js
View file @ 8fa58802
......@@ -18,7 +18,7 @@ export default class UserRole extends Component {
super(props)
this.state = {
listRole: [],
paramsData: {},
indexData: {},
add: false,
edit: false
}
......@@ -38,6 +38,7 @@ export default class UserRole extends Component {
getRole() {
api.create().getRole().then((response) => {
// console.log(response)
if (response.data.status == 'success') {
let data = response.data.data
let listData = data.map((item,index) => {
......@@ -52,7 +53,7 @@ export default class UserRole extends Component {
} else {
alert(response.data.message)
}
// console.log(response.data.data)
console.log(response.data.data)
})
}
......@@ -69,7 +70,8 @@ export default class UserRole extends Component {
cursor: 'pointer',
borderColor: 'transparent',
}}
onClick={() => this.setState({edit: true, paramsData: tableMeta.rowData})}
// onClick={() => console.log(tableMeta.rowData[1])}
onClick={() => this.setState({edit: true, indexData: tableMeta.rowData[1]})}
>
<img src={Images.editCopy} />
</button>
......@@ -148,14 +150,14 @@ export default class UserRole extends Component {
</div>
{this.state.add && (
<AddRole
onClickClose={this.closeAdd.bind(this)}
data={this.state.paramsData}
onClickClose={this.closeAdd.bind(this)}
data={this.state.indexData}
/>
)}
{this.state.edit && (
<EditRole
onClickClose={this.closeEdit.bind(this)}
data={this.state.paramsData}
onClickClose={this.closeEdit.bind(this)}
data={this.state.indexData}
/>
)}
</div>
......
src/container/Otorisasi/UserRole/AddRole.js
View file @ 8fa58802
import React, { Component } from 'react';
import { TextField } from '@material-ui/core';
export default class CreateUnitBisnis extends Component {
export default class AddRole extends Component {
render() {
return (
<div className="test app-popup-show" style={{display: 'flex', justifyContent: 'center', alignItems: 'center'}}>
......
src/container/Otorisasi/UserRole/EditRole.js
View file @ 8fa58802
import React, { Component } from 'react';
import { TextField } from '@material-ui/core';
import { TextField, Divider, Typography, Checkbox } from '@material-ui/core';
import api from '../../../api';
export default class EditRole extends Component {
constructor(props) {
super(props)
this.state = {
paramsId: this.props.data,
tempData: null,
menuData: null,
privileges: [],
checked: false
}
}
handleChecked() {
this.setState({checked: !this.state.checked})
}
componentDidMount() {
this.getDetailRole()
this.getMenu()
}
handleChange(e) {
let data = this.state
this.setState({...data, tempData: {...this.state.tempData, [e.target.name] : e.target.value}})
}
getDetailRole() {
api.create().getDetailRole(this.state.paramsId).then((response) => {
if (response.data.status == 'success') {
this.setState({tempData: response.data.data, privileges: response.data.data.privileges})
} else {
alert(response.data.message)
}
})
}
updateRole() {
let payload = {
"role_id": 40,
"role_name": "admin-tia",
"start_date": "2020-01-01",
"end_date": "2020-12-31",
"privileges": [
{
"menu_id": 17,
"button_id": [1, 2, 3]
}
]
}
}
getMenu() {
api.create().getMenu().then((response) => {
if (response.data.status == 'success') {
this.setState({menuData: response.data.data})
} else {
alert(response.data.message)
}
})
}
handleItemChecked(item) {
let indexID = this.state.privileges.findIndex((val) => val.menu_id == item.menu_id)
return indexID == -1? false : true
}
handleItemClick(item) {
let indexID = this.state.privileges.findIndex((val) => val.menu_id == item.menu_id)
let privileges = this.state.privileges
if (indexID == -1) {
privileges.push({
menu_id: item.menu_id,
button_id: [1,2,3]
})
} else {
privileges.splice(indexID,1)
}
this.setState({privileges})
}
handleSubItemChecked(item, index) {
let indexID = this.state.privileges.findIndex((val) => val.menu_id == item.menu_id)
let value = false
if (indexID == -1) {
value = false
} else {
let arrayButton = this.state.privileges[indexID].button_id
console.log(arrayButton)
let indexButtonID = this.state.privileges[indexID].button_id.findIndex((val) => val == index)
// console.log(indexButtonID)
if (indexButtonID == -1) {
value = false
} else {
value = true
}
}
return indexID == -1? value : value
}
handleSubItemClick(item, index) {
let indexID = this.state.privileges.findIndex((val) => val.menu_id == item.menu_id)
let indexButtonID = this.state.privileges[indexID].button_id.findIndex((val) => val == index)
let privileges = this.state.privileges
let button_id = privileges[indexID].button_id
if (indexButtonID == -1) {
button_id.push(index)
} else {
button_id.splice(indexButtonID,1)
}
privileges[indexID].button_id = button_id
this.setState({privileges})
}
export default class CreateUnitBisnis extends Component {
render() {
return (
<div className="test app-popup-show">
......@@ -9,7 +124,7 @@ export default class CreateUnitBisnis extends Component {
<div className="popup-panel grid grid-2x" style={{ backgroundColor: '#51c6ea', height: 64, borderTopRightRadius: 8, borderTopLeftRadius: 8 }}>
<div className="col-1" style={{ maxWidth: "inherit", display: 'flex', alignItems: 'center' }}>
<div className="popup-title">
<span style={{ color: '#fff', fontSize: 16, fontWeight: 'bold' }}>Create Data</span>
<span style={{ color: '#fff', fontSize: 16, fontWeight: 'bold' }}>Ubah Data</span>
</div>
</div>
<div className="col-2 content-right" style={{ maxWidth: "inherit", alignSelf: 'center' }}>
......@@ -23,8 +138,7 @@ export default class CreateUnitBisnis extends Component {
</div>
</div>
<div className="border-bottom grid grid-2x grid-mobile-none gap-15px" style={{ padding: 20 }}>
<div className="grid grid-2x grid-mobile-none gap-15px" style={{ padding: 20 }}>
<div className="column-1">
<div className="margin-bottom-20px">
<TextField
......@@ -34,7 +148,7 @@ export default class CreateUnitBisnis extends Component {
disabled
// id="outlined-read-only-input"
variant="filled"
value={1}
value={this.state.tempData == null? '' : this.state.tempData.role_id}
onChange={(e) => null}
>
{/* {periode.map((option) => (
......@@ -49,35 +163,32 @@ export default class CreateUnitBisnis extends Component {
<div className="column-2">
<div className="margin-bottom-20px">
<TextField
style={{ width: '100%'}}
id="standard-helperText"
label="Helper text"
defaultValue="Default Value"
style={{ width: '100%' , marginTop: 7}}
id="userRole"
name="role_name"
label="User Role"
value={this.state.tempData == null? '' : this.state.tempData.role_name}
onChange={(e) => this.handleChange(e)}
// defaultValue="Default Value"
// helperText="Some important text"
/>
</div>
</div>
</div>
<div className="border-bottom grid grid-2x grid-mobile-none gap-15px" style={{ padding: 20 }}>
<div className="grid grid-2x grid-mobile-none gap-15px" style={{ paddingLeft: 20, paddingRight: 20 }}>
<div className="column-1">
<div className="margin-bottom-20px">
<TextField
style={{ width: '100%' }}
id="id"
label="ID"
disabled
// id="outlined-read-only-input"
variant="filled"
value={1}
onChange={(e) => null}
>
{/* {periode.map((option) => (
<MenuItem key={option.value} value={option.value}>
{option.label}
</MenuItem>
))} */}
</TextField>
style={{ width: '100%'}}
id="startDate"
label="Berlaku Mulai"
name="start_date"
value={this.state.tempData == null? '' : this.state.tempData.start_date}
defaultValue="Default Value"
onChange={(e) => this.handleChange(e)}
// helperText="Some important text"
/>
</div>
</div>
......@@ -85,27 +196,29 @@ export default class CreateUnitBisnis extends Component {
<div className="margin-bottom-20px">
<TextField
style={{ width: '100%'}}
id="standard-helperText"
label="Helper text"
id="endDate"
label="Berlaku Hingga"
name="end_date"
value={this.state.tempData == null? '' : this.state.tempData.end_date}
defaultValue="Default Value"
onChange={(e) => this.handleChange(e)}
// helperText="Some important text"
/>
</div>
</div>
</div>
<div className="border-bottom grid grid-2x grid-mobile-none gap-15px" style={{ padding: 20 }}>
<div className="grid grid-2x grid-mobile-none gap-15px" style={{ paddingLeft: 20, paddingRight: 20 }}>
<div className="column-1">
<div className="margin-bottom-20px">
<TextField
style={{ width: '100%' }}
id="id"
label="ID"
id="status"
label="Status"
disabled
// id="outlined-read-only-input"
variant="filled"
value={1}
onChange={(e) => null}
value={this.state.tempData == null? '' : this.state.tempData.status}
>
{/* {periode.map((option) => (
<MenuItem key={option.value} value={option.value}>
......@@ -116,7 +229,71 @@ export default class CreateUnitBisnis extends Component {
</div>
</div>
</div>
<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}}>{`Diubah: ${this.state.tempData == null? '' : this.state.tempData.updated}`}</Typography>
</div>
<Divider style={{margin: 20}}/>
<div style={{paddingLeft: 20, paddingRight: 20}}>
<h5>Hak Akses</h5>
<div className="grid grid-2x grid-mobile-none gap-15px padding-top-5px padding-bottom-5px padding-left-10px padding-right-10px " style={{backgroundColor: '#4b4b4b'}}>
<div className="column-1">
<Typography style={{fontSize: 12, color: 'white'}}>Otorisasi Modul</Typography>
</div>
<div className="column-2 grid grid-3x content-center grid-mobile-none gap-15px">
<div className="column-1">
<Typography style={{fontSize: 12, color: 'white'}}>Lihat</Typography>
</div>
<div className="column-2">
<Typography style={{fontSize: 12, color: 'white'}}>Tambah</Typography>
</div>
<div className="column 3">
<Typography style={{fontSize: 12, color: 'white'}}>Ubah</Typography>
</div>
</div>
</div>
{this.state.menuData !== null && this.state.menuData.map((item,index) => {
return (
<div className="grid grid-2x grid-mobile-none gap-15px padding-left-10px padding-right-10px">
<div className="column-1" style={{display: 'flex', flexDirection: 'row', alignItems: 'center'}}>
<Checkbox
checked={this.handleItemChecked(item)}
onChange={() => this.handleItemClick(item)}
inputProps={{ 'aria-label': 'primary checkbox' }}
/>
<Typography style={{fontSize: 12}}>{item.menu_name}</Typography>
</div>
<div className="column-2 grid grid-3x content-center grid-mobile-none gap-15px">
<div className="column-1">
<Checkbox
// disabled={}
checked={this.handleSubItemChecked(item, 1)}
onChange={() => this.handleSubItemClick(item,1)}
inputProps={{ 'aria-label': 'primary checkbox' }}
/>
</div>
<div className="column-2">
<Checkbox
// disabled
checked={this.handleSubItemChecked(item, 2)}
onChange={() => this.handleSubItemClick(item,2)}
inputProps={{ 'aria-label': 'primary checkbox' }}
/>
</div>
<div className="column 3">
<Checkbox
// disabled
checked={this.handleSubItemChecked(item, 3)}
onChange={() => this.handleSubItemClick(item,3)}
inputProps={{ 'aria-label': 'primary checkbox' }}
/>
</div>
</div>
</div>
)
})}
</div>
<div className="border-top grid grid-2x" style={{ height: 56, backgroundColor: '#f5f5f5', paddingLeft: 20, paddingRight: 20 }}>
<div className="column-1" style={{ alignSelf: 'center' }}>
<div style={{ width: 102, height: 30, border: 'solid 1px #354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
......
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