|
@@ -1,11 +1,11 @@
|
|
|
<template lang="pug">
|
|
|
li.cart-item
|
|
|
- h3.item-name {{ getName() }}
|
|
|
- input.item-quantity(type='number' min='1' :value='quantity' v-model='quantity')
|
|
|
+ h3.item-name
|
|
|
+ input.item-quantity(type='number' min='1')
|
|
|
span.item-x x
|
|
|
- span.item-price {{ getPrice() }}
|
|
|
+ span.item-price
|
|
|
span.item-equals =
|
|
|
- span.item-subtotal {{ getSubTotal() }}
|
|
|
+ span.item-subtotal
|
|
|
.cart-item-options-wrapper
|
|
|
.cart-item-options
|
|
|
.cart-item-option(class='fa fa-plus')
|
|
@@ -16,40 +16,14 @@
|
|
|
<script>
|
|
|
export default {
|
|
|
props: {
|
|
|
- item: {
|
|
|
- type: Object,
|
|
|
- default: {
|
|
|
- displayName: '',
|
|
|
- price: 0,
|
|
|
- quantity: 0
|
|
|
- },
|
|
|
+ index: {
|
|
|
+ type: Number,
|
|
|
+ default: -1,
|
|
|
required: true
|
|
|
- }
|
|
|
- },
|
|
|
- computed: {
|
|
|
- quantity: {
|
|
|
- get() {
|
|
|
- return this.item.quantity
|
|
|
- },
|
|
|
- set(value) {
|
|
|
- this.item.quantity = parseFloat(value) || 1
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- watch: {
|
|
|
- item(value) {
|
|
|
- console.log(value)
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- getName() {
|
|
|
- return this.item.displayName || 'No name'
|
|
|
- },
|
|
|
- getPrice() {
|
|
|
- return this.item.price || 0
|
|
|
},
|
|
|
- getSubTotal() {
|
|
|
- return this.getPrice() * (this.quantity || 0)
|
|
|
+ item: {
|
|
|
+ type: Object,
|
|
|
+ default: null
|
|
|
}
|
|
|
}
|
|
|
}
|