begining purchase summar.

tienda_ilusion/don_confiao/frontend/don-confiao/src/components/SummaryPurchase.vue

@@ -1,17 +1,70 @@
 <template>
-  <v-app>
-    <v-navigation-drawer app>
-    </v-navigation-drawer>
-    <v-app-bar>
-      Resumen de la compra
-    </v-app-bar>
-    <v-container>
-      Pon aqui la información de la compra
-    </v-container>
-  </v-app>
+  <v-container>
+    <v-toolbar>
+      <v-toolbar-title> Resumen de la compra </v-toolbar-title>
+    </v-toolbar>
+    <v-list>
+      <v-list-item>
+        <v-list-item-content>
+          <v-list-item-title>Fecha:</v-list-item-title>
+          <v-list-item-subtitle>{{ purchase.date }}</v-list-item-subtitle>
+        </v-list-item-content>
+      </v-list-item>
+      <v-list-item>
+        <v-list-item-content>
+          <v-list-item-title>Cliente:</v-list-item-title>
+          <v-list-item-subtitle>{{ purchase.customer }}</v-list-item-subtitle>
+        </v-list-item-content>
+      </v-list-item>
+      <v-list-item>
+        <v-list-item-content>
+          <v-list-item-title>Productos:</v-list-item-title>
+          <v-list-item-subtitle>{{ purchase.saleline_set }}</v-list-item-subtitle>
+        </v-list-item-content>
+      </v-list-item>
+    </v-list>
+
+  </v-container>
 </template>
 <script>
-
+  export default {
+    name: 'SummaryPurchase',
+    props: {
+      msg: String
+    },
+    data () {
+      return {
+        purchase: {},
+        customer: {},
+        lines: [],
+        products: []
+      };
+    },
+    created() {
+      this.fetchPurchase(1);
+    },
+    methods: {
+      fetchPurchase(purchaseId) {
+        let baseUrl = '/don_confiao/api';
+        fetch(`${baseUrl}/sales/${purchaseId}`)
+          .then(response => response.json())
+          .then(data => {
+            this.purchase = data;
+          })
+          .catch(error => {
+            console.error(error);
+          });
+        /* fetch(`${baseUrl}/customers/${this.purchase.customer}`)
+         *   .then(response => response.json())
+         *   .then(data => {
+         *     this.purchase = data;
+         *   })
+         *   .catch(error => {
+         *     console.error(error);
+         *   }); */
+      },
+    },
+  };
 </script>
 <style>