Commit c8cfb27d authored by Deni Rinaldi's avatar Deni Rinaldi

Merge branch 'master' of http://103.44.149.204/d.arizona/tia-dev into deni-dev(pc)

parents c61dfcaf d9de9576
...@@ -7281,6 +7281,11 @@ ...@@ -7281,6 +7281,11 @@
"resolved": "https://registry.npmjs.org/immer/-/immer-1.10.0.tgz", "resolved": "https://registry.npmjs.org/immer/-/immer-1.10.0.tgz",
"integrity": "sha512-O3sR1/opvCDGLEVcvrGTMtLac8GJ5IwZC4puPrLuRj3l7ICKvkmA0vGuU9OW8mV9WIBRnaxp5GJh9IEAaNOoYg==" "integrity": "sha512-O3sR1/opvCDGLEVcvrGTMtLac8GJ5IwZC4puPrLuRj3l7ICKvkmA0vGuU9OW8mV9WIBRnaxp5GJh9IEAaNOoYg=="
}, },
"immutability-helper": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/immutability-helper/-/immutability-helper-3.1.1.tgz",
"integrity": "sha512-Q0QaXjPjwIju/28TsugCHNEASwoCcJSyJV3uO1sOIQGI0jKgm9f41Lvz0DZj3n46cNCyAZTsEYoY4C2bVRUzyQ=="
},
"import-cwd": { "import-cwd": {
"version": "2.1.0", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/import-cwd/-/import-cwd-2.1.0.tgz", "resolved": "https://registry.npmjs.org/import-cwd/-/import-cwd-2.1.0.tgz",
...@@ -11906,6 +11911,18 @@ ...@@ -11906,6 +11911,18 @@
"scheduler": "^0.19.1" "scheduler": "^0.19.1"
} }
}, },
"react-draggable-list": {
"version": "4.0.3",
"resolved": "https://registry.npmjs.org/react-draggable-list/-/react-draggable-list-4.0.3.tgz",
"integrity": "sha512-+6v+5ZrkaSeGlEMyFnVoWt/n3ANhQstsfV3RnFUbEI5DS2q/YwRbEbVlgq9bUQ4kn06MJ1PBCPEJpqq/VobAqA==",
"requires": {
"@babel/runtime": "^7.0.0",
"immutability-helper": "^3.0.0",
"prop-types": "^15.6.0",
"react-motion": "^0.5.2",
"react-multi-ref": "^1.0.0"
}
},
"react-dropzone": { "react-dropzone": {
"version": "11.0.2", "version": "11.0.2",
"resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-11.0.2.tgz", "resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-11.0.2.tgz",
...@@ -11941,6 +11958,31 @@ ...@@ -11941,6 +11958,31 @@
"resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz", "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==" "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
}, },
"react-motion": {
"version": "0.5.2",
"resolved": "https://registry.npmjs.org/react-motion/-/react-motion-0.5.2.tgz",
"integrity": "sha512-9q3YAvHoUiWlP3cK0v+w1N5Z23HXMj4IF4YuvjvWegWqNPfLXsOBE/V7UvQGpXxHFKRQQcNcVQE31g9SB/6qgQ==",
"requires": {
"performance-now": "^0.2.0",
"prop-types": "^15.5.8",
"raf": "^3.1.0"
},
"dependencies": {
"performance-now": {
"version": "0.2.0",
"resolved": "https://registry.npmjs.org/performance-now/-/performance-now-0.2.0.tgz",
"integrity": "sha1-M+8wxcd9TqIcWlOGnZG1bY8lVeU="
}
}
},
"react-multi-ref": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/react-multi-ref/-/react-multi-ref-1.0.0.tgz",
"integrity": "sha512-LJuQXEabnv8JLcvcWeJcTogxG4eXVFiPfQ9CECuwWUbfJdrVpPf13m9RxmImyJS0J99BWokGn7dlR1dR06XPDw==",
"requires": {
"@babel/runtime": "^7.1.2"
}
},
"react-number-format": { "react-number-format": {
"version": "4.4.1", "version": "4.4.1",
"resolved": "https://registry.npmjs.org/react-number-format/-/react-number-format-4.4.1.tgz", "resolved": "https://registry.npmjs.org/react-number-format/-/react-number-format-4.4.1.tgz",
......
...@@ -26,6 +26,7 @@ ...@@ -26,6 +26,7 @@
"react-d3-donut": "^1.1.2", "react-d3-donut": "^1.1.2",
"react-d3-speedometer": "^0.12.0", "react-d3-speedometer": "^0.12.0",
"react-dom": "^16.13.1", "react-dom": "^16.13.1",
"react-draggable-list": "^4.0.3",
"react-dropzone": "^11.0.2", "react-dropzone": "^11.0.2",
"react-excel-renderer": "^1.1.0", "react-excel-renderer": "^1.1.0",
"react-number-format": "^4.4.1", "react-number-format": "^4.4.1",
......
...@@ -73,6 +73,7 @@ export default class ApprovalMatrix extends Component { ...@@ -73,6 +73,7 @@ export default class ApprovalMatrix extends Component {
componentDidMount() { componentDidMount() {
this.getData() this.getData()
console.log(this.props.height)
} }
getData() { getData() {
...@@ -330,6 +331,12 @@ export default class ApprovalMatrix extends Component { ...@@ -330,6 +331,12 @@ export default class ApprovalMatrix extends Component {
</div> </div>
</div> </div>
: :
this.state.visibleVisual == true ?
<VisualisasiAM
onClickClose={() => this.setState({ visibleVisual: false, visibleAM: true })}
height= {this.props.height}
/>
:
<div style={{ height: this.props.height }}> <div style={{ height: this.props.height }}>
<div style={{ height: 199, width: '100%', backgroundColor: '#354960' }} /> <div style={{ height: 199, width: '100%', backgroundColor: '#354960' }} />
<div> <div>
...@@ -367,6 +374,7 @@ export default class ApprovalMatrix extends Component { ...@@ -367,6 +374,7 @@ export default class ApprovalMatrix extends Component {
</div> </div>
</div> </div>
} }
{this.state.visibleCreate && ( {this.state.visibleCreate && (
<CreateApprovalMatrix <CreateApprovalMatrix
onClickClose={() => this.setState({ visibleCreate: false })} onClickClose={() => this.setState({ visibleCreate: false })}
...@@ -381,11 +389,6 @@ export default class ApprovalMatrix extends Component { ...@@ -381,11 +389,6 @@ export default class ApprovalMatrix extends Component {
data={this.state.listData[this.state.selectIndex]} data={this.state.listData[this.state.selectIndex]}
/> />
)} )}
{this.state.visibleVisual && (
<VisualisasiAM
onClickClose={() => this.setState({ visibleVisual: false })}
/>
)}
{this.state.visibleUpload && ( {this.state.visibleUpload && (
<div className="test app-popup-show"> <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 }}>
......
...@@ -51,9 +51,11 @@ export default class CreateApprovalMatrix extends Component { ...@@ -51,9 +51,11 @@ export default class CreateApprovalMatrix extends Component {
super(props) super(props)
this.state = { this.state = {
userId: null, userId: null,
typeId: null,
// type: '', // type: '',
order: '', order: '',
approvedBy: null, approvedBy: null,
types: null,
// operator: '', // operator: '',
startDate: '', startDate: '',
endDate: '', endDate: '',
...@@ -65,6 +67,7 @@ export default class CreateApprovalMatrix extends Component { ...@@ -65,6 +67,7 @@ export default class CreateApprovalMatrix extends Component {
componentDidMount() { componentDidMount() {
this.getUserData() this.getUserData()
this.getTypeData()
} }
getUserData() { getUserData() {
...@@ -88,6 +91,50 @@ export default class CreateApprovalMatrix extends Component { ...@@ -88,6 +91,50 @@ export default class CreateApprovalMatrix extends Component {
} }
}) })
} }
getTypeData() {
api.create().getTypeAM().then((response) => {
if (response.data.status == 'success') {
let data = response.data.data
let typeData = data.map((item) => {
return {
approval_type_id: item.approval_type_id,
approval_type_name: item.approval_type_name
}
})
// console.log(userData)
let typeProps = {
options: typeData,
getOptionLabel: (option) => option.approval_type_name,
};
this.setState({ types: typeProps, typeData: response.data.data })
} else {
alert(response.data.message)
}
})
}
getOperatorData() {
api.create().getOperatorAM().then((response) => {
if (response.data.status == 'success') {
let data = response.data.data
let operatorData = data.map((item) => {
return {
approval_type_id: item.approval_type_id,
approval_type_name: item.approval_type_name
}
})
// console.log(userData)
let operatorProps = {
options: operatorData,
getOptionLabel: (option) => option.approval_type_name,
};
this.setState({ types: operatorProps, operatorData: response.data.data })
} else {
alert(response.data.message)
}
})
}
handleChange(e, type) { handleChange(e, type) {
...@@ -157,32 +204,19 @@ export default class CreateApprovalMatrix extends Component { ...@@ -157,32 +204,19 @@ export default class CreateApprovalMatrix extends Component {
variant="filled" variant="filled"
label="ID" label="ID"
disabled disabled
// value={this.state.periode}
> >
{/* {periode.map((option) => (
<MenuItem key={option.value} value={option.value}>
{option.label}
</MenuItem>
))} */}
</TextField> </TextField>
</div> </div>
</div> </div>
<div className="column-2"> <div className="column-2">
<div className="margin-bottom-20px" style={{ marginTop: 8 }}> <div className="margin-bottom-20px" style={{ marginTop: 8 }}>
<TextField <Autocomplete
style={{ width: '100%' }} {...this.state.types}
id="type" id="tipe"
select onChange={(event, newInputValue) => this.setState({typeId:newInputValue.approval_type_id})}
label="Tipe Persetujuan" debug
value={this.state.type} renderInput={(params) => <TextField {...params} label="Tipe" margin="normal" />}
onChange={(e) => null} />
>
{type.map((option) => (
<MenuItem key={option.value} value={option.value}>
{option.label}
</MenuItem>
))}
</TextField>
</div> </div>
</div> </div>
</div> </div>
...@@ -204,7 +238,7 @@ export default class CreateApprovalMatrix extends Component { ...@@ -204,7 +238,7 @@ export default class CreateApprovalMatrix extends Component {
<Autocomplete <Autocomplete
{...this.state.approvedBy} {...this.state.approvedBy}
id="debug" id="debug"
onChange={(event, newInputValue) => this.setState({userId:newInputValue.user_id}, () => console.log(this.state.userId))} onChange={(event, newInputValue) => this.setState({userId:newInputValue.user_id})}
debug debug
renderInput={(params) => <TextField {...params} label="debug" margin="normal" />} renderInput={(params) => <TextField {...params} label="debug" margin="normal" />}
value={this.state.value} value={this.state.value}
......
...@@ -4,6 +4,8 @@ import { DateTimePicker, KeyboardDatePicker, DatePicker} from "@material-ui/pick ...@@ -4,6 +4,8 @@ import { DateTimePicker, KeyboardDatePicker, DatePicker} from "@material-ui/pick
import MenuItem from '@material-ui/core/MenuItem'; import MenuItem from '@material-ui/core/MenuItem';
import format from "date-fns/format"; import format from "date-fns/format";
import localeID from "date-fns/locale/id" import localeID from "date-fns/locale/id"
import api from "../../api";
import Autocomplete from '@material-ui/lab/Autocomplete';
const type = [ const type = [
{ {
...@@ -49,20 +51,53 @@ export default class EditApprovalMatrix extends Component { ...@@ -49,20 +51,53 @@ export default class EditApprovalMatrix extends Component {
this.state = { this.state = {
startDate: null, startDate: null,
endDate: null, endDate: null,
date: new Date() date: new Date(),
approvedBy: null,
getApprovedBy: null
} }
} }
componentDidMount() { componentDidMount() {
if (this.props.type === 'edit') { if (this.props.type === 'edit') {
let data = this.props.data let data = this.props.data
// let getApprovedBy = {
// user_id: data.user_id,
// fullname: data.fullname
// }
this.setState({ this.setState({
id: data.business_unit_id, id: data.business_unit_id,
name: data.business_unit_name,
startDate: data.start_date, startDate: data.start_date,
endDate: data.end_date endDate: data.end_date,
}) getUserId: data.user_id,
}, () => this.getUserData())
} }
console.log(this.props.data)
// this.getUserData()
}
getUserData() {
api.create().getApprovedByAM().then((response) => {
console.log(response)
if (response.data.status == 'success') {
let data = response.data.data
let userData = data.map((item) => {
return {
user_id: item.user_id,
fullname: item.fullname
}
})
let index = userData.findIndex((val) => val.user_id == this.state.getUserId)
// console.log(userData)
let defaultProps = {
options: userData,
getOptionLabel: (option) => option.fullname,
};
this.setState({ approvedBy: defaultProps, userData: response.data.data, getApprovedBy: index == -1 ? userData[0]: userData[index] })
} else {
alert(response.data.message)
}
})
} }
handleChange(e, type) { handleChange(e, type) {
...@@ -82,6 +117,25 @@ export default class EditApprovalMatrix extends Component { ...@@ -82,6 +117,25 @@ export default class EditApprovalMatrix extends Component {
} }
validasi() {
// if (R.isEmpty(this.state.order)) return alert("Order is Required.");
// if (!R.isEmpty(this.state.startDate) && !R.isEmpty(this.state.endDate) && (this.state.startDate > this.state.endDate)) return alert("Masa Berlaku Tidak Boleh Kurang Dari Tanggal Mulai");
// if (R.isEmpty(this.state.startDate)) return alert("Tanggal Mulai is Required.");
// if (R.isEmpty(this.state.endDate)) return alert("Tanggal Berakhir is Required.");
console.log('masuk');
let payload = {
"approval_type_id": 2,
"orders": this.state.order,
"user_id": this.state.getApprovedBy.user_id,
"operator_type_id": 2,
"start_date": this.state.startDate,
"end_date": this.state.endDate
}
// this.props.createAM(payload)
console.log(payload)
}
handleDate(item) { handleDate(item) {
let value = format(item, 'dd MMMM yyyy') let value = format(item, 'dd MMMM yyyy')
return value return value
...@@ -189,31 +243,15 @@ export default class EditApprovalMatrix extends Component { ...@@ -189,31 +243,15 @@ export default class EditApprovalMatrix extends Component {
</div> </div>
<div className="column-2"> <div className="column-2">
<div className="margin-top-10px" style={{ paddingTop: 4, paddingRight: 10, paddingBottom: 10, paddingLeft: 10, borderRadius: 5 }}> <div className="margin-top-10px" style={{ paddingTop: 4, paddingRight: 10, paddingBottom: 10, paddingLeft: 10, borderRadius: 5 }}>
<TextField <Autocomplete
style={{ width: '100%' }} {...this.state.approvedBy}
id="approve-by" option
select id="debug"
label="Pemberi Persetujuan" onChange={(event, newInputValue) => this.setState({getApprovedBy: newInputValue})}
value={this.props.data.fullname} debug
onChange={(e) => null} renderInput={(params) => <TextField {...params} label="debug" margin="normal" />}
selectProps={{ value={this.state.getApprovedBy}
style: { />
fontSize: 11
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085'
}
}}
>
{approve_by.map((option) => (
<MenuItem key={option.value} value={option.value}>
{option.label}
</MenuItem>
))}
</TextField>
</div> </div>
</div> </div>
</div> </div>
...@@ -363,7 +401,7 @@ export default class EditApprovalMatrix extends Component { ...@@ -363,7 +401,7 @@ export default class EditApprovalMatrix extends Component {
</div> </div>
</div> </div>
<div className="column-2" style={{display: 'flex', justifyContent: 'flex-end', alignItems: 'center'}}> <div className="column-2" style={{display: 'flex', justifyContent: 'flex-end', alignItems: 'center'}}>
<div style={{ width: 102, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center', cursor:"pointer" }}> <div onClick={() => this.validasi()} style={{ width: 102, height: 30, 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 }}>Simpan</span>
</div> </div>
</div> </div>
......
...@@ -29,8 +29,8 @@ export default class CreatePerusahaan extends Component { ...@@ -29,8 +29,8 @@ export default class CreatePerusahaan extends Component {
this.setState({ this.setState({
id: data.company_id, id: data.company_id,
company: data.company_name, company: data.company_name,
parentCompany: data.parent, parentCompany: data.parentName,
unitBisnis: data.businessUnitId, unitBisnis: data.businessUnitName,
totalReport: data.total_report, totalReport: data.total_report,
startDate: data.start_date, startDate: data.start_date,
endDate: data.end_date endDate: data.end_date
...@@ -56,9 +56,9 @@ export default class CreatePerusahaan extends Component { ...@@ -56,9 +56,9 @@ export default class CreatePerusahaan extends Component {
} }
validasi() { validasi() {
if (R.isEmpty(this.state.company)) return alert("Nama Perusahaan is Required."); if (R.isEmpty(this.state.company)) return alert("Nama perusahaan harus diisi.");
if (R.isEmpty(this.state.parentCompany)) return alert("Nama Perusahaan is Required.");
if (R.isEmpty(this.state.unitBisnis)) return alert("Unit Bisnis is Required."); if (R.isEmpty(this.state.unitBisnis)) return alert("Unit Bisnis is Required.");
if (R.isEmpty(this.state.parentCompany)) return alert("Parent Company is Required.");
if (R.isEmpty(this.state.totalReport)) return alert("Total Report is Required."); if (R.isEmpty(this.state.totalReport)) return alert("Total Report is Required.");
if (!R.isEmpty(this.state.startDate) && !R.isEmpty(this.state.endDate) && (this.state.startDate > this.state.endDate)) return alert("Masa Berlaku Tidak Boleh Kurang Dari Tanggal Mulai"); if (!R.isEmpty(this.state.startDate) && !R.isEmpty(this.state.endDate) && (this.state.startDate > this.state.endDate)) return alert("Masa Berlaku Tidak Boleh Kurang Dari Tanggal Mulai");
if (R.isEmpty(this.state.startDate)) return alert("Tanggal Mulai is Required."); if (R.isEmpty(this.state.startDate)) return alert("Tanggal Mulai is Required.");
...@@ -355,6 +355,25 @@ export default class CreatePerusahaan extends Component { ...@@ -355,6 +355,25 @@ export default class CreatePerusahaan extends Component {
<div className="border-bottom grid grid-2x grid-mobile-none gap-15px" style={{ padding: 20 }}> <div className="border-bottom grid grid-2x grid-mobile-none gap-15px" style={{ padding: 20 }}>
<div className="column-1"> <div className="column-1">
<div style={{ backgroundColor: '#e8e8e8', padding: 10, borderRadius: 5 }}>
<TextField
style={{ width: '100%' }}
id="id"
label="ID"
disabled
inputProps={{
style: {
fontSize: 11
}
}}
InputLabelProps={{
style: {
fontSize: 11,
color: '#7e8085'
}
}}
/>
</div>
<div style={{ padding: 10, borderRadius: 5 }}> <div style={{ padding: 10, borderRadius: 5 }}>
<TextField <TextField
style={{ width: '100%' }} style={{ width: '100%' }}
......
...@@ -68,7 +68,7 @@ export default class Perusahaan extends Component { ...@@ -68,7 +68,7 @@ export default class Perusahaan 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.map((item, index) => { let listData = data.map((item, index) => {
return [index, item.company_id, item.company_name, item.parent, item.businessUnitId, item.total_report, item.status] return [index, item.company_id, item.company_name, item.parentName, item.businessUnitName, item.total_report, item.status]
}) })
this.setState({ dataTable: listData, listData: response.data.data }) this.setState({ dataTable: listData, listData: response.data.data })
} else { } else {
...@@ -132,6 +132,36 @@ export default class Perusahaan extends Component { ...@@ -132,6 +132,36 @@ export default class Perusahaan extends Component {
}) })
} }
downloadFile = async () => {
let res = await fetch(
"https://tia.eksad.com/tia-reporting-dev/public/attachment/download_file?fileName=CompanyTemplate&&fileType=xlsx"
)
res = await res.blob()
console.log(res)
if (res.size > 0) {
let url = window.URL.createObjectURL(res);
let a = document.createElement('a');
a.href = url;
a.download = 'Template Perusahaan.xlsx';
a.click();
}
}
downloadDataTable = async () => {
let res = await fetch(
"https://tia.eksad.com/tia-reporting-dev/public/company/export_company"
)
res = await res.blob()
console.log(res)
if (res.size > 0) {
let url = window.URL.createObjectURL(res);
let a = document.createElement('a');
a.href = url;
a.download = 'Perusahaan.xlsx';
a.click();
}
}
render() { render() {
const columns = [{ const columns = [{
name: "Action", name: "Action",
...@@ -247,23 +277,45 @@ export default class Perusahaan extends Component { ...@@ -247,23 +277,45 @@ export default class Perusahaan extends Component {
/> />
</div> </div>
<div style={{ width: '20%', justifyContent: 'space-around', display: 'flex', flexFlow: 'wrap' }}> <div style={{ width: '20%', justifyContent: 'space-around', display: 'flex', flexFlow: 'wrap' }}>
<img src={Images.template} />
<button <button
style={{ style={{
backgroundColor: 'transparent', backgroundColor: 'transparent',
cursor: 'pointer', cursor: 'pointer',
borderColor: 'transparent' borderColor: 'transparent',
margin: 5
}}
onClick={() => this.downloadFile()}
>
<img src={Images.template} />
</button>
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
margin: 5
}} }}
onClick={() => this.setState({ visibleUpload: true })} onClick={() => this.setState({ visibleUpload: true })}
> >
<img src={Images.upload} /> <img src={Images.upload} />
</button> </button>
<img src={Images.download} />
<button <button
style={{ style={{
backgroundColor: 'transparent', backgroundColor: 'transparent',
cursor: 'pointer', cursor: 'pointer',
borderColor: 'transparent' borderColor: 'transparent',
margin: 5
}}
onClick={() => this.downloadDataTable()}
>
<img src={Images.download} />
</button>
<button
style={{
backgroundColor: 'transparent',
cursor: 'pointer',
borderColor: 'transparent',
margin: 5
}} }}
onClick={() => null} onClick={() => null}
> >
...@@ -273,7 +325,8 @@ export default class Perusahaan extends Component { ...@@ -273,7 +325,8 @@ export default class Perusahaan extends Component {
style={{ style={{
backgroundColor: 'transparent', backgroundColor: 'transparent',
cursor: 'pointer', cursor: 'pointer',
borderColor: 'transparent' borderColor: 'transparent',
margin: 5
}} }}
onClick={() => this.setState({ visibleCreate: true })} onClick={() => this.setState({ visibleCreate: true })}
> >
......
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