Skip to content

T
Tia-dev
Commit d5e9699b authored by d.arizona's avatar d.arizona
Browse files
Options

update didam

parent bc128b98
Show whitespace changes
Inline Side-by-side
Showing with 157 additions and 24 deletions
package.json
View file @ d5e9699b
{ {
"name": "my-app", "name": "my-app",
"version": "0.1.0", "version": "0.1.0",
"homepage": "http://localhost:8080/tia-web/",
"private": true, "private": true,
"dependencies": { "dependencies": {
"@material-ui/core": "^4.11.0", "@material-ui/core": "^4.11.0",
......
src/Utils/Index.js
View file @ d5e9699b
...@@ -29,6 +29,8 @@ function FadeMenu() { ...@@ -29,6 +29,8 @@ function FadeMenu() {
const handleClose = () => { const handleClose = () => {
setAnchorEl(null); setAnchorEl(null);
localStorage.clear()
window.location.reload();
}; };
const classes = useStyles(); const classes = useStyles();
......
src/api/index.js
View file @ d5e9699b
...@@ -61,6 +61,12 @@ const create = (baseURL = 'https://trftia.eksad.com/tia-reporting-dev/public/') ...@@ -61,6 +61,12 @@ const create = (baseURL = 'https://trftia.eksad.com/tia-reporting-dev/public/')
// //
const getRoot = () => api.get('') const getRoot = () => api.get('')
const login = (body) => api.post('auth/login', body) const login = (body) => api.post('auth/login', body)
//Role
const getRole = () => api.get('role/get_all_role')
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}`)
// ------ // ------
// STEP 3 // STEP 3
// ------ // ------
...@@ -77,6 +83,10 @@ const create = (baseURL = 'https://trftia.eksad.com/tia-reporting-dev/public/') ...@@ -77,6 +83,10 @@ const create = (baseURL = 'https://trftia.eksad.com/tia-reporting-dev/public/')
// a list of the API functions from step 2 // a list of the API functions from step 2
getRoot, getRoot,
login, login,
getRole,
addRole,
editRole,
deleteRole,
} }
} }
......
src/assets/sass/app.css
View file @ d5e9699b
...@@ -84,12 +84,15 @@ ...@@ -84,12 +84,15 @@
-o-transition: all 0.35s cubic-bezier(0, 1, 0.5, 1); -o-transition: all 0.35s cubic-bezier(0, 1, 0.5, 1);
transition: all 0.35s cubic-bezier(0, 1, 0.5, 1); } transition: all 0.35s cubic-bezier(0, 1, 0.5, 1); }
.app-popup-show { .app-popup-show {
display: block; display: flex;
-webkit-transition: all 0.35s cubic-bezier(0, 1, 0.5, 1); -webkit-transition: all 0.35s cubic-bezier(0, 1, 0.5, 1);
-moz-transition: all 0.35s cubic-bezier(0, 1, 0.5, 1); -moz-transition: all 0.35s cubic-bezier(0, 1, 0.5, 1);
-ms-transition: all 0.35s cubic-bezier(0, 1, 0.5, 1); -ms-transition: all 0.35s cubic-bezier(0, 1, 0.5, 1);
-o-transition: all 0.35s cubic-bezier(0, 1, 0.5, 1); -o-transition: all 0.35s cubic-bezier(0, 1, 0.5, 1);
transition: all 0.35s cubic-bezier(0, 1, 0.5, 1); } transition: all 0.35s cubic-bezier(0, 1, 0.5, 1);
/* display: ''; */
justify-content: 'center';
align-items: 'center' }
.popup-content { .popup-content {
position: relative; position: relative;
margin: auto; margin: auto;
src/container/Login.js
View file @ d5e9699b
...@@ -43,8 +43,8 @@ class Login extends Component { ...@@ -43,8 +43,8 @@ class Login extends Component {
} }
api.create().login(payload).then((response) => { api.create().login(payload).then((response) => {
if (response.data.status === 'success') { if (response.data.status === 'success') {
this.props.history.push('/home/beranda')
localStorage.setItem(Constant.TOKEN, response.data.data.token) localStorage.setItem(Constant.TOKEN, response.data.data.token)
this.props.history.push('/home/beranda')
} else { } else {
alert(response.data.message) alert(response.data.message)
} }
......
src/container/Otorisasi/UserRole.js
View file @ d5e9699b
...@@ -6,6 +6,8 @@ import Images from "../../assets/Images"; ...@@ -6,6 +6,8 @@ import Images from "../../assets/Images";
import MUIDataTable from "mui-datatables"; import MUIDataTable from "mui-datatables";
import AddRole from './UserRole/AddRole'; import AddRole from './UserRole/AddRole';
import EditRole from './UserRole/EditRole' import EditRole from './UserRole/EditRole'
import api from "../../api";
import { titleCase } from "../../library/Utils";
var ct = require("../../library/CustomTable"); var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable()); const getMuiTheme = () => createMuiTheme(ct.customTable());
...@@ -15,10 +17,45 @@ export default class UserRole extends Component { ...@@ -15,10 +17,45 @@ export default class UserRole extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
this.state = { this.state = {
listRole: [],
paramsData: {},
add: false, add: false,
edit: false edit: false
} }
} }
componentDidMount() {
this.getRole()
}
closeEdit() {
this.setState({edit: false})
}
closeAdd() {
this.setState({add: false})
}
getRole() {
api.create().getRole().then((response) => {
if (response.data.status == 'success') {
let data = response.data.data
let listData = data.map((item,index) => {
return [index, item.role_id, item.role_name, item.access, item.status]
})
console.log(listData)
this.setState({listRole: listData})
// this.setState({listRole: response.data.data}, () => {
// console.log(this.state.listRole)
// })
} else {
alert(response.data.message)
}
// console.log(response.data.data)
})
}
render() { render() {
const columns = [{ const columns = [{
name: "Action", name: "Action",
...@@ -32,7 +69,7 @@ export default class UserRole extends Component { ...@@ -32,7 +69,7 @@ export default class UserRole extends Component {
cursor: 'pointer', cursor: 'pointer',
borderColor: 'transparent', borderColor: 'transparent',
}} }}
onClick={() => this.setState({edit: true})} onClick={() => this.setState({edit: true, paramsData: tableMeta.rowData})}
> >
<img src={Images.editCopy} /> <img src={Images.editCopy} />
</button> </button>
...@@ -57,12 +94,23 @@ export default class UserRole extends Component { ...@@ -57,12 +94,23 @@ export default class UserRole extends Component {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ display: 'flex', width: 250 }}> <div style={{ display: 'flex', width: 250 }}>
{val} {titleCase(val)}
</div > </div >
); );
} }
} }
}, "Hak Akses", "Status"] }, {
name: "Hak Akses",
options: {
customBodyRender: (val, tableMeta) => {
return (
<div style={{ display: 'flex'}}>
{val + ' Modul'}
</div >
);
}
}
}, "Status"]
const data = [ const data = [
["1", "1", "Laporan Bulanan - September 2020", "1 (20 Oktober 2020)", "Belum Disetujui"], ["1", "1", "Laporan Bulanan - September 2020", "1 (20 Oktober 2020)", "Belum Disetujui"],
["2", "2", "Laporan Bulanan - September 2020", "1 (20 Oktober 2020)", "Belum Disetujui"], ["2", "2", "Laporan Bulanan - September 2020", "1 (20 Oktober 2020)", "Belum Disetujui"],
...@@ -80,7 +128,7 @@ export default class UserRole extends Component { ...@@ -80,7 +128,7 @@ export default class UserRole extends Component {
<div style={{width: '60%', justifyContent: 'center', display: 'flex', borderWidth: 2, alignItems: 'center' }}> <div style={{width: '60%', justifyContent: 'center', display: 'flex', borderWidth: 2, alignItems: 'center' }}>
<div style={{width: '50%', backgroundColor:'white', padding: 10, borderRadius: 7.5, flexDirection: 'row', display: 'flex'}}> <div style={{width: '50%', backgroundColor:'white', padding: 10, borderRadius: 7.5, flexDirection: 'row', display: 'flex'}}>
<SearchIcon/> <SearchIcon/>
<input type="text" style={{flexGrow: 1, marginLeft: 10}}/> <input type="text" placeholder={'Search Role'} style={{flexGrow: 1, marginLeft: 10}}/>
</div> </div>
</div> </div>
{/* <label style={{ color: 'white', width: '60%', justifyContent: 'center', display: 'flex', backgroundColor: 'white', borderWidth: 2, alignItems: 'center' }}>Search</label> */} {/* <label style={{ color: 'white', width: '60%', justifyContent: 'center', display: 'flex', backgroundColor: 'white', borderWidth: 2, alignItems: 'center' }}>Search</label> */}
...@@ -91,15 +139,25 @@ export default class UserRole extends Component { ...@@ -91,15 +139,25 @@ export default class UserRole extends Component {
<div style={{ padding: 25 }}> <div style={{ padding: 25 }}>
<MuiThemeProvider theme={getMuiTheme()}> <MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable <MUIDataTable
data={data} data={this.state.listRole}
columns={columns} columns={columns}
options={options} options={options}
/> />
</MuiThemeProvider> </MuiThemeProvider>
</div> </div>
</div> </div>
{this.state.add && <AddRole/>} {this.state.add && (
{this.state.edit && <EditRole/>} <AddRole
onClickClose={this.closeAdd.bind(this)}
data={this.state.paramsData}
/>
)}
{this.state.edit && (
<EditRole
onClickClose={this.closeEdit.bind(this)}
data={this.state.paramsData}
/>
)}
</div> </div>
); );
} }
......
src/container/Otorisasi/UserRole/AddRole.js
View file @ d5e9699b
...@@ -4,7 +4,7 @@ import { TextField } from '@material-ui/core'; ...@@ -4,7 +4,7 @@ import { TextField } from '@material-ui/core';
export default class CreateUnitBisnis extends Component { export default class CreateUnitBisnis extends Component {
render() { render() {
return ( return (
<div className="test app-popup-show" style={{ paddingTop: 100 }}> <div className="test app-popup-show" style={{display: 'flex', justifyContent: 'center', alignItems: 'center'}}>
<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" style={{ backgroundColor: '#51c6ea', 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' }}>
...@@ -62,7 +62,6 @@ export default class CreateUnitBisnis extends Component { ...@@ -62,7 +62,6 @@ export default class CreateUnitBisnis extends Component {
</TextField> </TextField>
</div> </div>
</div> </div>
</div> </div>
<div className="border-top grid grid-2x" style={{ height: 56, backgroundColor: '#f5f5f5', paddingLeft: 20, paddingRight: 20 }}> <div className="border-top grid grid-2x" style={{ height: 56, backgroundColor: '#f5f5f5', paddingLeft: 20, paddingRight: 20 }}>
......
src/container/Otorisasi/UserRole/EditRole.js
View file @ d5e9699b
...@@ -4,7 +4,7 @@ import { TextField } from '@material-ui/core'; ...@@ -4,7 +4,7 @@ import { TextField } from '@material-ui/core';
export default class CreateUnitBisnis extends Component { export default class CreateUnitBisnis extends Component {
render() { render() {
return ( return (
<div className="test app-popup-show" style={{ paddingTop: 100 }}> <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" style={{ backgroundColor: '#51c6ea', 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' }}>
...@@ -29,10 +29,12 @@ export default class CreateUnitBisnis extends Component { ...@@ -29,10 +29,12 @@ export default class CreateUnitBisnis extends Component {
<div className="margin-bottom-20px"> <div className="margin-bottom-20px">
<TextField <TextField
style={{ width: '100%' }} style={{ width: '100%' }}
id="periode" id="id"
select label="ID"
label="Berlaku Mulai" disabled
// value={this.state.periode} // id="outlined-read-only-input"
variant="filled"
value={1}
onChange={(e) => null} onChange={(e) => null}
> >
{/* {periode.map((option) => ( {/* {periode.map((option) => (
...@@ -45,13 +47,29 @@ export default class CreateUnitBisnis extends Component { ...@@ -45,13 +47,29 @@ export default class CreateUnitBisnis extends Component {
</div> </div>
<div className="column-2"> <div className="column-2">
<div className="margin-bottom-20px">
<TextField
style={{ width: '100%'}}
id="standard-helperText"
label="Helper text"
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="column-1">
<div className="margin-bottom-20px"> <div className="margin-bottom-20px">
<TextField <TextField
style={{ width: '100%' }} style={{ width: '100%' }}
id="unit" id="id"
select label="ID"
label="Unit Bisnis" disabled
// value={this.state.periode} // id="outlined-read-only-input"
variant="filled"
value={1}
onChange={(e) => null} onChange={(e) => null}
> >
{/* {periode.map((option) => ( {/* {periode.map((option) => (
...@@ -63,6 +81,40 @@ export default class CreateUnitBisnis extends Component { ...@@ -63,6 +81,40 @@ export default class CreateUnitBisnis extends Component {
</div> </div>
</div> </div>
<div className="column-2">
<div className="margin-bottom-20px">
<TextField
style={{ width: '100%'}}
id="standard-helperText"
label="Helper text"
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="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>
</div>
</div>
</div> </div>
<div className="border-top grid grid-2x" style={{ height: 56, backgroundColor: '#f5f5f5', paddingLeft: 20, paddingRight: 20 }}> <div className="border-top grid grid-2x" style={{ height: 56, backgroundColor: '#f5f5f5', paddingLeft: 20, paddingRight: 20 }}>
......
src/library/Constant.js
View file @ d5e9699b
const Constant = { const Constant = {
TOKEN: 'TOKEN', TOKEN: null,
USER: null, USER: null,
} }
......
src/library/Utils.js 0 → 100644
View file @ d5e9699b
export function titleCase(text) {
var value = String(text).replace(/\./g, ' ')
.replace(/\s/g, ' ')
.replace(/^(.)/, function($1) { return $1.toUpperCase(); })
// .replace(/\s(.)/g, function($1) { return $1.toUpperCase(); })
return value
}
\ No newline at end of file
src/router/index.js
View file @ d5e9699b
...@@ -26,7 +26,7 @@ import Constant from "../library/Constant"; ...@@ -26,7 +26,7 @@ import Constant from "../library/Constant";
export default function BasicExample() { export default function BasicExample() {
return ( return (
<Router> <Router basename={"/tia-web"}>
<Switch> <Switch>
<Route exact path="/"> <Route exact path="/">
<Redirect <Redirect
...@@ -55,7 +55,7 @@ export default function BasicExample() { ...@@ -55,7 +55,7 @@ export default function BasicExample() {
} }
function PrivateRoute({ children, ...rest }) { function PrivateRoute({ children, ...rest }) {
const logged = localStorage.getItem(Constant.TOKEN) == 'TOKEN'? false : true const logged = localStorage.getItem(Constant.TOKEN) !== null? true : false
return ( return (
<Route <Route
{...rest} {...rest}
......
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