change file namee

src/container/Reports/ReportHistorical.js

@@ -22,6 +22,7 @@ class ReportHistorical extends Component {
       selectedValue: null,
       data: {},
       isLoading: false,
+      isLoadingReportType: false,
 
       listReportType: [],
       listPeriodType: [
@@ -41,8 +42,12 @@ class ReportHistorical extends Component {
     this.setState({ isLoading })
   }
 
+  setLoadingReportType = (isLoadingReportType) => {
+    this.setState({ isLoadingReportType })
+  }
+
   getData() {
-    this.setLoading(true)
+    this.setLoadingReportType(true)
     api.create().getHistoricalReport().then((res) => {
       const list = res.data?.data || []
       const arr = []
@@ -51,6 +56,7 @@ class ReportHistorical extends Component {
       })
       this.setState({ listReportType: arr }, () => {
         this.setDefaultData()
+        this.setLoadingReportType(false)
       })
     })
   }
@@ -101,21 +107,22 @@ class ReportHistorical extends Component {
 
   handleDownload = async () => {
     try {
-
       this.setLoading(true)
+      const { data } = this.state
       const payload = {
-        report_id: this.state.data.report_id?.id,
-        company_id: this.state.data.company_id?.map(c => c.id).join(','),
-        performance_period: this.state.data.performance_period?.id,
-        year: this.state.data.year?.id,
-        month: this.state.data.month?.id,
+        report_id: data.report_id?.id,
+        company_id: data.company_id?.map(c => c.id).join(','),
+        performance_period: data.performance_period?.id,
+        year: data.year?.id,
+        month: data.month?.id,
       }
       api.create('DOWNLOAD').exportReportHistorial(payload).then(async (res) => {
         this.setLoading(false)
         const blob = res.data
 
         if (blob && blob.size > 0) {
-          downloadFileBlob('Historical.xlsx', blob)
+          const fileName = `Report_${Constant.PERIOD_TYPE[data.performance_period?.id]}_${data.report_id?.name}_${data.month?.name}_${data.year?.name}.xlsx`
+          downloadFileBlob(fileName, blob)
         }
 
         this.showAlert('Download Berhasil', 'success');
@@ -128,7 +135,7 @@ class ReportHistorical extends Component {
   };
 
   render() {
-    const { data, showAlert, alertMessage, alertSeverity, listReportType, listPeriodType, isLoading } = this.state;
+    const { data, showAlert, alertMessage, alertSeverity, listReportType, listPeriodType, isLoading, isLoadingReportType } = this.state;
     const contentStyle = { display: 'flex', marginTop: 10, gap: '20px' };
 
     return (
@@ -145,7 +152,7 @@ class ReportHistorical extends Component {
                   value={data?.report_id}
                   onChange={(event, newValue) => this.handleChangeDropdown(newValue, 'report_id')}
                   label="Report Type"
-                  isLoading={isLoading}
+                  isLoading={isLoadingReportType}
                 />
                 <AutocompleteField
                   options={listPeriodType}

src/library/Constant.js

@@ -21,6 +21,10 @@ const Constant = {
         ERROR: 'error',
         WARNING: 'warning',
     },
+    PERIOD_TYPE : {
+        MTD: 'Monthly Historical',
+        YTD: 'Annual Historical',
+    },
 }