[IMP] searcher features

Cart.vue

@@ -4,7 +4,7 @@
             h2.currency-cart-total {{ total | currency(...defaultOptions.currency) }}
         .cart-items-wrapper
             transition-group(name='list' tag='ul' class='cart-items')
-                cart-item(v-for='(item, index) in items' :key='index' :index='index' :item='item' @onChange='onItemChanged' @onClickIncrement='onIncrementQty' @onClickDecrement='onDecrementQty' @onClickDelete='onDeleteItem' :options='defaultOptions.currency')
+                cart-item(v-for='(item, index) in items' :key='index' :index='index' :item='item' @onChange='onItemChanged' @onClickIncrement='onIncrementQty' @onClickDecrement='onDecrementQty' @onClickMoney='onChangePrice' @onClickDelete='onDeleteItem' :options='defaultOptions.currency')
 </template>
 
 <script>
@@ -59,6 +59,9 @@
             onDecrementQty(item) {
                 this.$emit('onDecrementQty', item)
             },
+            onChangePrice(item) {
+                this.$emit('onChangePrice', item)
+            },
             onDeleteItem(item) {
                 this.$emit('onDeleteItem', item)
             }

CartItem.vue

@@ -1,7 +1,7 @@
 <template lang="pug">
     li.cart-item
         h3.item-name {{ item.displayName }}
-        input.item-quantity(type='number' min='1' :value='item.quantity')
+        input.item-quantity(type='number' min='1' :value='item.quantity' readonly)
         span.item-x x
         span.item-price {{ item.price | currency(...options) }}
         span.item-equals =
@@ -10,6 +10,7 @@
             .cart-item-options
                 .cart-item-option(class='fa fa-plus' @click='onClickIncrement')
                 .cart-item-option(class='fa fa-minus' @click='onClickDecrement')
+                .cart-item-option(class="fa fa-money" @click='onClickMoney')
                 .cart-item-option(class='fa fa-trash' @click='onClickDelete')
 </template>
 
@@ -55,6 +56,9 @@
             onClickDecrement() {
                 this.$emit('onClickDecrement', this.item)
             },
+            onClickMoney() {
+                this.$emit('onClickMoney', this.item)
+            },
             onClickDelete() {
                 this.$emit('onClickDelete', this.item)
             }
@@ -126,7 +130,7 @@
             display: flex
             justify-content: center
             .cart-item-options
-                width: 90px
+                width: 100px
                 height: 20px
                 border: 1px solid #d3d3d3
                 border-bottom: none
@@ -146,6 +150,8 @@
                             color: #2196f3
                         &.fa-minus:hover
                             color: #ffc107
+                        &.fa-money:hover
+                            color: #4caf50
                         &.fa-trash:hover
                             color: #f44336
 </style>

Searcher.vue

@@ -52,10 +52,18 @@
                 type: Array,
                 default: [],
                 required: true
+            },
+            mode: {
+                type: String,
+                default: 'fuzzy'
             }
         },
         watch: {
             items(values) {
+                if (this.mode !== 'fuzzy') {
+                    return
+                }
+
                 this.fuse.setCollection(values)
             },
             search(value) {
@@ -78,7 +86,33 @@
                 })
             },
             performSearch(value) {
-                this.results = this.fuse.search(value)
+                if(!value) {
+                    this.results = []
+                    return
+                }
+
+                if (this.mode === 'fuzzy') {
+                    this.results = this.fuse.search(value)
+                } else {
+                    this.results = []
+
+                    for (let item of this.items) {
+                        for (let field in item) {
+                            if (typeof item[field] !== 'string') {
+                                continue
+                            }
+
+                            if (this.keys.length !== 0 && this.keys.indexOf(field) === -1) {
+                                continue
+                            }
+
+                            if (item[field].toLowerCase().indexOf(value.toLowerCase()) !== -1) {
+                                this.results.push(item)
+                                break
+                            }
+                        }
+                    }
+                }
             }
         },
         data() {
@@ -89,6 +123,10 @@
             }
         },
         mounted() {
+            if (this.mode !== 'fuzzy') {
+                return
+            }
+            
             this.initFuse()
         }
     }