Bläddra i källkod

:recycle: Refactored thank you into separate component

tags/0.0.3^2
tomit4 3 år sedan
förälder
incheckning
e09e484b01
2 ändrade filer med 30 tillägg och 18 borttagningar
  1. 4
    18
      frontend/src/views/OnboardingView.vue
  2. 26
    0
      frontend/src/views/SurveyCompleteView.vue

+ 4
- 18
frontend/src/views/OnboardingView.vue Visa fil

19
                 @update-answers='updateAnswers'
19
                 @update-answers='updateAnswers'
20
                 v-if='step && currentStep == i'
20
                 v-if='step && currentStep == i'
21
             )
21
             )
22
-    // TODO: change to different vue component
23
-    article(
24
-        style='display: flex; flex-direction: column; align-items: center; text-align: center;'
25
-        v-else
26
-    )
27
-        h1 Thanks for Completing Our Survey!!
28
-        h2 Please review your answers and let us know if you need to change anything.
29
-        span Your name: {{ answered.name }}
30
-        span Your email: {{ answered.email }}
31
-        span Your zipcode: {{ answered.zipcode }}
32
-        span Your blurb: {{ answered.blurb }}
33
-        span Your image: {{ answered.image }}
34
-        br
35
-        button(@click="changeAnswers") Change Answers
36
-        br
37
-        button(@click="finalSubmit") Submit Answers
38
-
22
+    article(v-else)
23
+        SurveyCompleteView(:answers='answered')
39
 </template>
24
 </template>
40
 
25
 
41
 <script>
26
 <script>
42
 import { surveyFactory } from '@/utils'
27
 import { surveyFactory } from '@/utils'
43
 import { allSteps } from '@/utils/lang'
28
 import { allSteps } from '@/utils/lang'
44
 import stepViews from '@/components/onboarding'
29
 import stepViews from '@/components/onboarding'
30
+import SurveyCompleteView from './SurveyCompleteView.vue'
45
 
31
 
46
 // import savesurveybyprfileid - call it on submit
32
 // import savesurveybyprfileid - call it on submit
47
 // paginate to save every steps answers
33
 // paginate to save every steps answers
49
     name: 'OnboardingView',
35
     name: 'OnboardingView',
50
     components: {
36
     components: {
51
         ...stepViews,
37
         ...stepViews,
38
+        SurveyCompleteView
52
     },
39
     },
53
     data: () => ({
40
     data: () => ({
54
         answered: {},
41
         answered: {},
62
     methods: {
49
     methods: {
63
         onSubmit() {
50
         onSubmit() {
64
             console.log(JSON.stringify(this.answered))
51
             console.log(JSON.stringify(this.answered))
65
-            // TODO: Change to different vue component
66
             this.survey = null
52
             this.survey = null
67
             this.goToStep(this.currentStep + 1)
53
             this.goToStep(this.currentStep + 1)
68
         },
54
         },

+ 26
- 0
frontend/src/views/SurveyCompleteView.vue Visa fil

1
+<template lang="pug">
2
+main.view--surveycomplete
3
+    article(style='display: flex; flex-direction: column; align-items: center; text-align: center;')
4
+        h1 Thanks for Completing Our Survey!!
5
+        h2 Please review your answers and let us know if you need to change anything.
6
+        span Your name: {{ answers.name }}
7
+        span Your email: {{ answers.email }}
8
+        span Your zipcode: {{ answers.zipcode }}
9
+        span Your blurb: {{ answers.blurb }}
10
+        span Your image: {{ answers.image }}
11
+        br
12
+        button(@click="changeAnswers") Change Answers
13
+        br
14
+        button(@click="finalSubmit") Submit Answers
15
+</template>
16
+
17
+<script>
18
+export default {
19
+    props: {
20
+        answers: {
21
+            type: Object,
22
+                default: () => ({})
23
+        },
24
+    }
25
+}
26
+</script>

Laddar…
Avbryt
Spara