Przeglądaj źródła

:recycle: Refactored onboarding survey flow

tabs-content
tomit4 3 lat temu
rodzic
commit
2bd97c45e2

+ 1
- 1
frontend/src/components/onboarding/FormInput.vue Wyświetl plik

10
     span(v-if='question.response_key_prompt == "zipcode"') What zipcode would you like to see results from?{{ question.response_key_prompt }}: 
10
     span(v-if='question.response_key_prompt == "zipcode"') What zipcode would you like to see results from?{{ question.response_key_prompt }}: 
11
     input(v-if='question.response_key_prompt == "zipcode"' placeholder='99999' type='text' v-model='input')
11
     input(v-if='question.response_key_prompt == "zipcode"' placeholder='99999' type='text' v-model='input')
12
     span(v-if='question.response_key_prompt == "blurb"') Please provide us with a short {{ question.response_key_prompt }} about yourself?: 
12
     span(v-if='question.response_key_prompt == "blurb"') Please provide us with a short {{ question.response_key_prompt }} about yourself?: 
13
-    textarea(v-if='question.response_key_prompt == "blurb"' placeholder='I was born on a distant planet named Krypton, but was raised in a small town called SmallVille...' type='text' v-model='input' rows='4' cols='50')
13
+    textarea(v-if='question.response_key_prompt == "blurb"' placeholder='My Origin Story starts off like this...' type='text' v-model='input' rows='4' cols='50')
14
     p(v-if='question.response_key_prompt == "image"')
14
     p(v-if='question.response_key_prompt == "image"')
15
         p Please Upload a Profile Image:
15
         p Please Upload a Profile Image:
16
         button(@click='submitImage') Upload Image
16
         button(@click='submitImage') Upload Image

+ 9
- 9
frontend/src/views/OnboardingView.vue Wyświetl plik

4
         style='display: flex; flex-direction: column; align-items: center'
4
         style='display: flex; flex-direction: column; align-items: center'
5
         v-if='survey'
5
         v-if='survey'
6
     )
6
     )
7
-        p(v-if='currentStep != 0 && answered.name') You have completed: {{ currentStep - 1 }} / 7 survey steps
8
-        p(v-for='(value, key) in answered')
9
-            span(v-if='key == "name"') Welcome {{ value }}!
10
-            span(v-if='key == "email"') All messages we will send to: {{ value }}
11
-            span(v-if='key == "zipcode"') Your zipcode is: {{ value }}
12
-            span(v-if='key == "blurb"') This is your Origin Story:
7
+        p(v-if='currentStep != 0') You have completed: {{ currentStep - 1 }} / 7 survey steps
8
+        .questions(v-for='(value, key) in answered')
9
+            span(v-if='key == "name" && value') Welcome {{ value }}!
10
+            span(v-if='key == "email" && value') All messages we will send to: {{ value }}
11
+            span(v-if='key == "zipcode" && value') Your zipcode is: {{ value }}
12
+            span(v-if='key == "blurb" && value') This is your Origin Story:
13
                 p {{ value }}
13
                 p {{ value }}
14
-            p(v-if='key == "image"') You've uploaded the following image:
14
+            p(v-if='key == "image" && value') You've uploaded the following image:
15
                 p {{ value }}
15
                 p {{ value }}
16
         .step(v-for='(step, i) in survey.steps')
16
         .step(v-for='(step, i) in survey.steps')
17
             component(
17
             component(
23
                 v-if='step && currentStep == i'
23
                 v-if='step && currentStep == i'
24
             )
24
             )
25
     article(
25
     article(
26
-            style='display: flex; flex-direction: column; align-items: center'
27
-            v-else
26
+        style='display: flex; flex-direction: column; align-items: center'
27
+        v-else
28
     )
28
     )
29
         h1(style='text-align: center') Thank you for completing Siimee's Onboarding Survey!
29
         h1(style='text-align: center') Thank you for completing Siimee's Onboarding Survey!
30
 </template>
30
 </template>

Ładowanie…
Anuluj
Zapisz