diff options
| author | Mateja <mail@matejamaric.com> | 2021-07-25 01:35:36 +0200 |
|---|---|---|
| committer | Mateja <mail@matejamaric.com> | 2021-07-25 01:35:36 +0200 |
| commit | a3614f5fdb7de39d88846a37b7ea7d816b7765cc (patch) | |
| tree | f9ebd23f28a2027dd29dfb5731fcb8dc141705d8 | |
| parent | 2e4678c40a7c92a981bf67845a2888893ea9b758 (diff) | |
| download | mevn-ecommerce-a3614f5fdb7de39d88846a37b7ea7d816b7765cc.tar.gz mevn-ecommerce-a3614f5fdb7de39d88846a37b7ea7d816b7765cc.zip | |
Show number of items that can be checked out.
| -rw-r--r-- | client/src/App.vue | 12 | ||||
| -rw-r--r-- | client/src/views/Checkout.vue | 1 |
2 files changed, 11 insertions, 2 deletions
diff --git a/client/src/App.vue b/client/src/App.vue index 3a66a9e..906716b 100644 --- a/client/src/App.vue +++ b/client/src/App.vue @@ -10,7 +10,10 @@ <router-link class="nav-link" active-class="active" to="/">Home</router-link> </li> <li class="nav-item"> - <router-link class="nav-link" active-class="active" to="/checkout">Checkout</router-link> + <router-link class="nav-link" active-class="active" to="/checkout"> + Checkout + <span class="badge bg-light rounded-pill text-dark" v-text="cartSize"></span> + </router-link> </li> <li class="nav-item"> <router-link class="nav-link" active-class="active" to="/register">Register</router-link> @@ -29,7 +32,12 @@ <script> export default { - + name: 'Checkout', + computed: { + cartSize() { + return this.$store.getters.getCartSize; + } + } } </script> diff --git a/client/src/views/Checkout.vue b/client/src/views/Checkout.vue index 891597e..83d0940 100644 --- a/client/src/views/Checkout.vue +++ b/client/src/views/Checkout.vue @@ -7,6 +7,7 @@ class="list-group-item d-flex justify-content-between align-items-start"> <div class="ms-2 me-auto"> <div class="fw-bold">{{ item.name }}</div> + <i>${{ item.price }}</i> </div> <span class="badge bg-primary rounded-pill">{{ item.quantity }}</span> </li> |