feat: Download SLA reports (chatwoot#9201)

nestordavalos · Apr 9, 2024 · c4e111b · c4e111b
1 parent 12c5739
commit c4e111b
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 2 deletions.
diff --git a/app/javascript/dashboard/i18n/locale/en/report.json b/app/javascript/dashboard/i18n/locale/en/report.json
@@ -510,6 +510,8 @@
  "HEADER": "SLA Reports",
  "NO_RECORDS": "SLA applied conversations are not available.",
  "LOADING": "Loading SLA data...",
+ "DOWNLOAD_SLA_REPORTS": "Download SLA reports",
+ "DOWNLOAD_FAILED": "Failed to download SLA Reports",
  "METRICS": {
  "HIT_RATE": {
  "LABEL": "Hit Rate",

diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/SLAReports.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/SLAReports.vue
@@ -1,6 +1,14 @@
 <template>
  <div class="flex flex-col flex-1 px-4 pt-4 overflow-auto">
  <SLAReportFilters @filter-change="onFilterChange" />
+ <woot-button
+ color-scheme="success"
+ class-names="button--fixed-top"
+ icon="arrow-download"
+ @click="downloadReports"
+ >
+ {{ $t('SLA_REPORTS.DOWNLOAD_SLA_REPORTS') }}
+ </woot-button>
  <div class="flex flex-col gap-6">
  <SLAMetrics
  :hit-rate="slaMetrics.hitRate"
@@ -22,15 +30,17 @@
 import { mapGetters } from 'vuex';
 import SLAMetrics from './components/SLA/SLAMetrics.vue';
 import SLATable from './components/SLA/SLATable.vue';
+import alertMixin from 'shared/mixins/alertMixin';
 import SLAReportFilters from './components/SLA/SLAReportFilters.vue';
-
+import { generateFileName } from 'dashboard/helper/downloadHelper';
 export default {
  name: 'SLAReports',
  components: {
  SLAMetrics,
  SLATable,
  SLAReportFilters,
  },
+ mixins: [alertMixin],
  data() {
  return {
  pageNumber: 1,
@@ -73,6 +83,17 @@ export default {
  this.fetchSLAReports();
  this.fetchSLAMetrics();
  },
+ downloadReports() {
+ const type = 'sla';
+ try {
+ this.$store.dispatch('slaReports/download', {
+ fileName: generateFileName({ type, to: this.to }),
+ ...this.requestPayload,
+ });
+ } catch (error) {
+ this.showAlert(this.$t('SLA_REPORTS.DOWNLOAD_FAILED'));
+ }
+ },
  },
 };
 </script>
diff --git a/app/javascript/dashboard/store/modules/SLAReports.js b/app/javascript/dashboard/store/modules/SLAReports.js
@@ -1,7 +1,7 @@
 import * as MutationHelpers from 'shared/helpers/vuex/mutationHelpers';
 import types from '../mutation-types';
 import SLAReportsAPI from '../../api/slaReports';
-
+import { downloadCsvFile } from 'dashboard/helper/downloadHelper';
 export const state = {
  records: [],
  metrics: {
@@ -60,6 +60,11 @@ export const actions = {
  commit(types.SET_SLA_REPORTS_UI_FLAG, { isFetchingMetrics: false });
  }
  },
+ download(_, params) {
+ return SLAReportsAPI.download(params).then(response => {
+ downloadCsvFile(params.fileName, response.data);
+ });
+ },
 };
 
 export const mutations = {