MT#61674 Add download CSV of PBx statistics

Add a button to download the PBX statistics
in a CSV file. The added button calls the
/conversations endpoint with the same filters
and pagination used to load the table with
Accept: 'text/csv' in the headers.

Change-Id: I2b148aa6fe6cb6627d5700ed71e139579181b891

src/api/conversations.js

@@ -6,6 +6,7 @@ import {
 } from 'src/api/call-blocking'
 import {
     LIST_DEFAULT_ROWS,
+    apiDownloadFile,
     getList,
     httpApi
 } from 'src/api/common'
@@ -56,6 +57,28 @@ export function getConversations (options) {
     })
 }
 
+export function downloadCsv (options) {
+    const apiGetOptions = {
+        resource: 'conversations',
+        config: {
+            headers: {
+                Accept: 'text/csv'
+            },
+            params: {
+                ...options
+            }
+        }
+    }
+
+    const defaultFileName = apiGetOptions.config.params.type ? `conversations-${apiGetOptions.config.params.type}.csv` : 'conversations.csv'
+
+    return apiDownloadFile({
+        apiGetOptions,
+        defaultFileName,
+        defaultContentType: 'text/csv'
+    })
+}
+
 export function downloadVoiceMail (id) {
     return new Promise((resolve, reject) => {
         httpApi.get(`api/voicemailrecordings/${id}`, { responseType: 'blob' })

src/pages/CscPagePbxStatisticsCdr.vue

@@ -64,6 +64,14 @@
                         >
                             {{ $t('Refresh') }}
                         </q-btn>
+                        <q-btn
+                            flat
+                            size="sm"
+                            :loading="$wait.is('loadConversations')"
+                            @click="triggerDownloadCsv"
+                        >
+                            {{ $t('Download CSV') }}
+                        </q-btn>
                     </template>
                 </q-table>
             </div>
@@ -186,7 +194,9 @@ export default {
     },
     methods: {
         ...mapWaitingActions('conversations', {
-            loadConversations: 'loadConversations'
+            loadConversations: 'loadConversations',
+            downloadCsv: 'loadConversations'
+
         }),
         async refresh () {
             await this.fetchPaginatedConversations({
@@ -224,6 +234,24 @@ export default {
             this.fetchPaginatedConversations({
                 pagination: this.pagination
             })
+        },
+        triggerDownloadCsv () {
+            const { page, rowsPerPage, sortBy, descending } = this.pagination
+            const { startTime, endTime, direction, type } = this.filter
+
+            this.downloadCsv({
+                page,
+                rows: rowsPerPage,
+                order_by: sortBy,
+                direction,
+                order_by_direction: descending ? 'desc' : 'asc',
+                ...(startTime !== null ? { from: startTime } : {}),
+                ...(endTime !== null ? { to: endTime } : {}),
+                ...(type !== null ? { type } : {}),
+                tz: 'UTC'
+            }).catch((error) => {
+                showGlobalError(error)
+            })
         }
     }
 }

src/store/conversations/actions.js

@@ -10,6 +10,7 @@ import { LIST_DEFAULT_ROWS } from 'src/api/common'
 import {
     deleteFax,
     deleteVoicemail,
+    downloadCsv,
     downloadFax,
     downloadVoiceMail,
     getConversations,
@@ -70,6 +71,15 @@ export default {
             })
         }
     },
+    async downloadCsv (context, options) {
+        context.commit('downloadCsvRequesting')
+        try {
+            await downloadCsv(options)
+            context.commit('downloadCsvSucceeded')
+        } catch (err) {
+            context.commit('downloadCsvFailed', err.message)
+        }
+    },
     downloadVoiceMail (context, id) {
         context.commit('downloadVoiceMailRequesting')
         downloadVoiceMail(id).then(() => {

src/store/conversations/mutations.js

@@ -19,6 +19,18 @@ function linkCallsWithSameId (state) {
 }
 
 export default {
+    downloadCsvRequesting (state) {
+        state.downloadCsvState = RequestState.requesting
+        state.downloadCsvError = null
+    },
+    downloadCsvSucceeded (state) {
+        state.downloadCsvState = RequestState.succeeded
+        state.downloadCsvError = null
+    },
+    downloadCsvFailed (state, error) {
+        state.downloadCsvState = RequestState.failed
+        state.downloadCsvError = error
+    },
     downloadVoiceMailRequesting (state) {
         state.downloadVoiceMailState = RequestState.requesting
         state.downloadVoiceMailError = null

src/store/conversations/state.js

@@ -5,6 +5,7 @@ export default {
     page: 1,
     rows: LIST_DEFAULT_ROWS,
     conversations: [],
+    downloadCsvState: RequestState.button,
     downloadVoiceMailState: RequestState.button,
     downloadVoiceMailError: null,
     downloadFaxState: RequestState.button,