diff --git a/kolibri/plugins/coach/assets/src/views/learners/LearnerSummaryPage/LearnerHeader.vue b/kolibri/plugins/coach/assets/src/views/learners/LearnerSummaryPage/LearnerHeader.vue index c580fca768a..173fe0a4c55 100644 --- a/kolibri/plugins/coach/assets/src/views/learners/LearnerSummaryPage/LearnerHeader.vue +++ b/kolibri/plugins/coach/assets/src/views/learners/LearnerSummaryPage/LearnerHeader.vue @@ -240,7 +240,7 @@ printLabel: { message: '{className} Learners', context: - "Title that displays on a printed copy of the 'Coach' > 'Quizzes' page. This shows if the user uses the 'Print' option by clicking on the printer icon.", + "Title that displays on a printed copy of the 'Learners' > 'Learner' page. This shows if the user uses the 'Print' option by clicking on the printer icon.", }, }, }; diff --git a/kolibri/plugins/coach/assets/src/views/learners/LearnersRootPage.vue b/kolibri/plugins/coach/assets/src/views/learners/LearnersRootPage.vue index 0c1ed569ea0..7284a43ad9f 100644 --- a/kolibri/plugins/coach/assets/src/views/learners/LearnersRootPage.vue +++ b/kolibri/plugins/coach/assets/src/views/learners/LearnersRootPage.vue @@ -7,9 +7,9 @@ />
@@ -67,6 +67,7 @@ import sortBy from 'lodash/sortBy'; import ElapsedTime from 'kolibri-common/components/ElapsedTime'; import commonCoreStrings from 'kolibri/uiText/commonCoreStrings'; + import { ref } from '@vue/composition-api'; import commonCoach from '../common'; import CoachAppBarPage from '../CoachAppBarPage'; import CSVExporter from '../../csv/exporter'; @@ -74,6 +75,7 @@ import CoachHeader from '../common/CoachHeader'; import ReportsControls from '../common/ReportsControls'; import { PageNames } from '../../constants'; + import { coachStrings } from '../common/commonCoachStrings'; export default { name: 'LearnersRootPage', @@ -84,22 +86,25 @@ CoachHeader, }, mixins: [commonCoach, commonCoreStrings], - data() { + setup() { + const { entireClassLabel$ } = coachStrings; + + const recipientSelected = ref({ + label: entireClassLabel$(), + value: entireClassLabel$(), + }); + return { - filterOptions: [ - { - label: this.coreString('allLabel'), - value: this.coreString('allLabel'), - }, - ], - filterSelection: { label: this.coreString('allLabel'), value: this.coreString('allLabel') }, + entireClassLabel$, + recipientSelected, PageNames, }; }, computed: { table() { const sorted = sortBy(this.learners, ['name']); - return sorted.map(learner => { + + let augmentedTable = sorted.map(learner => { const groupNames = this.getGroupNames( this._.map( this.groups.filter(group => group.member_ids.includes(learner.id)), @@ -121,6 +126,37 @@ Object.assign(augmentedObj, learner); return augmentedObj; }); + + const recipientsFilter = this.recipientSelected.value; + + if (recipientsFilter !== this.entireClassLabel$()) { + augmentedTable = augmentedTable.filter(entry => { + return entry.groups.includes(recipientsFilter) || entry.id === recipientsFilter; + }); + } + + return augmentedTable; + }, + + recipientsOptions() { + const groupOptions = this.groups.map(group => ({ + label: group.name, + value: group.name, + })); + + const learnerOptions = this.learners.map(learner => ({ + label: learner.name, + value: learner.id, + })); + + return [ + { + label: this.entireClassLabel$(), + value: this.entireClassLabel$(), + }, + ...groupOptions, + ...learnerOptions, + ]; }, }, methods: {