data section

src/view/PersonalData.vue

@@ -9,22 +9,8 @@
 <section class="col-10 col-sm-7 col-md-7 col-lg-7 col-xl-7 offset-1">
   <ShoppingNav currentStep=2></ShoppingNav>
 
-  <form class="mt-4">
-  <div class="form-group">
-    <label for="exampleInputEmail1">Email address</label>
-    <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
-    <small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small>
-  </div>
-  <div class="form-group">
-    <label for="exampleInputPassword1">Password</label>
-    <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
-  </div>
-  <div class="form-check">
-    <input type="checkbox" class="form-check-input" id="exampleCheck1">
-    <label class="form-check-label" for="exampleCheck1">Check me out</label>
-  </div>
-  <button type="submit" class="btn btn-primary">Submit</button>
-</form>
+  <DataSection></DataSection>
+
 
 </section>
 
@@ -32,6 +18,7 @@
   <h3 class="text-center">status</h3>
 </aside>
 
+
 </div>
 
 </div>
@@ -44,13 +31,14 @@
 import Header from '../components/Header'
 import Footer from '../components/Footer'
 import ShoppingNav from '../components/ShoppingNav'
-
+import DataSection from '../components/dataSection'
 
 export default {
 components: {
         Header,
         Footer,
-        ShoppingNav
+        ShoppingNav,
+        DataSection
     }
 }
 </script>