Added new award flow to challenges (#10512)

website/client/components/challenges/challengeDetail.vue

@@ -3,7 +3,7 @@
   challenge-modal(v-on:updatedChallenge='updatedChallenge')
   leave-challenge-modal(:challengeId='challenge._id')
   close-challenge-modal(:members='members', :challengeId='challenge._id')
-  challenge-member-progress-modal(:memberId='progressMemberId', :challengeId='challenge._id')
+  challenge-member-progress-modal(:challengeId='challenge._id')
   .col-12.col-md-8.standard-page
     .row
       .col-12.col-md-6
@@ -231,7 +231,6 @@ export default {
       creatingTask: {},
       workingTask: {},
       taskFormPurpose: 'create',
-      progressMemberId: '',
       searchTerm: '',
       memberResults: [],
     };
@@ -345,6 +344,7 @@ export default {
       this.tasksByType[task.type].splice(index, 1);
     },
     showMemberModal () {
+      // @TODO: Change these to options and add a custom event to members modal
       this.$store.state.memberModalOptions.challengeId = this.challenge._id;
       this.$store.state.memberModalOptions.groupId = 'challenge'; // @TODO: change these terrible settings
       this.$store.state.memberModalOptions.group = this.group;
@@ -374,8 +374,9 @@ export default {
       Object.assign(this.challenge, eventData.challenge);
     },
     openMemberProgressModal (member) {
-      this.progressMemberId = member._id;
+      this.$root.$emit('habitica:challenge:member-progress', {
-      this.$root.$emit('bv::show::modal', 'challenge-member-modal');
+        progressMemberId: member._id,
+      });
     },
     async exportChallengeCsv () {
       // let response = await this.$store.dispatch('challenges:exportChallengeCsv', {

website/client/components/challenges/challengeMemberProgressModal.vue

@@ -1,5 +1,8 @@
 <template lang="pug">
   b-modal#challenge-member-modal(title="User Progress", size='lg')
+    .row.award-row
+      .col-12.text-center
+        button.btn.btn-primary(v-once, @click='closeChallenge()') {{ $t('awardWinners') }}
     .row
       task-column.col-6(
         v-for="column in columns",
@@ -8,12 +11,19 @@
         :taskListOverride='tasksByType[column]')
 </template>
 
+<style scoped>
+  .award-row {
+    padding-top: 1rem;
+    padding-bottom: 1rem;
+  }
+</style>
+
 <script>
 import axios from 'axios';
 import Column from '../tasks/column';
 
 export default {
-  props: ['challengeId', 'memberId'],
+  props: ['challengeId'],
   components: {
     TaskColumn: Column,
   },
@@ -26,8 +36,19 @@ export default {
         todo: [],
         reward: [],
       },
+      memberId: '',
     };
   },
+  mounted () {
+    this.$root.$on('habitica:challenge:member-progress', (data) => {
+      if (!data.progressMemberId) return;
+      this.memberId = data.progressMemberId;
+      this.$root.$emit('bv::show::modal', 'challenge-member-modal');
+    });
+  },
+  beforeDestroy () {
+    this.$root.$off('habitica:challenge:member-progress');
+  },
   watch: {
     async memberId (id) {
       if (!id) return;
@@ -45,5 +66,14 @@ export default {
       });
     },
   },
+  methods: {
+    async closeChallenge () {
+      this.challenge = await this.$store.dispatch('challenges:selectChallengeWinner', {
+        challengeId: this.challengeId,
+        winnerId: this.memberId,
+      });
+      this.$router.push('/challenges/myChallenges');
+    },
+  },
 };
 </script>

website/client/components/groups/membersModal.vue

@@ -53,6 +53,9 @@ div
               span.dropdown-icon-item
                 .svg-icon.inline(v-html="icons.removeIcon")
                 span.text {{$t('removeManager2')}}
+            b-dropdown-item(@click='viewProgress(member)')
+              span.dropdown-icon-item
+                span.text {{ $t('viewProgress') }}
       .row(v-if='isLoadMoreAvailable')
         .col-12.text-center
           button.btn.btn-secondary(@click='loadMoreMembers()') {{ $t('loadMore') }}
@@ -475,6 +478,11 @@ export default {
       groupData.leader = member;
       this.$root.$emit('updatedGroup', groupData);
     },
+    viewProgress (member) {
+      this.$root.$emit('habitica:challenge:member-progress', {
+        progressMemberId: member._id,
+      });
+    },
   },
 };
 </script>

website/common/locales/en/challenge.json

@@ -132,6 +132,7 @@
   "locationRequired": "Location of challenge is required ('Add to')",
   "categoiresRequired": "One or more categories must be selected",
   "viewProgressOf": "View Progress Of",
+  "viewProgress": "View Progress",
   "selectMember": "Select Member",
   "confirmKeepChallengeTasks": "Do you want to keep challenge tasks?",
   "selectParticipant": "Select a Participant"