Commit d0695bc5 authored by Rifka Kurnia Irfiana's avatar Rifka Kurnia Irfiana

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

parents 9e511e14 6bceff12
{
"presets": ["@babel/preset-react", "@babel/preset-env"],
"plugins": ["emotion"]
}
\ No newline at end of file
...@@ -1191,11 +1191,94 @@ ...@@ -1191,11 +1191,94 @@
} }
} }
}, },
"@emotion/cache": {
"version": "10.0.29",
"resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-10.0.29.tgz",
"integrity": "sha512-fU2VtSVlHiF27empSbxi1O2JFdNWZO+2NFHfwO0pxgTep6Xa3uGb+3pVKfLww2l/IBGLNEZl5Xf/++A4wAYDYQ==",
"requires": {
"@emotion/sheet": "0.9.4",
"@emotion/stylis": "0.8.5",
"@emotion/utils": "0.11.3",
"@emotion/weak-memoize": "0.2.5"
}
},
"@emotion/core": {
"version": "10.0.35",
"resolved": "https://registry.npmjs.org/@emotion/core/-/core-10.0.35.tgz",
"integrity": "sha512-sH++vJCdk025fBlRZSAhkRlSUoqSqgCzYf5fMOmqqi3bM6how+sQpg3hkgJonj8GxXM4WbD7dRO+4tegDB9fUw==",
"requires": {
"@babel/runtime": "^7.5.5",
"@emotion/cache": "^10.0.27",
"@emotion/css": "^10.0.27",
"@emotion/serialize": "^0.11.15",
"@emotion/sheet": "0.9.4",
"@emotion/utils": "0.11.3"
}
},
"@emotion/css": {
"version": "10.0.27",
"resolved": "https://registry.npmjs.org/@emotion/css/-/css-10.0.27.tgz",
"integrity": "sha512-6wZjsvYeBhyZQYNrGoR5yPMYbMBNEnanDrqmsqS1mzDm1cOTu12shvl2j4QHNS36UaTE0USIJawCH9C8oW34Zw==",
"requires": {
"@emotion/serialize": "^0.11.15",
"@emotion/utils": "0.11.3",
"babel-plugin-emotion": "^10.0.27"
}
},
"@emotion/hash": { "@emotion/hash": {
"version": "0.8.0", "version": "0.8.0",
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz", "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz",
"integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==" "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow=="
}, },
"@emotion/memoize": {
"version": "0.7.4",
"resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.4.tgz",
"integrity": "sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw=="
},
"@emotion/serialize": {
"version": "0.11.16",
"resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-0.11.16.tgz",
"integrity": "sha512-G3J4o8by0VRrO+PFeSc3js2myYNOXVJ3Ya+RGVxnshRYgsvErfAOglKAiy1Eo1vhzxqtUvjCyS5gtewzkmvSSg==",
"requires": {
"@emotion/hash": "0.8.0",
"@emotion/memoize": "0.7.4",
"@emotion/unitless": "0.7.5",
"@emotion/utils": "0.11.3",
"csstype": "^2.5.7"
},
"dependencies": {
"csstype": {
"version": "2.6.13",
"resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.13.tgz",
"integrity": "sha512-ul26pfSQTZW8dcOnD2iiJssfXw0gdNVX9IJDH/X3K5DGPfj+fUYe3kB+swUY6BF3oZDxaID3AJt+9/ojSAE05A=="
}
}
},
"@emotion/sheet": {
"version": "0.9.4",
"resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-0.9.4.tgz",
"integrity": "sha512-zM9PFmgVSqBw4zL101Q0HrBVTGmpAxFZH/pYx/cjJT5advXguvcgjHFTCaIO3enL/xr89vK2bh0Mfyj9aa0ANA=="
},
"@emotion/stylis": {
"version": "0.8.5",
"resolved": "https://registry.npmjs.org/@emotion/stylis/-/stylis-0.8.5.tgz",
"integrity": "sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ=="
},
"@emotion/unitless": {
"version": "0.7.5",
"resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz",
"integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg=="
},
"@emotion/utils": {
"version": "0.11.3",
"resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-0.11.3.tgz",
"integrity": "sha512-0o4l6pZC+hI88+bzuaX/6BgOvQVhbt2PfmxauVaYOGgbsAw14wdKyvMCZXnsnsHys94iadcF+RG/wZyx6+ZZBw=="
},
"@emotion/weak-memoize": {
"version": "0.2.5",
"resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz",
"integrity": "sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA=="
},
"@hapi/address": { "@hapi/address": {
"version": "2.1.4", "version": "2.1.4",
"resolved": "https://registry.npmjs.org/@hapi/address/-/address-2.1.4.tgz", "resolved": "https://registry.npmjs.org/@hapi/address/-/address-2.1.4.tgz",
...@@ -2955,6 +3038,23 @@ ...@@ -2955,6 +3038,23 @@
"object.assign": "^4.1.0" "object.assign": "^4.1.0"
} }
}, },
"babel-plugin-emotion": {
"version": "10.0.33",
"resolved": "https://registry.npmjs.org/babel-plugin-emotion/-/babel-plugin-emotion-10.0.33.tgz",
"integrity": "sha512-bxZbTTGz0AJQDHm8k6Rf3RQJ8tX2scsfsRyKVgAbiUPUNIRtlK+7JxP+TAd1kRLABFxe0CFm2VdK4ePkoA9FxQ==",
"requires": {
"@babel/helper-module-imports": "^7.0.0",
"@emotion/hash": "0.8.0",
"@emotion/memoize": "0.7.4",
"@emotion/serialize": "^0.11.16",
"babel-plugin-macros": "^2.0.0",
"babel-plugin-syntax-jsx": "^6.18.0",
"convert-source-map": "^1.5.0",
"escape-string-regexp": "^1.0.5",
"find-root": "^1.1.0",
"source-map": "^0.5.7"
}
},
"babel-plugin-istanbul": { "babel-plugin-istanbul": {
"version": "5.2.0", "version": "5.2.0",
"resolved": "https://registry.npmjs.org/babel-plugin-istanbul/-/babel-plugin-istanbul-5.2.0.tgz", "resolved": "https://registry.npmjs.org/babel-plugin-istanbul/-/babel-plugin-istanbul-5.2.0.tgz",
...@@ -3033,6 +3133,11 @@ ...@@ -3033,6 +3133,11 @@
"resolved": "https://registry.npmjs.org/babel-plugin-named-asset-import/-/babel-plugin-named-asset-import-0.3.6.tgz", "resolved": "https://registry.npmjs.org/babel-plugin-named-asset-import/-/babel-plugin-named-asset-import-0.3.6.tgz",
"integrity": "sha512-1aGDUfL1qOOIoqk9QKGIo2lANk+C7ko/fqH0uIyC71x3PEGz0uVP8ISgfEsFuG+FKmjHTvFK/nNM8dowpmUxLA==" "integrity": "sha512-1aGDUfL1qOOIoqk9QKGIo2lANk+C7ko/fqH0uIyC71x3PEGz0uVP8ISgfEsFuG+FKmjHTvFK/nNM8dowpmUxLA=="
}, },
"babel-plugin-syntax-jsx": {
"version": "6.18.0",
"resolved": "https://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz",
"integrity": "sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY="
},
"babel-plugin-syntax-object-rest-spread": { "babel-plugin-syntax-object-rest-spread": {
"version": "6.13.0", "version": "6.13.0",
"resolved": "https://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz", "resolved": "https://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz",
...@@ -6623,6 +6728,11 @@ ...@@ -6623,6 +6728,11 @@
"pkg-dir": "^3.0.0" "pkg-dir": "^3.0.0"
} }
}, },
"find-root": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz",
"integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng=="
},
"find-up": { "find-up": {
"version": "3.0.0", "version": "3.0.0",
"resolved": "https://registry.npmjs.org/find-up/-/find-up-3.0.0.tgz", "resolved": "https://registry.npmjs.org/find-up/-/find-up-3.0.0.tgz",
...@@ -15658,6 +15768,14 @@ ...@@ -15658,6 +15768,14 @@
} }
} }
}, },
"react-spinners": {
"version": "0.9.0",
"resolved": "https://registry.npmjs.org/react-spinners/-/react-spinners-0.9.0.tgz",
"integrity": "sha512-+x6eD8tn/aYLdxZjNW7fSR1uoAXLb9qq6TFYZR1dFweJvckcf/HfP8Pa/cy5HOvB/cvI4JgrYXTjh2Me3S6Now==",
"requires": {
"@emotion/core": "^10.0.15"
}
},
"react-to-print": { "react-to-print": {
"version": "2.9.0", "version": "2.9.0",
"resolved": "https://registry.npmjs.org/react-to-print/-/react-to-print-2.9.0.tgz", "resolved": "https://registry.npmjs.org/react-to-print/-/react-to-print-2.9.0.tgz",
......
...@@ -38,6 +38,7 @@ ...@@ -38,6 +38,7 @@
"react-number-format": "^4.4.1", "react-number-format": "^4.4.1",
"react-router-dom": "^5.2.0", "react-router-dom": "^5.2.0",
"react-scripts": "3.4.1", "react-scripts": "3.4.1",
"react-spinners": "^0.9.0",
"react-tooltip": "^4.2.8" "react-tooltip": "^4.2.8"
}, },
"scripts": { "scripts": {
......
This diff is collapsed.
...@@ -604,7 +604,7 @@ export default class ReportItems extends Component { ...@@ -604,7 +604,7 @@ export default class ReportItems extends Component {
if (response.data.status == 'success') { if (response.data.status == 'success') {
let data = response.data.data let data = response.data.data
let listData = data.sort((a, b) => a.item_report_id - b.item_report_id).map((item, index) => { let listData = data.sort((a, b) => a.item_report_id - b.item_report_id).map((item, index) => {
return [index, item.item_report_id, item.report_name, item.company_name, item.order, item.description, item.parent, item.uom, item.weight, item.type_item_report_name, item.status] return [index, item.item_report_id, item.report_name, item.company_name, item.order, item.description, item.parent, item.uom, item.weight, item.type_item_report_name, item.kpi_type, item.max_ach, item.formula_ytd, item.status]
}) })
this.setState({ dataTable: listData, listData: response.data.data }, () => { this.setState({ dataTable: listData, listData: response.data.data }, () => {
console.log(this.state.dataTable); console.log(this.state.dataTable);
...@@ -880,7 +880,7 @@ export default class ReportItems extends Component { ...@@ -880,7 +880,7 @@ export default class ReportItems extends Component {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<span style={{ color: tableMeta.rowData[10] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span> <span style={{ color: tableMeta.rowData[13] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
...@@ -892,7 +892,7 @@ export default class ReportItems extends Component { ...@@ -892,7 +892,7 @@ export default class ReportItems extends Component {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<span style={{ color: tableMeta.rowData[10] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span> <span style={{ color: tableMeta.rowData[13] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
...@@ -904,7 +904,7 @@ export default class ReportItems extends Component { ...@@ -904,7 +904,7 @@ export default class ReportItems extends Component {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<span style={{ color: tableMeta.rowData[10] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span> <span style={{ color: tableMeta.rowData[13] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
...@@ -916,7 +916,7 @@ export default class ReportItems extends Component { ...@@ -916,7 +916,7 @@ export default class ReportItems extends Component {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<span style={{ color: tableMeta.rowData[10] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span> <span style={{ color: tableMeta.rowData[13] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
...@@ -928,7 +928,7 @@ export default class ReportItems extends Component { ...@@ -928,7 +928,7 @@ export default class ReportItems extends Component {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<span style={{ color: tableMeta.rowData[10] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span> <span style={{ color: tableMeta.rowData[13] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
...@@ -940,7 +940,7 @@ export default class ReportItems extends Component { ...@@ -940,7 +940,7 @@ export default class ReportItems extends Component {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<span style={{ color: tableMeta.rowData[10] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span> <span style={{ color: tableMeta.rowData[13] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
...@@ -952,7 +952,7 @@ export default class ReportItems extends Component { ...@@ -952,7 +952,7 @@ export default class ReportItems extends Component {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<span style={{ color: tableMeta.rowData[10] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span> <span style={{ color: tableMeta.rowData[13] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
...@@ -964,7 +964,7 @@ export default class ReportItems extends Component { ...@@ -964,7 +964,7 @@ export default class ReportItems extends Component {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<span style={{ color: tableMeta.rowData[10] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span> <span style={{ color: tableMeta.rowData[13] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
...@@ -976,7 +976,43 @@ export default class ReportItems extends Component { ...@@ -976,7 +976,43 @@ export default class ReportItems extends Component {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<span style={{ color: tableMeta.rowData[10] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span> <span style={{ color: tableMeta.rowData[13] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div >
);
}
}
},
{
name: "KPI Type",
options: {
customBodyRender: (val, tableMeta) => {
return (
<div style={{ display: 'flex' }}>
<span style={{ color: tableMeta.rowData[13] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div >
);
}
}
},
{
name: "Max Achievement",
options: {
customBodyRender: (val, tableMeta) => {
return (
<div style={{ display: 'flex' }}>
<span style={{ color: tableMeta.rowData[13] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div >
);
}
}
},
{
name: "Formula YTD",
options: {
customBodyRender: (val, tableMeta) => {
return (
<div style={{ display: 'flex' }}>
<span style={{ color: tableMeta.rowData[13] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
...@@ -988,7 +1024,7 @@ export default class ReportItems extends Component { ...@@ -988,7 +1024,7 @@ export default class ReportItems extends Component {
customBodyRender: (val, tableMeta) => { customBodyRender: (val, tableMeta) => {
return ( return (
<div style={{ display: 'flex' }}> <div style={{ display: 'flex' }}>
<span style={{ color: tableMeta.rowData[10] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span> <span style={{ color: tableMeta.rowData[13] === "Active" ? "#656565" : 'rgba(0, 0, 0, 0.25)' }}>{val}</span>
</div > </div >
); );
} }
......
...@@ -15,7 +15,17 @@ import { ExcelRenderer } from 'react-excel-renderer'; ...@@ -15,7 +15,17 @@ import { ExcelRenderer } from 'react-excel-renderer';
import ReactTooltip from "react-tooltip"; import ReactTooltip from "react-tooltip";
import PopUpFailedSave from "../../library/PopUpFailedSave"; import PopUpFailedSave from "../../library/PopUpFailedSave";
import Constant from "../../library/Constant"; import Constant from "../../library/Constant";
import PopUpDelete from "../ApprovalMatrix/PopUpDeleteAM"; import { css } from "@emotion/core";
import HashLoader from "react-spinners/HashLoader";
import ClimbingBoxLoader from "react-spinners/ClimbingBoxLoader"
import SkewLoader from "react-spinners/SkewLoader"
import PropagateLoader from "react-spinners/PropagateLoader"
const override = css`
display: block;
margin: 0 auto;
border-color: red;
`;
var ct = require("../../library/CustomTable"); var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable()); const getMuiTheme = () => createMuiTheme(ct.customTable());
...@@ -24,6 +34,8 @@ const options = ct.customOptions(); ...@@ -24,6 +34,8 @@ const options = ct.customOptions();
const Alert = withStyles({ const Alert = withStyles({
})((props) => <MuiAlert elevation={6} variant="filled" {...props} />); })((props) => <MuiAlert elevation={6} variant="filled" {...props} />);
export default class UserRole extends Component { export default class UserRole extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
...@@ -42,7 +54,8 @@ export default class UserRole extends Component { ...@@ -42,7 +54,8 @@ export default class UserRole extends Component {
buttonEdit: false, buttonEdit: false,
buttonDelete: false, buttonDelete: false,
load: false, load: false,
judul: '' judul: '',
loading: false
} }
} }
...@@ -66,6 +79,7 @@ export default class UserRole extends Component { ...@@ -66,6 +79,7 @@ export default class UserRole extends Component {
} }
getUser() { getUser() {
this.setState({loading: true})
api.create().getUser().then((response) => { api.create().getUser().then((response) => {
if (response.data) { if (response.data) {
if (response.ok) { if (response.ok) {
...@@ -75,7 +89,11 @@ export default class UserRole extends Component { ...@@ -75,7 +89,11 @@ export default class UserRole extends Component {
let listData = data.sort((a, b) => a.user_id - b.user_id).map((item, index) => { let listData = data.sort((a, b) => a.user_id - b.user_id).map((item, index) => {
return [index, item.user_id, item.fullname === null ? '-' : item.fullname, item.email, item.role_name, item.totalCompany, item.status] return [index, item.user_id, item.fullname === null ? '-' : item.fullname, item.email, item.role_name, item.totalCompany, item.status]
}) })
this.setState({ listUser: listData }) this.setState({ listUser: listData }, () => {
setTimeout(() => {
this.setState({loading: false})
}, 2000);
})
} else { } else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }, () => { this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }, () => {
if (response.data.message.includes("Someone Logged In")) { if (response.data.message.includes("Someone Logged In")) {
...@@ -87,10 +105,14 @@ export default class UserRole extends Component { ...@@ -87,10 +105,14 @@ export default class UserRole extends Component {
}) })
} }
} else { } else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' }) this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' }, () => {
this.setState({loading: false})
})
} }
} else { } else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' }) this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' }, () => {
this.setState({loading: false})
})
} }
}) })
} }
...@@ -117,6 +139,7 @@ export default class UserRole extends Component { ...@@ -117,6 +139,7 @@ export default class UserRole extends Component {
} }
searchUser() { searchUser() {
this.setState({loading: true})
let payload = { let payload = {
"keyword": this.state.search "keyword": this.state.search
} }
...@@ -128,7 +151,11 @@ export default class UserRole extends Component { ...@@ -128,7 +151,11 @@ export default class UserRole extends Component {
let listData = data.sort((a, b) => a.user_id - b.user_id).map((item, index) => { let listData = data.sort((a, b) => a.user_id - b.user_id).map((item, index) => {
return [index, item.user_id, item.fullname == null ? '-' : item.fullname, item.email, item.role_name, item.totalCompany, item.status] return [index, item.user_id, item.fullname == null ? '-' : item.fullname, item.email, item.role_name, item.totalCompany, item.status]
}) })
this.setState({ listUser: listData }) this.setState({ listUser: listData }, () => {
setTimeout(() => {
this.setState({loading: false})
}, 1500);
})
} else { } else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }, () => { this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }, () => {
if (response.data.message.includes("Someone Logged In")) { if (response.data.message.includes("Someone Logged In")) {
...@@ -140,10 +167,14 @@ export default class UserRole extends Component { ...@@ -140,10 +167,14 @@ export default class UserRole extends Component {
}) })
} }
} else { } else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' }) this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' }, () => {
this.setState({loading: false})
})
} }
} else { } else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' }) this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' }, () => {
this.setState({loading: false})
})
} }
}) })
} }
...@@ -647,6 +678,16 @@ export default class UserRole extends Component { ...@@ -647,6 +678,16 @@ export default class UserRole extends Component {
} }
} }
}] }]
const loadingComponent = (
<div style={{position: 'absolute', zIndex: 110, top: 0, left: 0, width: '100%', height: '100%', display: 'flex', justifyContent: 'center', alignItems: 'center', background: 'rgba(255,255,255,0.8)'}}>
<PropagateLoader
// css={override}
size={20}
color={"#274B80"}
loading={this.state.loading}
/>
</div>
);
return ( return (
<div style={{ height: this.props.height }}> <div style={{ height: this.props.height }}>
{/* <Row> */} {/* <Row> */}
...@@ -773,7 +814,8 @@ export default class UserRole extends Component { ...@@ -773,7 +814,8 @@ export default class UserRole extends Component {
</div> </div>
</div> </div>
)} )}
<div style={{ padding: 25 }}> <div style={{ padding: 25}}>
{this.state.loading && loadingComponent}
<MuiThemeProvider theme={getMuiTheme()}> <MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable <MUIDataTable
data={this.state.listUser} data={this.state.listUser}
......
...@@ -192,17 +192,17 @@ export default class AddUser extends Component { ...@@ -192,17 +192,17 @@ export default class AddUser extends Component {
var isEmail = this.isEmail(this.state.email) var isEmail = this.isEmail(this.state.email)
if (R.isEmpty(this.state.fullname)) { if (R.isEmpty(this.state.fullname)) {
this.setState({ errorFullname: true, msgErrorFN: 'Fullname Cannot be Empty.' }) this.setState({ errorFullname: true, msgErrorFN: 'Fullname Cannot be Empty' })
} else if (R.isEmpty(this.state.email)) { } else if (R.isEmpty(this.state.email)) {
this.setState({ errorEmail: true, msgErrorEM: 'Email Cannot be Empty.' }) this.setState({ errorEmail: true, msgErrorEM: 'Email Cannot be Empty' })
} else if (!isEmail) { } else if (!isEmail) {
this.setState({ errorEmail: true, msgErrorEM: 'Please enter a valid email address.' }) this.setState({ errorEmail: true, msgErrorEM: 'Please enter a valid email address' })
} else if (R.isNil(this.state.role)) { } else if (R.isNil(this.state.role)) {
this.setState({ errorRoleName: true, msgErrorRN: 'Role Cannot be Empty.' }) this.setState({ errorRoleName: true, msgErrorRN: 'Role Cannot be Empty' })
} else if (R.isNil(this.state.startDate)) { } else if (R.isNil(this.state.startDate)) {
this.setState({ errorStartDate: true, msgErrorSD: 'Valid From Cannot be Empty.' }) this.setState({ errorStartDate: true, msgErrorSD: 'Valid From Cannot be Empty' })
} else if (R.isNil(this.state.endDate)) { } else if (R.isNil(this.state.endDate)) {
this.setState({ errorEndDate: true, msgErrorED: 'Valid To Cannot be Empty.' }) this.setState({ errorEndDate: true, msgErrorED: 'Valid To Cannot be Empty' })
} else if (this.state.company.length < 1) { } else if (this.state.company.length < 1) {
this.setState({ alert: true, messageAlert: 'Authorization company cannot be empty', tipeAlert: 'warning' }) this.setState({ alert: true, messageAlert: 'Authorization company cannot be empty', tipeAlert: 'warning' })
} }
......
...@@ -202,17 +202,17 @@ export default class EditUser extends Component { ...@@ -202,17 +202,17 @@ export default class EditUser extends Component {
// console.log(this.state.tempData) // console.log(this.state.tempData)
if (R.isEmpty(this.state.tempData.fullname)) { if (R.isEmpty(this.state.tempData.fullname)) {
this.setState({ errorFullname: true, msgErrorFN: 'Full Name Cannot be Empty.' }) this.setState({ errorFullname: true, msgErrorFN: 'Full Name Cannot be Empty' })
} else if (R.isEmpty(this.state.tempData.email)) { } else if (R.isEmpty(this.state.tempData.email)) {
this.setState({ errorEmail: true, msgErrorEM: 'Email Cannot be Empty.' }) this.setState({ errorEmail: true, msgErrorEM: 'Email Cannot be Empty' })
} else if (!isEmail) { } else if (!isEmail) {
this.setState({ errorEmail: true, msgErrorEM: 'Please enter a valid email address.' }) this.setState({ errorEmail: true, msgErrorEM: 'Please enter a valid email address' })
} else if (R.isNil(this.state.role)) { } else if (R.isNil(this.state.role)) {
this.setState({ errorRoleName: true, msgErrorRN: 'Role Cannot be Empty.' }) this.setState({ errorRoleName: true, msgErrorRN: 'Role Cannot be Empty' })
} else if (R.isNil(this.state.tempData.start_date)) { } else if (R.isNil(this.state.tempData.start_date)) {
this.setState({ errorStartDate: true, msgErrorSD: 'Valid From Cannot be Empty.' }) this.setState({ errorStartDate: true, msgErrorSD: 'Valid From Cannot be Empty' })
} else if (R.isNil(this.state.tempData.end_date)) { } else if (R.isNil(this.state.tempData.end_date)) {
this.setState({ errorEndDate: true, msgErrorED: 'Valid To Cannot be Empty.' }) this.setState({ errorEndDate: true, msgErrorED: 'Valid To Cannot be Empty' })
} }
// else if (this.state.privileges.length < 1) { // else if (this.state.privileges.length < 1) {
// alert('Hak Akses belum di pilih !!') // alert('Hak Akses belum di pilih !!')
......
...@@ -14,6 +14,7 @@ import ReactTooltip from "react-tooltip"; ...@@ -14,6 +14,7 @@ import ReactTooltip from "react-tooltip";
import MuiAlert from '@material-ui/lab/Alert'; import MuiAlert from '@material-ui/lab/Alert';
import { withStyles } from '@material-ui/core/styles'; import { withStyles } from '@material-ui/core/styles';
import Constant from "../../library/Constant"; import Constant from "../../library/Constant";
import PropagateLoader from "react-spinners/PropagateLoader"
var ct = require("../../library/CustomTable"); var ct = require("../../library/CustomTable");
const getMuiTheme = () => createMuiTheme(ct.customTable()); const getMuiTheme = () => createMuiTheme(ct.customTable());
...@@ -37,11 +38,13 @@ class UserRole extends Component { ...@@ -37,11 +38,13 @@ class UserRole extends Component {
buttonCreate: false, buttonCreate: false,
buttonEdit: false, buttonEdit: false,
buttonDelete: false, buttonDelete: false,
load: false load: false,
loading: false
} }
} }
componentDidMount() { componentDidMount() {
this.getRole() this.getRole()
this.getPermission() this.getPermission()
} }
...@@ -55,6 +58,7 @@ class UserRole extends Component { ...@@ -55,6 +58,7 @@ class UserRole extends Component {
} }
getRole() { getRole() {
this.setState({loading: true})
api.create().getRole().then((response) => { api.create().getRole().then((response) => {
if (response.data) { if (response.data) {
if (response.ok) { if (response.ok) {
...@@ -64,13 +68,17 @@ class UserRole extends Component { ...@@ -64,13 +68,17 @@ class UserRole extends Component {
return [index, item.role_id, item.role_name, item.access, item.status] return [index, item.role_id, item.role_name, item.access, item.status]
}) })
// console.log(listData) // console.log(listData)
this.setState({ listRole: listData }) this.setState({ listRole: listData }, () => {
setTimeout(() => {
this.setState({loading: false})
}, 2000);
})
// this.setState({listRole: response.data.data}, () => { // this.setState({listRole: response.data.data}, () => {
// console.log(this.state.listRole) // console.log(this.state.listRole)
// }) // })
} else { } else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' }, () => { this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning', loading: false}, () => {
if (response.data.message.includes("Someone Logged In")) { if (response.data.message.includes("Someone Logged In")) {
setTimeout(() => { setTimeout(() => {
localStorage.removeItem(Constant.TOKEN) localStorage.removeItem(Constant.TOKEN)
...@@ -80,10 +88,10 @@ class UserRole extends Component { ...@@ -80,10 +88,10 @@ class UserRole extends Component {
}) })
} }
} else { } else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' }) this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error', loading: false })
} }
} else { } else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' }) this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error', loading: false })
} }
}) })
} }
...@@ -283,6 +291,16 @@ class UserRole extends Component { ...@@ -283,6 +291,16 @@ class UserRole extends Component {
} }
} }
}] }]
const loadingComponent = (
<div style={{position: 'absolute', zIndex: 110, top: 0, left: 0, width: '100%', height: '100%', display: 'flex', justifyContent: 'center', alignItems: 'center', background: 'rgba(255,255,255,0.8)'}}>
<PropagateLoader
// css={override}
size={20}
color={"#274B80"}
loading={this.state.loading}
/>
</div>
);
return ( return (
<div style={{ height: this.props.height }}> <div style={{ height: this.props.height }}>
{/* <Row> */} {/* <Row> */}
...@@ -338,6 +356,7 @@ class UserRole extends Component { ...@@ -338,6 +356,7 @@ class UserRole extends Component {
</div> </div>
)} )}
<div style={{ padding: 25 }}> <div style={{ padding: 25 }}>
{this.state.loading && loadingComponent}
<MuiThemeProvider theme={getMuiTheme()}> <MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable <MUIDataTable
data={this.state.listRole} data={this.state.listRole}
......
...@@ -111,13 +111,13 @@ export default class AddRole extends Component { ...@@ -111,13 +111,13 @@ export default class AddRole extends Component {
validasi() { validasi() {
if (R.isEmpty(this.state.roleName)) { if (R.isEmpty(this.state.roleName)) {
this.setState({ errorRoleName: true, msgErrorRN: 'Role Cannot be Empty.' }) this.setState({ errorRoleName: true, msgErrorRN: 'Role Cannot be Empty' })
} else if (R.isNil(this.state.startDate)) { } else if (R.isNil(this.state.startDate)) {
this.setState({ errorStartDate: true, msgErrorSD: 'Valid From Cannot be Empty.' }) this.setState({ errorStartDate: true, msgErrorSD: 'Valid From Cannot be Empty' })
} else if (R.isNil(this.state.endDate)) { } else if (R.isNil(this.state.endDate)) {
this.setState({ errorEndDate: true, msgErrorED: 'Valid To Cannot be Empty.' }) this.setState({ errorEndDate: true, msgErrorED: 'Valid To Cannot be Empty' })
} else if (this.state.privileges.length < 1) { } else if (this.state.privileges.length < 1) {
this.setState({ alert: true, messageAlert: 'You Must Choose the Access Rights.', tipeAlert: 'warning' }) this.setState({ alert: true, messageAlert: 'You Must Choose the Access Rights', tipeAlert: 'warning' })
} else { } else {
this.addRole() this.addRole()
} }
......
...@@ -124,13 +124,13 @@ export default class EditRole extends Component { ...@@ -124,13 +124,13 @@ export default class EditRole extends Component {
validasi() { validasi() {
if (R.isEmpty(this.state.tempData.role_name)) { if (R.isEmpty(this.state.tempData.role_name)) {
this.setState({ errorRoleName: true, msgErrorRN: 'Role Cannot be Empty.' }) this.setState({ errorRoleName: true, msgErrorRN: 'Role Cannot be Empty' })
} else if (R.isNil(this.state.tempData.start_date)) { } else if (R.isNil(this.state.tempData.start_date)) {
this.setState({ errorStartDate: true, msgErrorSD: 'Valid From Cannot be Empty.' }) this.setState({ errorStartDate: true, msgErrorSD: 'Valid From Cannot be Empty' })
} else if (R.isNil(this.state.tempData.end_date)) { } else if (R.isNil(this.state.tempData.end_date)) {
this.setState({ errorEndDate: true, msgErrorED: 'Valid To Cannot be Empty.' }) this.setState({ errorEndDate: true, msgErrorED: 'Valid To Cannot be Empty' })
} else if (this.state.privileges.length < 1) { } else if (this.state.privileges.length < 1) {
this.setState({ alert: true, messageAlert: 'You Must Choose the Access Rights.', tipeAlert: 'warning' }) this.setState({ alert: true, messageAlert: 'You Must Choose the Access Rights', tipeAlert: 'warning' })
} else { } else {
this.updateRole() this.updateRole()
} }
......
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