Skip to content

T
Tia-dev
Commit 03710feb authored by a.bairuha's avatar a.bairuha
Browse files
Options

update standarisasi ui

parent 72013a79
Hide whitespace changes
Inline Side-by-side
Showing with 139 additions and 79 deletions
src/container/MasterData/ReportItems.js
View file @ 03710feb
......@@ -575,7 +575,7 @@ export default class ReportItems extends Component {
api.create().uploadReportItems(this.state.payload).then(response => {
if (response.data) {
if (response.data.status === "success") {
alert(response.data.message)
// alert(response.data.message)
this.getData()
this.setState({ itemReport: true, alert: true, messageAlert: response.data.message, tipeAlert: 'success' })
} else {
......@@ -824,7 +824,7 @@ export default class ReportItems extends Component {
</button>
</a>
<ReactTooltip border={true} id="visualisasi" place="bottom" type="light" effect="solid" />
<a data-tip={'Add'} data-for="tambah">
<a data-tip={'Add New'} data-for="tambah">
<button
style={{
backgroundColor: 'transparent',
......@@ -881,7 +881,7 @@ export default class ReportItems extends Component {
style={{ marginRight: 20 }}
>
<div style={{ width: 102, height: 30, border: 'solid 1px #354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<span style={{ color: '#354960', fontSize: 11 }}>Batal</span>
<span style={{ color: '#354960', fontSize: 11 }}>Cancel</span>
</div>
</button>
<button
......@@ -890,7 +890,7 @@ export default class ReportItems extends Component {
style={{}}
>
<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 }}>Save</span>
</div>
</button>
</div>
......
src/container/MasterData/formReportItems/CreateReportItems.js
View file @ 03710feb
......@@ -147,32 +147,32 @@ export default class CreateReportItems extends Component {
validasi() {
// alert('coba ya')
if (R.isNil(this.state.reportType)) {
this.setState({errorJenisLaporan: true, msgErrorJenisLaporan: 'Report type cannot be empty.'})
this.setState({errorJenisLaporan: true, msgErrorJenisLaporan: 'Report type is required.'})
} else if (R.isNil(this.state.company)){
this.setState({ errorPerusahaan: true, msgErrorPerusahaan: 'Company cannot be empty.'})
this.setState({ errorPerusahaan: true, msgErrorPerusahaan: 'Company is required.'})
} else if (R.isEmpty(this.state.order)) {
this.setState({ errorOrder: true, msgErrorOrder: 'Order cannot be empty.' })
this.setState({ errorOrder: true, msgErrorOrder: 'Order is required.' })
}
else if (R.isEmpty(this.state.description)) {
this.setState({ errorDesc: true, msgErrorDesc: 'Description cannot be empty.' })
this.setState({ errorDesc: true, msgErrorDesc: 'Description is required.' })
}
else if (R.isNil(this.state.InputType)) {
this.setState({ errorTipeData: true, msgErrorTipeData: 'Data type cannot be empty' })
this.setState({ errorTipeData: true, msgErrorTipeData: 'Data type is required.' })
}
else if (this.state.disabledFormula === false && R.isEmpty(this.state.formula)) {
this.setState({ errorFormula: true, msgErrorFormula: 'Formula cannot be empty' })
this.setState({ errorFormula: true, msgErrorFormula: 'Formula is required.' })
}
else if (this.state.disabledValue === false && R.isEmpty(this.state.realVal)) {
this.setState({ errorRV: true, msgErrorRV: 'True Value cannot be empty' })
this.setState({ errorRV: true, msgErrorRV: 'True value is required.' })
}
else if (this.state.disabledCondt === false && R.isEmpty(this.state.condition)) {
this.setState({ errorCondition: true, msgErrorCondition: 'False Condition cannot be empty' })
this.setState({ errorCondition: true, msgErrorCondition: 'False condition is required.' })
}
else if (R.isNil(this.state.startDate)) {
this.setState({ errorStartDate: true, msgErrorSD: 'Start Date cannot be empty' })
this.setState({ errorStartDate: true, msgErrorSD: 'Start date is required.' })
}
else if (R.isNil(this.state.endDate)) {
this.setState({ errorEndDate: true, msgErrorED: 'End Date cannot be empty' })
this.setState({ errorEndDate: true, msgErrorED: 'End date is required.' })
}
else {
this.addReportItems()
......@@ -338,6 +338,10 @@ export default class CreateReportItems extends Component {
})
}
closeAlert() {
this.setState({ alert: false })
}
render() {
return (
......
src/container/MasterData/formReportItems/EditReportItems.js
View file @ 03710feb
......@@ -128,25 +128,25 @@ export default class EditReportItems extends Component {
validasi() {
// alert('coba ya')
if (R.isNil(this.state.reportType)){
this.setState({errorJenisLaporan: true, msgErrorJenisLaporan: 'Report type cannot be empty'})
this.setState({errorJenisLaporan: true, msgErrorJenisLaporan: 'Report type is required.'})
} else if (R.isNil(this.state.company)){
this.setState({ errorPerusahaan: true, msgErrorPerusahaan: 'Company cannot be empty'})
this.setState({ errorPerusahaan: true, msgErrorPerusahaan: 'Company is required.'})
} else if (R.isEmpty(this.state.tempData.order)) {
this.setState({ errorOrder: true, msgErrorOrder: 'Order cannot be empty.' })
this.setState({ errorOrder: true, msgErrorOrder: 'Order is required..' })
} else if (R.isEmpty(this.state.tempData.description)) {
this.setState({ errorDesc: true, msgErrorDesc: 'Description cannot be empty.' })
this.setState({ errorDesc: true, msgErrorDesc: 'Description is required..' })
} else if (R.isNil(this.state.InputType)) {
this.setState({ errorTipeData: true, msgErrorTipeData: 'Data type cannot be empty' })
this.setState({ errorTipeData: true, msgErrorTipeData: 'Data type is required.' })
} else if ((this.state.InputType.type_report_name === 'Formula' && R.isEmpty(this.state.tempData.formula)) || (this.state.InputType.type_report_name === 'Validation' && R.isEmpty(this.state.tempData.formula))) {
this.setState({ errorFormula: true, msgErrorFormula: 'Formula cannot be empty' })
this.setState({ errorFormula: true, msgErrorFormula: 'Formula is required.' })
} else if (this.state.InputType.type_report_name === 'Validation' && R.isEmpty(this.state.tempData.condition_it_should_be)) {
this.setState({ errorRV: true, msgErrorRV: 'True Value cannot be empty' })
this.setState({ errorRV: true, msgErrorRV: 'True value is required.' })
} else if (this.state.InputType.type_report_name === 'Validation' && R.isNil(this.state.tempData.condition_if_wrong)) {
this.setState({ errorCondition: true, msgErrorCondition: 'False Condition cannot be empty' })
this.setState({ errorCondition: true, msgErrorCondition: 'False condition is required.' })
} else if (R.isNil(this.state.tempData.start_date)) {
this.setState({ errorStartDate: true, msgErrorSD: 'Start Date cannot be empty' })
this.setState({ errorStartDate: true, msgErrorSD: 'Start date is required.' })
} else if (R.isNil(this.state.tempData.end_date)) {
this.setState({ errorEndDate: true, msgErrorED: 'End Date cannot be empty' })
this.setState({ errorEndDate: true, msgErrorED: 'End date is required.' })
} else {
this.updateReportItems()
}
......
src/container/MasterData/formReportItems/VisualReportItems.js
View file @ 03710feb
import React, { Component } from 'react';
import { makeStyles } from '@material-ui/core/styles';
import { TextField, List, ListSubheader, Typography, Collapse } from '@material-ui/core';
import { TextField, Snackbar, withStyles } from '@material-ui/core';
import MinimizeIcon from '@material-ui/icons/Minimize';
import AddIcon from '@material-ui/icons/Add';
import RemoveIcon from '@material-ui/icons/Remove';
......@@ -8,6 +8,7 @@ import Nestable from 'react-nestable';
import api from '../../../api';
import { titleCase } from '../../../library/Utils';
import Autocomplete from '@material-ui/lab/Autocomplete';
import MuiAlert from '@material-ui/lab/Alert';
const useStyles = makeStyles((theme) => ({
root: {
......@@ -20,6 +21,8 @@ const useStyles = makeStyles((theme) => ({
},
}));
const Alert = withStyles({
})((props) => <MuiAlert elevation={6} variant="filled" {...props} />);
const type = [
{
......@@ -81,7 +84,10 @@ export default class VisualReportItems extends Component {
listReport: null,
report: null,
listCompany: null,
company: null
company: null,
alert: false,
tipeAlert: '',
messageAlert: ''
}
}
......@@ -93,45 +99,61 @@ export default class VisualReportItems extends Component {
getReportType() {
api.create().getReportType().then((response) => {
this.getCompanyActive()
if (response.data.status === 'success') {
let data = response.data.data
let reportData = data.map((item) => {
return {
report_id: item.report_id,
report_name: item.report_name,
}
})
let defaultProps = {
options: reportData,
getOptionLabel: (option) => titleCase(option.report_name),
};
this.setState({ listReport: defaultProps, report: reportData[0] })
if (response.data) {
if (response.ok) {
if (response.data.status === 'success') {
let data = response.data.data
let reportData = data.map((item) => {
return {
report_id: item.report_id,
report_name: item.report_name,
}
})
let defaultProps = {
options: reportData,
getOptionLabel: (option) => titleCase(option.report_name),
};
this.setState({ listReport: defaultProps, report: reportData[0] })
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' })
}
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' })
}
} else {
alert(response.data.message)
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' })
}
})
}
getCompanyActive() {
api.create().getPerusahaanActive().then((response) => {
if (response.data.status === 'success') {
let data = response.data.data
let companyData = data.map((item) => {
return {
company_id: item.company_id,
company_name: item.company_name,
}
})
let defaultProps = {
options: companyData,
getOptionLabel: (option) => titleCase(option.company_name),
};
this.setState({ listCompany: defaultProps, company: companyData[0] }, () => {
this.getItemHierarki()
})
if (response.data) {
if (response.ok) {
if (response.data.status === 'success') {
let data = response.data.data
let companyData = data.map((item) => {
return {
company_id: item.company_id,
company_name: item.company_name,
}
})
let defaultProps = {
options: companyData,
getOptionLabel: (option) => titleCase(option.company_name),
};
this.setState({ listCompany: defaultProps, company: companyData[0] }, () => {
this.getItemHierarki()
})
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' })
}
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' })
}
} else {
alert(response.data.message)
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' })
}
})
}
......@@ -144,9 +166,17 @@ export default class VisualReportItems extends Component {
api.create().getItemReportHierarki(payload).then((response) => {
console.log(response.data)
if (response.data) {
if (response.data.status == 'success') {
this.setState({ items: response.data.data })
if (response.ok) {
if (response.data.status == 'success') {
this.setState({ items: response.data.data })
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' })
}
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' })
}
} else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' })
}
})
}
......@@ -186,8 +216,25 @@ export default class VisualReportItems extends Component {
"item_report": this.state.items
}
api.create().saveVisualisasiReport(payload).then((response) => {
console.log(response);
// if (response.data.status == 'ucces') {
this.props.onClickClose()
if (response.data) {
if (response.ok) {
if (response.data.status === "success") {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'success' }, () => {
setTimeout(() => {
this.props.onClickClose()
}, 1000);
})
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'warning' })
}
} else {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'error' })
}
} else {
this.setState({ alert: true, messageAlert: response.problem, tipeAlert: 'error' })
}
// } else {
// alert(response.data.message)
// }
......@@ -203,9 +250,18 @@ export default class VisualReportItems extends Component {
)
};
closeAlert() {
this.setState({ alert: false })
}
render() {
return (
<div>
<Snackbar open={this.state.alert} autoHideDuration={6000} onClose={() => this.closeAlert()}>
<Alert onClose={() => this.closeAlert()} severity={this.state.tipeAlert}>
{this.state.messageAlert}
</Alert>
</Snackbar>
<div style={{ height: this.props.height }}>
<div style={{ width: '100%' }} className={"main-color"} />
<div>
......@@ -262,15 +318,15 @@ export default class VisualReportItems extends Component {
</div>
<div className="row" style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', paddingRight: 15, paddingLeft: 15, paddingBottom: 25 }}>
<div onClick={() => this.props.onClickClose()} style={{ width: 102, height: 30, marginLeft: 25, backgroundColor: 'dodgerblue', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center', cursor: "pointer" }}>
<span style={{ color: '#fff', fontSize: 11 }}>Kembali</span>
<span style={{ color: '#fff', fontSize: 11 }}>Back</span>
</div>
<div className="row" style={{ float: 'right', marginRight: 25 }}>
<div onClick={() => this.props.onClickClose()} style={{ width: 102, height: 30, border: 'solid 1px #354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center', cursor: "pointer" }}>
<span style={{ color: '#354960', fontSize: 11 }} >Batal</span>
<span style={{ color: '#354960', fontSize: 11 }}>Cancel</span>
</div>
<button onClick={() => this.handleSave()}>
<div style={{ width: 102, height: 30, marginLeft: 25, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center', cursor: "pointer" }}>
<span style={{ color: '#fff', fontSize: 11 }}>Simpan</span>
<span style={{ color: '#fff', fontSize: 11 }}>Save</span>
</div>
</button>
</div>
......
src/container/Profile.js
View file @ 03710feb
......@@ -36,9 +36,9 @@ export default class Profile extends Component {
errorOldPassword: false,
errorPassword: false,
errorConfirmPassword: false,
msgOldPassword: 'Terdiri 8 karakter dengan kombinasi angka.',
msgPassword: 'Terdiri 8 karakter dengan kombinasi angka.',
msgConfirmPassword: 'Terdiri 8 karakter dengan kombinasi angka.',
msgOldPassword: 'Consists of 8 characters with a combination of numbers.',
msgPassword: 'Consists of 8 characters with a combination of numbers.',
msgConfirmPassword: 'Consists of 8 characters with a combination of numbers.',
company: [],
listCompany: [],
selectedIndex: 0,
......@@ -68,23 +68,23 @@ export default class Profile extends Component {
this.setState({ ...data, [e.target.name]: e.target.value })
console.log(e.target.name);
if (e.target.name == "password") {
this.setState({ errorPassword: false, msgPassword: 'Password consists of 8 characters with a combination of numbers.' })
this.setState({ errorPassword: false, msgPassword: 'Consists of 8 characters with a combination of numbers.' })
} else if (e.target.name == "confirmPassword") {
this.setState({ errorConfirmPassword: false, msgConfirmPassword: 'Password consists of 8 characters with a combination of numbers.' })
this.setState({ errorConfirmPassword: false, msgConfirmPassword: 'Consists of 8 characters with a combination of numbers.' })
} else if (e.target.name == "oldPassword") {
this.setState({ errorOldPassword: false, msgOldPassword: 'Password consists of 8 characters with a combination of numbers.' })
this.setState({ errorOldPassword: false, msgOldPassword: 'Consists of 8 characters with a combination of numbers.' })
}
}
validasi() {
if (this.state.oldPassword == "") {
this.setState({ errorOldPassword: true, msgOldPassword: 'Old Password is required.' })
this.setState({ errorOldPassword: true, msgOldPassword: 'Old password is required.' })
} else if (this.state.oldPassword.length < 8) {
this.setState({ errorOldPassword: true, msgOldPassword: 'Old Password minimum 8 characters.' })
this.setState({ errorOldPassword: true, msgOldPassword: 'Old password minimum 8 characters.' })
} else if (this.isEmail(this.state.oldPassword)) {
this.setState({ errorOldPassword: true, msgOldPassword: 'Old Password format should not use email.' })
this.setState({ errorOldPassword: true, msgOldPassword: 'Old password format should not use email.' })
} else if (!this.isRegex(this.state.oldPassword)) {
this.setState({ errorOldPassword: true, msgOldPassword: 'Old Password must be a combination of characters, letters and numbers.' })
this.setState({ errorOldPassword: true, msgOldPassword: 'Old password must be a combination of characters, letters and numbers.' })
} else if (this.state.password.trim() == "") {
this.setState({ errorPassword: true, msgPassword: 'Password is required.' })
} else if (this.state.password.length < 8) {
......@@ -94,11 +94,11 @@ export default class Profile extends Component {
} else if (!this.isRegex(this.state.password)) {
this.setState({ errorPassword: true, msgPassword: 'Password must be a combination of characters, letters and numbers.' })
} else if (this.state.confirmPassword.trim() == "") {
this.setState({ errorConfirmPassword: true, msgConfirmPassword: 'Confirm Password is required.' })
this.setState({ errorConfirmPassword: true, msgConfirmPassword: 'Password confirmation is required.' })
} else if (this.state.confirmPassword.length < 8) {
this.setState({ errorConfirmPassword: true, msgConfirmPassword: 'Confirm password of at least 8 characters.' })
this.setState({ errorConfirmPassword: true, msgConfirmPassword: 'Password confirmation of at least 8 characters.' })
} else if (this.isEmail(this.state.confirmPassword)) {
this.setState({ errorConfirmPassword: true, msgConfirmPassword: 'Password confirmation format may not use email.' })
this.setState({ errorConfirmPassword: true, msgConfirmPassword: 'Password confirmation format should not use email.' })
} else if (!this.isRegex(this.state.confirmPassword)) {
this.setState({ errorConfirmPassword: true, msgConfirmPassword: 'Password confirmation must be a combination of characters, letters and numbers.' })
} else if (this.state.password !== this.state.confirmPassword) {
......
src/container/ResetPassword.js
View file @ 03710feb
......@@ -33,7 +33,7 @@ class ResetPassword extends Component {
console.log(this.props.match.params.id)
let userId = this.props.match.params.id
this.setState({userId})
// this.checkExpiredLink(userId)
this.checkExpiredLink(userId)
// console.log(this.props)
}
......@@ -67,7 +67,7 @@ class ResetPassword extends Component {
if (this.state.password.trim() == "") {
this.setState({ errorPassword: true, msgPassword: 'Password is required' })
} else if (this.state.password.length < 8) {
this.setState({ errorPassword: true, msgPassword: 'Password of at least 8 characters.' })
this.setState({ errorPassword: true, msgPassword: 'Password minimum 8 characters.' })
} else if (this.isEmail(this.state.password)) {
this.setState({ errorPassword: true, msgPassword: 'Password format should not use email.' })
} else if (!this.isRegex(this.state.password)) {
......@@ -75,7 +75,7 @@ class ResetPassword extends Component {
} else if (this.state.confirmPassword.trim() == "") {
this.setState({ errorConfirmPassword: true, msgConfirmPassword: 'Confirm password is required.' })
} else if (this.state.confirmPassword.length < 8) {
this.setState({ errorConfirmPassword: true, msgConfirmPassword: 'Confirm password of at least 8 characters.' })
this.setState({ errorConfirmPassword: true, msgConfirmPassword: 'Confirm password minimum 8 characters.' })
} else if (this.isEmail(this.state.confirmPassword)) {
this.setState({ errorConfirmPassword: true, msgConfirmPassword: 'Password confirmation format should not use email.' })
} else if (!this.isRegex(this.state.confirmPassword)) {
......
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