add updateContribution updateContributionForm

frontend/src/components/Contributions/ContributionList.vue

@@ -1,8 +1,7 @@
 <template>
   <div class="contribution-list container">
-    {{ contributionCount }}
     <div class="list-group" v-for="item in items" :key="item.id">
-      <contribution-list-item v-bind="item" @update-contribution="updateContribution" />
+      <contribution-list-item v-bind="item" @update-contribution-form="updateContributionForm" />
     </div>
     <b-pagination
       v-if="isPaginationVisible"
@@ -50,8 +49,8 @@ export default {
       })
       window.scrollTo(0, 0)
     },
-    updateContribution(item) {
+    updateContributionForm(item) {
-      this.$emit('update-contribution', item)
+      this.$emit('update-contribution-form', item)
     },
   },
   computed: {

frontend/src/components/Contributions/ContributionListItem.vue

@@ -4,6 +4,7 @@
       <div class="border p-3 w-100 mb-1" :class="`border-${variant}`">
         <div class="d-inline-flex">
           <div class="mr-2"><b-icon :icon="icon" :variant="variant" class="h2"></b-icon></div>
+          <div v-if="firstName" class="mr-3">{{ firstName }} {{ lastName }}</div>
           <div class="mr-2" :class="type != 'deleted' ? 'font-weight-bold' : ''">
             {{ amount | GDD }}
           </div>
@@ -12,10 +13,10 @@
         </div>
         <div class="mr-2">{{ memo }}</div>
         <div
-          v-if="type === 'pending'"
+          v-if="type === 'pending' && !firstName"
           class="text-right pointer"
           @click="
-            $emit('update-contribution', {
+            $emit('update-contribution-form', {
               id: id,
               createdAt: createdAt,
               memo: memo,
@@ -42,6 +43,14 @@ export default {
     memo: {
       type: String,
     },
+    firstName: {
+      type: String,
+      require: false,
+    },
+    lastName: {
+      type: String,
+      require: false,
+    },
     createdAt: {
       type: String,
     },
@@ -78,8 +87,8 @@ export default {
     },
   },
   methods: {
-    updateContribution(item) {
+    updateContributionForm(item) {
-      this.$emit('update-contribution', item)
+      this.$emit('update-contribution-form', item)
     },
   },
 }

frontend/src/graphql/mutations.js

@@ -98,3 +98,18 @@ export const createContribution = gql`
     }
   }
 `
+
+export const updateContribution = gql`
+  mutation($contributionId: Int!, $amount: Decimal!, $memo: String!, $creationDate: String!) {
+    updateContribution(
+      contributionId: $contributionId
+      amount: $amount
+      memo: $memo
+      creationDate: $creationDate
+    ) {
+      id
+      amount
+      memo
+    }
+  }
+`

frontend/src/graphql/queries.js

@@ -176,6 +176,22 @@ export const listContributions = gql`
       order: $order
       filterConfirmed: $filterConfirmed
     ) {
+      contributionCount
+      contributionList {
+        id
+        amount
+        memo
+        createdAt
+        confirmedAt
+        confirmedBy
+      }
+    }
+  }
+`
+
+export const listAllContributions = gql`
+  query($currentPage: Int = 1, $pageSize: Int = 25, $order: Order = DESC) {
+    listAllContributions(currentPage: $currentPage, pageSize: $pageSize, order: $order) {
       contributionCount
       contributionList {
         id

frontend/src/pages/Community.vue

@@ -3,19 +3,32 @@
     <div>
       <b-tabs v-model="tabIndex" content-class="mt-3" align="center">
         <b-tab :title="$t('community.writing')" active>
-          <contribution-form @set-contribution="setContribution" v-model="form" />
+          <contribution-form
+            @set-contribution="setContribution"
+            @update-contribution="updateContribution"
+            v-model="form"
+          />
         </b-tab>
         <b-tab :title="$t('community.myContributions')">
           <contribution-list
             :items="items"
             @update-list-contributions="updateListContributions"
-            @update-contribution="updateContribution"
+            @update-contribution-form="updateContributionForm"
             :contributionCount="contributionCount"
             :showPagination="true"
             :pageSize="pageSize"
           />
         </b-tab>
-        <b-tab :title="$t('navigation.community')"></b-tab>
+        <b-tab :title="$t('navigation.community')">
+          <contribution-list
+            :items="itemsAll"
+            @update-list-contributions="updateListAllContributions"
+            @update-contribution-form="updateContributionForm"
+            :contributionCount="contributionCountAll"
+            :showPagination="true"
+            :pageSize="pageSizeAll"
+          />
+        </b-tab>
       </b-tabs>
     </div>
   </div>
@@ -23,8 +36,8 @@
 <script>
 import ContributionForm from '@/components/Contributions/ContributionForm.vue'
 import ContributionList from '@/components/Contributions/ContributionList.vue'
-import { createContribution } from '@/graphql/mutations'
+import { createContribution, updateContribution } from '@/graphql/mutations'
-import { listContributions, verifyLogin } from '@/graphql/queries'
+import { listContributions, listAllContributions, verifyLogin } from '@/graphql/queries'
 
 export default {
   name: 'Community',
@@ -36,9 +49,12 @@ export default {
     return {
       tabIndex: 0,
       items: [],
+      itemsAll: [],
       currentPage: 1,
       pageSize: 25,
+      pageSizeAll: 25,
       contributionCount: 0,
+      contributionCountAll: 0,
       form: {
         id: null,
         date: '',
@@ -73,6 +89,55 @@ export default {
           this.toastError(err.message)
         })
     },
+    updateContribution(data) {
+      // console.log('setContribution', data)
+      this.$apollo
+        .mutate({
+          fetchPolicy: 'no-cache',
+          mutation: updateContribution,
+          variables: {
+            contributionId: data.id,
+            creationDate: data.date,
+            memo: data.memo,
+            amount: data.amount,
+          },
+        })
+        .then((result) => {
+          // console.log('result', result.data)
+          this.toastSuccess(result.data)
+          this.updateListContributions({
+            currentPage: this.currentPage,
+            pageSize: this.pageSize,
+          })
+          this.verifyLogin()
+        })
+        .catch((err) => {
+          this.toastError(err.message)
+        })
+    },
+    updateListAllContributions(pagination) {
+      this.$apollo
+        .query({
+          fetchPolicy: 'no-cache',
+          query: listAllContributions,
+          variables: {
+            currentPage: pagination.currentPage,
+            pageSize: pagination.pageSize,
+          },
+        })
+        .then((result) => {
+          // console.log('result', result.data)
+          const {
+            data: { listAllContributions },
+          } = result
+          this.contributionCountAll = listAllContributions.contributionCount
+          this.itemsAll = listAllContributions.contributionList
+          // this.toastSuccess(result.data)
+        })
+        .catch((err) => {
+          this.toastError(err.message)
+        })
+    },
     updateListContributions(pagination) {
       this.$apollo
         .query({
@@ -112,7 +177,7 @@ export default {
           this.$emit('logout')
         })
     },
-    updateContribution(item) {
+    updateContributionForm(item) {
       this.form.id = item.id
       this.form.date = item.createdAt
       this.form.memo = item.memo
@@ -128,6 +193,10 @@ export default {
       currentPage: this.currentPage,
       pageSize: this.pageSize,
     })
+    this.updateListAllContributions({
+      currentPage: this.currentPage,
+      pageSize: this.pageSize,
+    })
     this.updateTransactions(0)
   },
 }