Skip to content

T
Tia-dev
Commit 1039484f authored by EKSAD's avatar EKSAD
Browse files
Options

edit report item

parent aa2e2607
Hide whitespace changes
Inline Side-by-side
Showing with 317 additions and 318 deletions
src/api/index.js
View file @ 1039484f
......@@ -119,6 +119,7 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') =>
const getReportItems = () => api.get('item_report/get_all_item_report')
const getInputType = () => api.get('type_report/get_all_type_report')
const getReportType = () => api.get('report/get_all_report')
const getDetailReportItems = (userId) => api.get(`item_report/get_item_report_by_id/${userId}`)
const searchReportItems = (body) => api.post('/item_report/search_item_report', body)
const createReportItems = (body) => api.post('/item_report/create_item_report', body)
const updateReportItems = (body) => api.post('/item_report/update_item_report', body)
......@@ -195,6 +196,7 @@ const create = (baseURL = 'https://tia.eksad.com/tia-reporting-dev/public/') =>
searchReportItems,
createReportItems,
updateReportItems,
getDetailReportItems,
getInputType,
getReportType,
checkUploadReportItems,
......
src/container/MasterData/formReportItems/EditReportItems.js
View file @ 1039484f
......@@ -3,72 +3,15 @@ import { TextField, Typography } from '@material-ui/core';
import { DatePicker } from '@material-ui/pickers';
import format from "date-fns/format";
import Autocomplete from '@material-ui/lab/Autocomplete';
import api from '../../../api';
import * as R from 'ramda'
const companies = [
{
value: '',
label: '',
},
{
value: '1',
label: 'TIA',
},
{
value: '2',
label: 'TIA',
},
];
const dataTypes = [
{
value: '',
label: '',
},
{
value: '1',
label: 'Formula',
},
{
value: '2',
label: 'Formula',
},
];
const reportTypes = [
{
value: '',
label: '',
},
{
value: '1',
label: 'KPI',
},
{
value: '2',
label: 'KPI',
},
];
const parents = [
{
value: '-',
label: '-',
},
{
value: '1',
label: '1',
},
{
value: '2',
label: '2',
},
];
import { titleCase } from '../../../library/Utils';
export default class EditReportItems extends Component {
constructor(props) {
super(props)
this.state = {
tempData: null,
InputType: null,
company: null,
......@@ -109,7 +52,12 @@ export default class EditReportItems extends Component {
}
componentDidMount() {
console.log(this.props.data);
// console.log(this.props.data);
this.getDetailReportItems();
this.getInputType()
this.getPerusahaan()
this.getReportType()
this.getParent()
}
handleChange(e, type) {
......@@ -197,6 +145,117 @@ export default class EditReportItems extends Component {
}
getDetailReportItems() {
api.create().getDetailReportItems(this.props.data.item_report_id).then((response) => {
this.getInputType()
this.getPerusahaan()
this.getReportType()
this.getParent()
if (response.data.status === 'success') {
this.setState({ tempData: response.data.data})
console.log(response.data.data)
} else {
alert(response.data.message)
}
})
}
getInputType() {
api.create().getInputType().then((response) => {
// console.log(response)
if(response.data.status === 'success') {
let data = response.data.data
let inputData = data.map((item) => {
return {
type_report_id: item.type_report_id,
type_report_name: item.type_report_name
}
})
let defaultProps = {
options: inputData,
getOptionLabel: (option) => titleCase(option.type_report_name),
};
let index = inputData.findIndex((val) => val.type_report_id === this.state.tempData.type_report_id)
this.setState({listInputType: defaultProps, InputType: index === -1 ? inputData[0] : inputData[index]})
} else {
alert(response.data.message)
}
})
}
getPerusahaan() {
api.create().getPerusahaanActive().then((response) => {
console.log(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),
};
let index = companyData.findIndex((val) => val.company_id === this.state.tempData.company_id)
this.setState({listCompany: defaultProps, company: index === -1 ? companyData[0] : companyData[index]})
} else {
alert(response.data.message)
}
})
}
getReportType() {
api.create().getReportType().then((response) => {
console.log(response)
if(response.data.status === 'success') {
let data = response.data.data
let reportTypeData = data.map((item) => {
return {
report_id: item.report_id,
report_name: item.report_name,
}
})
let defaultProps = {
options: reportTypeData,
getOptionLabel: (option) => titleCase(option.report_name),
};
let index = reportTypeData.findIndex((val) => val.report_id === this.state.tempData.report_id)
this.setState({listReportType: defaultProps, reportType: index === -1 ? reportTypeData[0] : reportTypeData[index]})
} else {
alert(response.data.message)
}
})
}
getParent() {
api.create().getReportItems().then((response) => {
// console.log(response)
if(response.data.status === 'success') {
let data = response.data.data
let parentData = data.map((item) => {
return {
item_report_id: item.item_report_id,
report_name: item.report_name
}
})
let defaultProps = {
options: parentData,
getOptionLabel: (option) => titleCase(option.report_name),
};
let index = parentData.findIndex((val) => val.item_report_id === this.state.tempData.item_report_id)
this.setState({listParent: defaultProps, parent: index === -1 ? parentData[0] : parentData[index]})
} else {
alert(response.data.message)
}
})
}
render() {
const { startDate, endDate } = this.state;
......@@ -226,16 +285,17 @@ export default class EditReportItems extends Component {
<div style={{ backgroundColor: '#e8e8e8', padding: 10, borderRadius: 5 }}>
<TextField
style={{ width: '100%' }}
value={1}
value={this.state.tempData === null ? '' : this.state.tempData.item_report_id}
id="ID"
label="ID"
disabled
variant="filled"
onChange={(e) => null}
inputProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
paddingLeft: 10
fontFamily: 'Nunito Sans, sans-serif'
}
}}
InputLabelProps={{
......@@ -243,60 +303,45 @@ export default class EditReportItems extends Component {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085',
paddingLeft: 10
color: '#7e8085'
}
}}
/>
</div>
<div className="margin-top-10px" style={{ padding: 10, borderRadius: 5 }}>
<TextField
<div className="margin-top-10px" style={{padding: 10}} >
<Autocomplete
{...this.state.listCompany}
id="company"
style={{ width: '100%' }}
select
label="Perusahaan"
// onChange={handleChange}
helperText=""
SelectProps={{
native: true,
}}
InputLabelProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085',
paddingLeft: 10
}
}}
inputProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
paddingLeft: 10
}
}}
>
{companies.map((option) => (
<option key={option.value} value={option.value}>
{option.label}
</option>
))}
</TextField>
onChange={(event, newInputValue) => this.setState({company: newInputValue})}
debug
renderInput={(params) =>
<TextField {...params}
label="Perusahaan"
InputLabelProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085'
}
}}
InputProps={{ ...params.InputProps, style: { fontSize: 11, fontWeight: 600, fontFamily: 'Nunito Sans, sans-serif' } }}
/>}
value={this.state.company}
/>
</div>
<div style={{ padding: 10, borderRadius: 5 }}>
<TextField
style={{ width: '100%' }}
id="description"
label="Deskripsi"
// value={this.props.data.business_unit_name}
onChange={(e) => null}
value={this.state.tempData === null ? '' : this.state.tempData.description}
inputProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
paddingLeft: 10
fontFamily: 'Nunito Sans, sans-serif'
}
}}
InputLabelProps={{
......@@ -304,8 +349,7 @@ export default class EditReportItems extends Component {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085',
paddingLeft: 10
color: '#7e8085'
}
}}
>
......@@ -316,13 +360,13 @@ export default class EditReportItems extends Component {
style={{ width: '100%' }}
id="uom"
label="UOM"
// value={this.props.data.business_unit_name}
onChange={(e) => null}
value={this.state.tempData === null ? '' : this.state.tempData.uom}
inputProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
paddingLeft: 10
fontFamily: 'Nunito Sans, sans-serif'
}
}}
InputLabelProps={{
......@@ -330,64 +374,52 @@ export default class EditReportItems extends Component {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085',
paddingLeft: 10
color: '#7e8085'
}
}}
>
</TextField>
</div>
<div className="margin-top-10px" style={{ padding: 10, borderRadius: 5 }}>
<TextField
id="dataType"
style={{ width: '100%' }}
select
label="Tipe Data"
// onChange={handleChange}
helperText=""
SelectProps={{
native: true,
}}
InputLabelProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085',
paddingLeft: 10
}
}}
inputProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
paddingLeft: 10
}
}}
>
{dataTypes.map((option) => (
<option key={option.value} value={option.value}>
{option.label}
</option>
))}
</TextField>
<div className="margin-top-10px" style={{padding: 10}}>
<Autocomplete
{...this.state.listInputType}
id="inputType"
onChange={(event, newInputValue) => this.setState({InputType: newInputValue},
() => newInputValue === null ? this.setState({disabledFormula: true, disabledCondt: true, disabledValue: true, formula: '', condition: '', realVal: ''})
: newInputValue.type_report_name === 'FORMULA' ? this.setState({disabledFormula: false, disabledCondt: true, disabledValue: true, formula: '', condition: '', realVal: ''})
: newInputValue.type_report_name === 'VALIDATION' ? this.setState({disabledFormula: false, disabledCondt: false, disabledValue: false, formula: '', condition: '', realVal: ''})
: this.setState({disabledFormula: true, disabledCondt: true, disabledValue: true, formula: '', condition: '', realVal: ''})
)}
debug
renderInput={(params) =>
<TextField {...params}
label="Tipe Data"
InputLabelProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085'
}
}}
InputProps={{ ...params.InputProps, style: { fontSize: 11, fontWeight: 600, fontFamily: 'Nunito Sans, sans-serif' } }}
/>}
value={this.state.InputType}
/>
</div>
<div className="margin-top-10px" style={{ backgroundColor: '#e8e8e8', padding: 10, borderRadius: 5 }}>
<div className="margin-top-10px" style={{ padding: 10 }}>
<TextField
style={{ width: '100%' }}
// value={this.props.data.status}
id="realValue"
label="Nilai Seharusnya"
value="-"
disabled
disabled={this.state.disabledValue}
value={this.state.tempData === null ? '' : this.state.tempData.condition_it_should_be}
inputProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
paddingLeft: 10
fontFamily: 'Nunito Sans, sans-serif'
}
}}
InputLabelProps={{
......@@ -395,48 +427,47 @@ export default class EditReportItems extends Component {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085',
paddingLeft: 10
color: '#7e8085'
}
}}
/>
</div>
<div className="margin-top-10px" style={{ padding: 10, borderRadius: 5 }}>
<DatePicker
margin="normal"
id="startDate"
value={startDate}
onChange={this.handleStartDate}
label="Berlaku Mulai"
format="dd MMMM yyyy"
KeyboardButtonProps={{
'aria-label': 'change date',
}}
inputProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
paddingLeft: 10
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
paddingLeft: 10
}
}}
style={{ padding: 0, margin: 0, width: '100%' }}
margin="normal"
id="startDate"
label="Berlaku Mulai"
format="dd MMMM yyyy"
value={this.state.tempData === null ? null : this.state.tempData.start_date}
error={this.state.errorStartDate}
helperText={this.state.msgErrorSD}
onChange={(e) => this.handleChange(e, 'start_date')}
KeyboardButtonProps={{
'aria-label': 'change date',
}}
inputProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
style={{padding: 0, margin: 0, width: '100%'}}
/>
</div>
<div className="margin-top-10px" style={{ backgroundColor: '#e8e8e8', padding: 10, borderRadius: 5 }}>
<TextField
style={{ width: '100%' }}
value="Aktif"
value={this.state.tempData === null ? '' : this.state.tempData.status}
id="status"
label="Status"
disabled
......@@ -444,8 +475,7 @@ export default class EditReportItems extends Component {
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
paddingLeft: 10
fontFamily: 'Nunito Sans, sans-serif'
}
}}
InputLabelProps={{
......@@ -453,8 +483,7 @@ export default class EditReportItems extends Component {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085',
paddingLeft: 10
color: '#7e8085'
}
}}
/>
......@@ -473,48 +502,34 @@ export default class EditReportItems extends Component {
</div>
<div className="column-2">
<div style={{ padding: 10, borderRadius: 5 }}>
<TextField
<div className="margin-top-10px" style={{padding: 10}}>
<Autocomplete
{...this.state.listReportType}
id="reportType"
style={{ width: '100%' }}
select
label="Jenis Laporan"
// onChange={handleChange}
helperText=""
SelectProps={{
native: true,
}}
InputLabelProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085',
paddingLeft: 10
}
}}
inputProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
paddingLeft: 10
}
}}
>
{reportTypes.map((option) => (
<option key={option.value} value={option.value}>
{option.label}
</option>
))}
</TextField>
onChange={(event, newInputValue) => this.setState({reportType: newInputValue})}
debug
renderInput={(params) =>
<TextField {...params}
label="Jenis Laporan"
InputLabelProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085'
}
}}
InputProps={{ ...params.InputProps, style: { fontSize: 11, fontWeight: 600, fontFamily: 'Nunito Sans, sans-serif' } }}
/>}
value={this.state.reportType}
/>
</div>
<div className="margin-top-10px" style={{ padding: 10, borderRadius: 5 }}>
<TextField
style={{ width: '100%' }}
id="order"
label="Order"
value="1"
value={this.state.tempData === null ? '' : this.state.tempData.order}
inputProps={{
style: {
fontSize: 11,
......@@ -535,54 +550,39 @@ export default class EditReportItems extends Component {
>
</TextField>
</div>
<div style={{ padding: 10, borderRadius: 5 }}>
<TextField
id="parent"
style={{ width: '100%' }}
select
label="Parent"
// onChange={handleChange}
helperText=""
SelectProps={{
native: true,
}}
InputLabelProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085',
paddingLeft: 10
}
}}
inputProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
paddingLeft: 10
}
}}
>
{parents.map((option) => (
<option key={option.value} value={option.value}>
{option.label}
</option>
))}
</TextField>
<div style={{padding: 10}} >
<Autocomplete
{...this.state.listParent}
id="parentId"
onChange={(event, newInputValue) => this.setState({parent: newInputValue})}
debug
renderInput={(params) =>
<TextField {...params}
label="Parent ID"
InputLabelProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085'
}
}}
InputProps={{ ...params.InputProps, style: { fontSize: 11, fontWeight: 600, fontFamily: 'Nunito Sans, sans-serif' } }}
/>}
value={this.state.parent}
/>
</div>
<div style={{ padding: 10, borderRadius: 5 }}>
<TextField
style={{ width: '100%' }}
id="weight"
label="Weight"
value="1"
value={this.state.tempData === null ? '' : this.state.tempData.weight}
inputProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
paddingLeft: 10
fontFamily: 'Nunito Sans, sans-serif'
}
}}
InputLabelProps={{
......@@ -590,8 +590,7 @@ export default class EditReportItems extends Component {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085',
paddingLeft: 10
color: '#7e8085'
}
}}
>
......@@ -602,13 +601,13 @@ export default class EditReportItems extends Component {
style={{ width: '100%' }}
id="formula"
label="Formula"
value="1"
disabled={this.state.disabledFormula}
value={this.state.tempData === null ? '' : this.state.tempData.formula}
inputProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
paddingLeft: 10
fontFamily: 'Nunito Sans, sans-serif'
}
}}
InputLabelProps={{
......@@ -616,69 +615,67 @@ export default class EditReportItems extends Component {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085',
paddingLeft: 10
color: '#7e8085'
}
}}
>
</TextField>
</div>
<div className="margin-top-10px" style={{ backgroundColor: '#e8e8e8', padding: 10, borderRadius: 5 }}>
<TextField
style={{ width: '100%' }}
value="-"
<div className="margin-top-10px" style={{padding: 10}}>
<Autocomplete
value={this.state.tempData === null ? '' : this.state.tempData.condition}
id="isWrongCondition"
label="Kondisi Jika Salah"
disabled
inputProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
paddingLeft: 10
}
}}
InputLabelProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085',
paddingLeft: 10
}
}}
disabled={this.state.disabledCondt}
onChange={(event, newValue) => {
this.setState({condition: newValue});
}}
options={this.state.options}
renderInput={(params) =>
<TextField {...params}
label="Kondisi Jika Salah"
InputLabelProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
color: '#7e8085'
}
}}
InputProps={{ ...params.InputProps, style: { fontSize: 11, fontWeight: 600, fontFamily: 'Nunito Sans, sans-serif' } }}
/>}
/>
</div>
<div className="margin-top-10px" style={{ padding: 10, borderRadius: 5 }}>
<DatePicker
margin="normal"
id="endDate"
value={endDate}
onChange={this.handleEndDate}
label="Berlaku Hingga"
format="dd MMMM yyyy"
KeyboardButtonProps={{
'aria-label': 'change date',
}}
inputProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
paddingLeft: 10
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
paddingLeft: 10
}
}}
style={{ padding: 0, margin: 0, width: '100%' }}
<DatePicker
margin="normal"
id="endDate"
label="Berlaku Hingga"
format="dd MMMM yyyy"
value={this.state.tempData === null ? '' : this.state.tempData.end_date}
error={this.state.errorEndDate}
helperText={this.state.msgErrorED}
onChange={(e) => this.handleChange(e, 'end_date')}
minDate={this.state.startDate}
KeyboardButtonProps={{
'aria-label': 'change date',
}}
inputProps={{
style: {
fontSize: 11,
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085',
fontWeight: 600,
fontFamily: 'Nunito Sans, sans-serif',
}
}}
style={{padding: 0, margin: 0, width: '100%'}}
/>
</div>
</div>
......
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