Skip to content

T
Tia-dev
Commit efbe200a authored by Riri Novita's avatar Riri Novita
Browse files
Options

fixing manual reminder

parent 44fb4e03
Show whitespace changes
Inline Side-by-side
Showing with 87 additions and 11 deletions
src/container/ProgressReport/TableProgressReport.js
View file @ efbe200a
...@@ -3,6 +3,8 @@ import { createMuiTheme, FormControlLabel, Input, MuiThemeProvider, TableCell, T ...@@ -3,6 +3,8 @@ import { createMuiTheme, FormControlLabel, Input, MuiThemeProvider, TableCell, T
import MUIDataTable from "mui-datatables"; import MUIDataTable from "mui-datatables";
import api from '../../api'; import api from '../../api';
import Constant from '../../library/Constant'; import Constant from '../../library/Constant';
import { PropagateLoader } from "react-spinners";
import Images from "../../assets/Images";
var ct = require("../../library/CustomTable"); var ct = require("../../library/CustomTable");
...@@ -25,29 +27,46 @@ export default class TableProgressReport extends Component { ...@@ -25,29 +27,46 @@ export default class TableProgressReport extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
this.state = { this.state = {
visiblePopup: false,
idCompany: null,
companyName: "",
month: "",
} }
} }
handleSendEmail(idCompany) { handleShowPopup(id, data) {
// console.log(this.props); let item = this.props
console.log(item);
let bulan = item.month == 1 ? "Jan" : item.month == 2 ? "Feb" : item.month == 3 ? "Mar" : item.month == 4 ? "Apr" : item.month == 5 ? "May" : item.month == 6 ? "Jun" : item.month == 7 ? "Jul" : item.month == 8 ? "Aug" : item.month == 9 ? "Sep" : item.month == 10 ? "Oct" : item.month == 11 ? "Nov" : item.month == 12 ? "Dec" : null
this.setState({ visiblePopup: true, idCompany: id, companyName: data[0], month: bulan })
}
handleSendEmail() {
this.setState({ loading: true })
let data = this.props let data = this.props
let q1 = data.reportType === 2 && data.quarter === "Q1" let q1 = data.reportType === 2 && data.quarter === "Q1"
let q2 = data.reportType === 2 && data.quarter === "Q2" let q2 = data.reportType === 2 && data.quarter === "Q2"
let q3 = data.reportType === 2 && data.quarter === "Q3" let q3 = data.reportType === 2 && data.quarter === "Q3"
console.log(q1);
let payload = { let payload = {
"company_id": idCompany, "company_id": this.state.idCompany,
"setting_type_name": data.reportType === 0 ? "master_budget" : data.reportType === 1 ? "monthly_report" : q1 ? "outlook_q1" : q2 ? "outlook_q2" : q3 ? "outlook_q3" : data.reportType === 3 ? "outlook_pa" : null, "setting_type_name": data.reportType === 0 ? "master_budget" : data.reportType === 1 ? "monthly_report" : q1 ? "outlook_q1" : q2 ? "outlook_q2" : q3 ? "outlook_q3" : data.reportType === 3 ? "outlook_pa" : null,
"year": data.year, "year": data.year,
"month": data.reportType === 1 ? data.month : null "month": data.reportType === 1 ? data.month : null
} }
console.log(payload);
api.create().sendEmail(payload).then(response => { api.create().sendEmail(payload).then(response => {
console.log(response);
if (response.data) { if (response.data) {
if (response.ok) { if (response.ok) {
this.setState({ loading: false })
if (response.data.status == 'success') { if (response.data.status == 'success') {
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'success' }, () => {
setTimeout(() => {
this.setState({ loading: false })
this.getData() this.getData()
this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'success' }) }, 2000);
})
// this.setState({ alert: true, messageAlert: response.data.message, tipeAlert: 'success' })
} 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") || response.data.message.includes("Token Expired")) { if (response.data.message.includes("Someone Logged In") || response.data.message.includes("Token Expired")) {
...@@ -188,7 +207,7 @@ export default class TableProgressReport extends Component { ...@@ -188,7 +207,7 @@ export default class TableProgressReport extends Component {
<button <button
type="button" type="button"
style={{ background: 'white' }} style={{ background: 'white' }}
onClick={() => this.handleSendEmail(tableMeta.rowData[5])} onClick={() => this.handleShowPopup(tableMeta.rowData[5], tableMeta.rowData)}
> >
<div style={{ width: 85, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}> <div style={{ width: 85, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<span style={{ color: '#fff', fontSize: 11 }}>{tableMeta.rowData[3] === null || tableMeta.rowData[3] === 0 ? "Send Email" : "Sent"}</span> <span style={{ color: '#fff', fontSize: 11 }}>{tableMeta.rowData[3] === null || tableMeta.rowData[3] === 0 ? "Send Email" : "Sent"}</span>
...@@ -350,7 +369,7 @@ export default class TableProgressReport extends Component { ...@@ -350,7 +369,7 @@ export default class TableProgressReport extends Component {
<button <button
type="button" type="button"
style={{ background: 'white' }} style={{ background: 'white' }}
onClick={() => this.handleSendEmail(tableMeta.rowData[5])} onClick={() => this.handleShowPopup(tableMeta.rowData[5], tableMeta.rowData)}
> >
<div style={{ position: 'relative', width: 85, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}> <div style={{ position: 'relative', width: 85, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<span style={{ color: '#fff', fontSize: 11 }}>{tableMeta.rowData[3] === null || tableMeta.rowData[3] === 0 ? "Send Email" : "Sent"}</span> <span style={{ color: '#fff', fontSize: 11 }}>{tableMeta.rowData[3] === null || tableMeta.rowData[3] === 0 ? "Send Email" : "Sent"}</span>
...@@ -496,7 +515,7 @@ export default class TableProgressReport extends Component { ...@@ -496,7 +515,7 @@ export default class TableProgressReport extends Component {
<button <button
type="button" type="button"
style={{ background: 'white' }} style={{ background: 'white' }}
onClick={() => this.handleSendEmail(tableMeta.rowData[5])} onClick={() => this.handleShowPopup(tableMeta.rowData[5], tableMeta.rowData)}
> >
<div style={{ width: 85, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}> <div style={{ width: 85, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<span style={{ color: '#fff', fontSize: 11 }}>{tableMeta.rowData[3] === null || tableMeta.rowData[3] === 0 ? "Send Email" : "Sent"}</span> <span style={{ color: '#fff', fontSize: 11 }}>{tableMeta.rowData[3] === null || tableMeta.rowData[3] === 0 ? "Send Email" : "Sent"}</span>
...@@ -642,7 +661,7 @@ export default class TableProgressReport extends Component { ...@@ -642,7 +661,7 @@ export default class TableProgressReport extends Component {
<button <button
type="button" type="button"
style={{ background: 'white' }} style={{ background: 'white' }}
onClick={() => this.handleSendEmail(tableMeta.rowData[5])} onClick={() => this.handleShowPopup(tableMeta.rowData[5], tableMeta.rowData)}
> >
<div style={{ width: 85, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}> <div style={{ width: 85, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<span style={{ color: '#fff', fontSize: 11 }}>{tableMeta.rowData[3] === null || tableMeta.rowData[3] === 0 ? "Send Email" : "Sent"}</span> <span style={{ color: '#fff', fontSize: 11 }}>{tableMeta.rowData[3] === null || tableMeta.rowData[3] === 0 ? "Send Email" : "Sent"}</span>
...@@ -685,9 +704,21 @@ export default class TableProgressReport extends Component { ...@@ -685,9 +704,21 @@ export default class TableProgressReport 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> <div>
<div style={{ padding: "0px 20px 20px 20px", width: this.props.width - (this.props.open === true ? 350 : 100) }}> <div style={{ padding: "0px 20px 20px 20px", width: this.props.width - (this.props.open === true ? 350 : 100) }}>
{this.state.loading && loadingComponent}
<MuiThemeProvider theme={getMuiTheme()}> <MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable <MUIDataTable
data={dataTable2} data={dataTable2}
...@@ -697,6 +728,51 @@ export default class TableProgressReport extends Component { ...@@ -697,6 +728,51 @@ export default class TableProgressReport extends Component {
/> />
</MuiThemeProvider> </MuiThemeProvider>
</div> </div>
{this.state.visiblePopup && (
<div className="test app-popup-show">
<div className="popup-content background-white border-radius" style={{ borderRadius: 8 }}>
<div style={{ display: 'flex', justifyContent: 'center', paddingTop: 20 }}>
<img src={Images.failed} />
</div>
{this.props.reportType === 1 ?
<div style={{ marginTop: 20, paddingBottom: 20 }}>
<Typography style={{ fontSize: 18, justifyContent: 'center', margin: 20, textAlign: 'center' }}>Apakah anda yakin ingin mengirimkan email Reminder Submission <b>{this.props.typeReport} {this.state.month} {this.props.year}</b> ke perusahaan <b>{this.state.companyName}</b>?</Typography>
</div>
:
this.props.reportType === 2 ?
<div style={{ marginTop: 20, paddingBottom: 20 }}>
<Typography style={{ fontSize: 18, justifyContent: 'center', margin: 20, textAlign: 'center' }}>Apakah anda yakin ingin mengirimkan email Reminder Submission <b>{this.props.typeReport} {this.props.quarter} {this.props.year}</b> ke perusahaan <b>{this.state.companyName}</b>?</Typography>
</div>
:
<div style={{ marginTop: 20, paddingBottom: 20 }}>
<Typography style={{ fontSize: 18, justifyContent: 'center', margin: 20, textAlign: 'center' }}>Apakah anda yakin ingin mengirimkan email Reminder Submission <b>{this.props.typeReport} {this.props.year}</b> ke perusahaan <b>{this.state.companyName}</b>?</Typography>
</div>
}
<div className="border-top grid grid-2x" style={{ height: 56, backgroundColor: '#f5f5f5', paddingLeft: 20, paddingRight: 20 }}>
<div className="column-1" style={{ alignSelf: 'center' }}>
<button
type="button"
onClick={() => this.setState({ visiblePopup: false })}
>
<div style={{ width: 102, height: 30, border: 'solid 1px #354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<span style={{ color: '#354960', fontSize: 11 }}>Cancel</span>
</div>
</button>
</div>
<div className="column-2" style={{ display: 'flex', justifyContent: 'flex-end', alignItems: 'center' }}>
<button
type="button"
onClick={() => this.handleSendEmail()}
>
<div style={{ width: 102, height: 30, backgroundColor: '#354960', borderRadius: 5, alignItems: 'center', display: 'flex', justifyContent: 'center' }}>
<span style={{ color: '#fff', fontSize: 11 }}>Send</span>
</div>
</button>
</div>
</div>
</div>
</div>
)}
</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