pre-fill donation input fields with data from query

webapp/graphql/Donations.js

@@ -1,5 +1,14 @@
 import gql from 'graphql-tag'
 
+export const DonationsQuery = () => gql`
+  query {
+    Donations {
+      goal
+      progress
+    }
+  }
+`
+
 export const UpdateDonations = () => {
   return gql`
     mutation($goal: Int, $progress: Int) {

webapp/pages/admin/donations.vue

@@ -16,7 +16,7 @@
 </template>
 
 <script>
-import { UpdateDonations } from '~/graphql/Donations'
+import { DonationsQuery, UpdateDonations } from '~/graphql/Donations'
 
 export default {
   data() {
@@ -44,5 +44,19 @@ export default {
         .catch(error => this.$toast.error(error.message))
     },
   },
+  apollo: {
+    Donations: {
+      query() {
+        return DonationsQuery()
+      },
+      result({ data: { Donations } }) {
+        const { goal, progress } = Donations[0]
+        this.formData = {
+          goal,
+          progress,
+        }
+      },
+    },
+  },
 }
 </script>