filter added all/completed/not-yet

src/api/index.js

@@ -486,7 +486,7 @@ const create = (type = "") => {
   const getMonitoringMR = (body) => api.get(`transaction/monitoring/monthly_report/${body.year}/${body.month}`)
   const getMonitoringRO = (body) => api.get(`transaction/monitoring/rolling_outlook/${body.year}/${body.quarter}`)
   const getMonitoringOLPA = (body) => api.get(`transaction/monitoring/outlook/${body.year}`)
-  const getMonitoringCafrm = (body) => api.get(`transaction/monitoring/cafrm/${body.year}/${body.month}`)
+  const getMonitoringCafrm = (body) => api.get(`transaction/monitoring/cafrm/${body.year}/${body.month}/${body.status}`)
 
   // Superadmin Approve
   const getListApprover = (report, monthlyReportId) => api.get(`transaction/${report}/get_approver/${monthlyReportId}`)

src/container/ReportCarfm/RepotrCafrm.js

@@ -113,6 +113,27 @@ class RepotrCafrm extends Component {
             listPeriodeMB: defaultPropsMB,
             periodeMB: MB[MB.length - 2],
             curYear: currentYear,
+        }, async () => {
+            await this.getStatus()
+        })
+    }
+
+    async getStatus(){
+        let listStatusVal = [
+            {name: "All", value: 2},
+            {name: "Completed", value: 1},
+            {name: "Not-Yet", value: 0}
+        ];
+
+        let listStatus = {
+            options: listStatusVal,
+            getOptionLabel: (option) => option.name,
+        };
+
+        await this.setState({
+            listStatus,
+            defaultStatus : listStatusVal[0],
+            curStatus: listStatusVal[0].value
         }, async () => {
             await this.getFromCallback()
         })
@@ -160,7 +181,7 @@ class RepotrCafrm extends Component {
             }else{
                 month = this.state.curMonth;
             }
-        let payload = {year: this.state.curYear, month: month};
+        let payload = {year: this.state.curYear, month: month, status: this.state.curStatus};
 
             await this.getData(payload);
             console.log(`month ${this.state.curMonth} year ${this.state.curYear}`)
@@ -195,6 +216,10 @@ class RepotrCafrm extends Component {
         // })
     }
 
+    closeAlert() {
+        this.setState({ alert: false })
+    }
+
     render() {
 
         const columnMR = [
@@ -348,6 +373,21 @@ class RepotrCafrm extends Component {
                                             renderInput={(params) => <TextField {...params} label="Month" margin="normal" style={{marginTop: 7}}/>}
                                             value={this.state.month}
                                         />
+                                        <Autocomplete
+                                            {...this.state.listStatus}
+                                            id="status"
+                                            onChange={(event, newInputValue) => this.setState({
+                                                defaultStatus: newInputValue,
+                                                curStatus: newInputValue['value'],
+                                                loading: true
+                                            }, async () => {
+                                                await this.getFromCallback()
+                                            })}
+                                            disableClearable
+                                            style={{minWidth: 210, marginRight: 20}}
+                                            renderInput={(params) => <TextField {...params} label="Status" margin="normal" style={{marginTop: 7}}/>}
+                                            value={this.state.defaultStatus}
+                                        />
 
                                     </div>
                                 </div>