diff --git a/CHANGELOG.md b/CHANGELOG.md
index 64ec5c92..a3b692bf 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -17,6 +17,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
- Add MRF Activity Expiration setting
- Add ability to disable multi-factor authentication for a user
- Ability to configure S3 settings on Upload tab
+- Show number of open reports in Sidebar Menu
### Changed
diff --git a/src/store/modules/reports.js b/src/store/modules/reports.js
index 6bc98993..1f6ae44f 100644
--- a/src/store/modules/reports.js
+++ b/src/store/modules/reports.js
@@ -2,12 +2,13 @@ import { changeState, fetchReports, createNote, deleteNote } from '@/api/reports
const reports = {
state: {
- fetchedReports: [],
- totalReportsCount: 0,
currentPage: 1,
+ fetchedReports: [],
+ loading: true,
+ openReportsCount: 0,
pageSize: 50,
stateFilter: '',
- loading: true
+ totalReportsCount: 0
},
mutations: {
SET_LAST_REPORT_ID: (state, id) => {
@@ -16,6 +17,9 @@ const reports = {
SET_LOADING: (state, status) => {
state.loading = status
},
+ SET_OPEN_REPORTS_COUNT: (state, total) => {
+ state.openReportsCount = total
+ },
SET_PAGE: (state, page) => {
state.currentPage = page
},
@@ -30,7 +34,7 @@ const reports = {
}
},
actions: {
- async ChangeReportState({ commit, getters, state }, reportsData) {
+ async ChangeReportState({ commit, dispatch, getters, state }, reportsData) {
changeState(reportsData, getters.authHost, getters.token)
const updatedReports = state.fetchedReports.map(report => {
@@ -39,6 +43,7 @@ const reports = {
})
commit('SET_REPORTS', updatedReports)
+ dispatch('FetchOpenReportsCount')
},
ClearFetchedReports({ commit }) {
commit('SET_REPORTS', [])
@@ -52,7 +57,14 @@ const reports = {
commit('SET_PAGE', page)
commit('SET_LOADING', false)
},
- SetFilter({ commit }, filter) {
+ async FetchOpenReportsCount({ commit, getters, state }) {
+ commit('SET_LOADING', true)
+ const { data } = await fetchReports('open', state.currentPage, state.pageSize, getters.authHost, getters.token)
+
+ commit('SET_OPEN_REPORTS_COUNT', data.total)
+ commit('SET_LOADING', false)
+ },
+ SetReportsFilter({ commit }, filter) {
commit('SET_REPORTS_FILTER', filter)
},
CreateReportNote({ commit, getters, state, rootState }, { content, reportID }) {
diff --git a/src/views/layout/components/Sidebar/Item.vue b/src/views/layout/components/Sidebar/Item.vue
index b515f615..a19a4288 100644
--- a/src/views/layout/components/Sidebar/Item.vue
+++ b/src/views/layout/components/Sidebar/Item.vue
@@ -1,8 +1,19 @@
+
+
+
+ {{ title }}
+
+
+
+
+
+
diff --git a/src/views/layout/components/Sidebar/SidebarItem.vue b/src/views/layout/components/Sidebar/SidebarItem.vue
index 9fb88139..7451ada2 100644
--- a/src/views/layout/components/Sidebar/SidebarItem.vue
+++ b/src/views/layout/components/Sidebar/SidebarItem.vue
@@ -4,14 +4,21 @@
-
+
-
-
+
@@ -26,7 +33,11 @@
-
+
@@ -43,6 +54,7 @@ import { isExternal } from '@/utils'
import Item from './Item'
import AppLink from './Link'
import FixiOSBug from './FixiOSBug'
+import numeral from 'numeral'
export default {
name: 'SidebarItem',
@@ -71,6 +83,9 @@ export default {
computed: {
invitesEnabled() {
return this.basePath === '/invites' ? this.$store.state.app.invitesEnabled : true
+ },
+ normalizedReportsCount() {
+ return numeral(this.$store.state.reports.openReportsCount).format('0a')
}
},
methods: {
@@ -104,6 +119,9 @@ export default {
}
return path.resolve(this.basePath, routePath)
},
+ showCount(item) {
+ return item.path === '/reports'
+ },
isExternalLink(routePath) {
return isExternal(routePath)
},
diff --git a/src/views/layout/components/Sidebar/index.vue b/src/views/layout/components/Sidebar/index.vue
index 11ef4c02..e52ae6b6 100644
--- a/src/views/layout/components/Sidebar/index.vue
+++ b/src/views/layout/components/Sidebar/index.vue
@@ -31,6 +31,9 @@ export default {
isCollapse() {
return !this.sidebar.opened
}
+ },
+ mounted() {
+ this.$store.dispatch('FetchOpenReportsCount')
}
}
diff --git a/src/views/reports/components/ReportsFilter.vue b/src/views/reports/components/ReportsFilter.vue
index 29e15075..0d34a389 100644
--- a/src/views/reports/components/ReportsFilter.vue
+++ b/src/views/reports/components/ReportsFilter.vue
@@ -38,11 +38,11 @@ export default {
}
},
created() {
- this.$store.dispatch('SetFilter', this.$data.filter)
+ this.$store.dispatch('SetReportsFilter', this.$data.filter)
},
methods: {
toggleFilters() {
- this.$store.dispatch('SetFilter', this.$data.filter)
+ this.$store.dispatch('SetReportsFilter', this.$data.filter)
this.$store.dispatch('ClearFetchedReports')
this.$store.dispatch('FetchReports', 1)
}
diff --git a/test/views/reports/reportsFilter.test.js b/test/views/reports/reportsFilter.test.js
index 0701262c..853cb1c3 100644
--- a/test/views/reports/reportsFilter.test.js
+++ b/test/views/reports/reportsFilter.test.js
@@ -26,7 +26,7 @@ describe('Reports filter', () => {
it('shows open reports when "Open" filter is applied', async (done) => {
expect(store.state.reports.fetchedReports.length).toEqual(7)
- store.dispatch('SetFilter', 'open')
+ store.dispatch('SetReportsFilter', 'open')
store.dispatch('ClearFetchedReports')
store.dispatch('FetchReports', 1)
await flushPromises()
@@ -38,7 +38,7 @@ describe('Reports filter', () => {
it('shows resolved reports when "Resolved" filter is applied', async (done) => {
expect(store.state.reports.fetchedReports.length).toEqual(7)
- store.dispatch('SetFilter', 'resolved')
+ store.dispatch('SetReportsFilter', 'resolved')
store.dispatch('ClearFetchedReports')
store.dispatch('FetchReports')
await flushPromises()
@@ -50,7 +50,7 @@ describe('Reports filter', () => {
it('shows closed reports when "Closed" filter is applied', async (done) => {
expect(store.state.reports.fetchedReports.length).toEqual(7)
- store.dispatch('SetFilter', 'closed')
+ store.dispatch('SetReportsFilter', 'closed')
store.dispatch('ClearFetchedReports')
store.dispatch('FetchReports')
await flushPromises()
@@ -62,13 +62,13 @@ describe('Reports filter', () => {
it('shows all users after removing filters', async (done) => {
expect(store.state.reports.fetchedReports.length).toEqual(7)
- store.dispatch('SetFilter', 'open')
+ store.dispatch('SetReportsFilter', 'open')
store.dispatch('ClearFetchedReports')
store.dispatch('FetchReports')
await flushPromises()
expect(store.state.reports.fetchedReports.length).toEqual(2)
- store.dispatch('SetFilter', '')
+ store.dispatch('SetReportsFilter', '')
store.dispatch('ClearFetchedReports')
store.dispatch('FetchReports')
await flushPromises()