feat: See Contributions details from reward administration - MEED-7482 …

…- Meeds-io/MIPs#154 (#593)

This PR will allow admin to see contribution details from reward
management.

wallet-webapps/src/main/webapp/WEB-INF/gatein-resources.xml

@@ -401,6 +401,12 @@ Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
       <depends>
         <module>applicationToolbarComponent</module>
       </depends>
+      <depends>
+        <module>usersLeaderboardCommon</module>
+      </depends>
+      <depends>
+        <module>ruleExtensions</module>
+      </depends>
       <depends>
         <module>vue</module>
       </depends>

wallet-webapps/src/main/webapp/vue-app/wallet-reward/components/reward/RewardDetails.vue

@@ -103,9 +103,16 @@
           :contract-details="contractDetails"
           :token-symbol="tokenSymbol"
           :completely-proceeded="completelyProceeded"
-          :transaction-ether-scan-link="transactionEtherScanLink" />
+          :transaction-ether-scan-link="transactionEtherScanLink"
+          @open-contribution-details="openContributionDetails" />
       </template>
     </v-data-table>
+    <users-leaderboard-profile-achievements-drawer
+      ref="profileStatsDrawer"
+      :from-date-in-second="startDateInSeconds"
+      :to-date-in-second="endDateInSeconds"
+      go-back-button
+      relative />
   </v-card>
 </template>
 
@@ -201,8 +208,17 @@ export default {
     completelyProceeded() {
       return this.rewardReport?.completelyProceeded;
     },
+    endDateInSeconds() {
+      return this.period?.endDateInSeconds;
+    },
+    startDateInSeconds() {
+      return this.period?.startDateInSeconds;
+    },
+    rewardPeriodType() {
+      return this.period?.rewardPeriodType;
+    },
     isNotPastPeriod() {
-      return !this.period || this.period.endDateInSeconds > this.currentTimeInSeconds;
+      return !this.period || this.endDateInSeconds > this.currentTimeInSeconds;
     },
     walletRewards() {
       return (this.rewardReport && this.rewardReport.rewards) || [];
@@ -295,6 +311,9 @@ export default {
           });
       });
     },
+    openContributionDetails(userId) {
+      this.$refs?.profileStatsDrawer?.openByIdentityId(userId, this.rewardPeriodType);
+    }
   },
 };
 </script>

wallet-webapps/src/main/webapp/vue-app/wallet-reward/components/reward/RewardDetailsItem.vue

@@ -41,9 +41,9 @@
         display-no-address />
     </td>
     <td class="text-center">
-      <span>
+      <v-btn icon @click="openContributionDetails">
         {{ points }}
-      </span>
+      </v-btn>
     </td>
     <td class="text-center">
       <template v-if="!status">
@@ -290,6 +290,9 @@ export default {
     },
     seeHistory() {
       this.$refs.accountDetail.open();
+    },
+    openContributionDetails() {
+      this.$emit('open-contribution-details', this.walletTechnicalId);
     }
   }
 };