pull/1021/head
Yiğit FINDIKLI 2021-02-18 11:42:56 +03:00
commit 0253a4ac3d
2 changed files with 49 additions and 39 deletions

View File

@ -2,15 +2,15 @@
"data": [ "data": [
{ {
"id": "1000", "id": "1000",
"code": "f230fh0g3", "code": "vbb124btr",
"name": "Bamboo Watch", "name": "Game Controller",
"description": "Product Description", "description": "Product Description",
"image": "bamboo-watch.jpg", "image": "game-controller.jpg",
"price": 65, "price": 99,
"category": "Accessories", "category": "Electronics",
"quantity": 24, "quantity": 2,
"inventoryStatus": "INSTOCK", "inventoryStatus": "LOWSTOCK",
"rating": 5 "rating": 4
}, },
{ {
"id": "1001", "id": "1001",
@ -62,15 +62,15 @@
}, },
{ {
"id": "1005", "id": "1005",
"code": "av2231fwg", "code": "cm230f032",
"name": "Brown Purse", "name": "Gaming Set",
"description": "Product Description", "description": "Product Description",
"image": "brown-purse.jpg", "image": "gaming-set.jpg",
"price": 120, "price": 299,
"category": "Accessories", "category": "Electronics",
"quantity": 0, "quantity": 63,
"inventoryStatus": "OUTOFSTOCK", "inventoryStatus": "INSTOCK",
"rating": 4 "rating": 3
}, },
{ {
"id": "1006", "id": "1006",
@ -98,27 +98,27 @@
}, },
{ {
"id": "1008", "id": "1008",
"code": "vbb124btr", "code": "f230fh0g3",
"name": "Game Controller", "name": "Bamboo Watch",
"description": "Product Description", "description": "Product Description",
"image": "game-controller.jpg", "image": "bamboo-watch.jpg",
"price": 99, "price": 65,
"category": "Electronics", "category": "Accessories",
"quantity": 2, "quantity": 24,
"inventoryStatus": "LOWSTOCK", "inventoryStatus": "INSTOCK",
"rating": 4 "rating": 5
}, },
{ {
"id": "1009", "id": "1009",
"code": "cm230f032", "code": "av2231fwg",
"name": "Gaming Set", "name": "Brown Purse",
"description": "Product Description", "description": "Product Description",
"image": "gaming-set.jpg", "image": "brown-purse.jpg",
"price": 299, "price": 120,
"category": "Electronics", "category": "Accessories",
"quantity": 63, "quantity": 0,
"inventoryStatus": "INSTOCK", "inventoryStatus": "OUTOFSTOCK",
"rating": 3 "rating": 4
} }
] ]
} }

View File

@ -25,11 +25,11 @@
</template> </template>
<template v-else> <template v-else>
<template v-for="(optionGroup, i) of suggestions" :key="getOptionGroupRenderKey(optionGroup)"> <template v-for="(optionGroup, i) of suggestions" :key="getOptionGroupRenderKey(optionGroup)">
<li class="p-autocomplete-item-group" > <li class="p-autocomplete-item-group">
<slot name="optiongroup" :item="optionGroup" :index="i">{{getOptionGroupLabel(optionGroup)}}</slot> <slot name="optiongroup" :item="optionGroup" :index="i">{{getOptionGroupLabel(optionGroup)}}</slot>
</li> </li>
<li v-for="(item, i) of getOptionGroupChildren(optionGroup)" class="p-autocomplete-item" :key="i" @click="selectItem($event, item)" role="option" v-ripple> <li v-for="(item, j) of getOptionGroupChildren(optionGroup)" class="p-autocomplete-item" :key="j" @click="selectItem($event, item)" role="option" v-ripple :data-group="i" :data-index="j">
<slot name="item" :item="item" :index="i">{{getItemContent(item)}}</slot> <slot name="item" :item="item" :index="j">{{getItemContent(item)}}</slot>
</li> </li>
</template> </template>
</template> </template>
@ -110,7 +110,8 @@ export default {
searching: false, searching: false,
focused: false, focused: false,
overlayVisible: false, overlayVisible: false,
inputTextValue: null inputTextValue: null,
highlightItem: null
}; };
}, },
watch: { watch: {
@ -385,10 +386,10 @@ export default {
event.preventDefault(); event.preventDefault();
break; break;
//enter,tab //enter
case 13: case 13:
if (highlightItem) { if (highlightItem) {
this.selectItem(event, this.suggestions[DomHandler.index(highlightItem)]); this.selectHighlightItem(event, highlightItem);
this.hideOverlay(); this.hideOverlay();
} }
@ -404,7 +405,7 @@ export default {
//tab //tab
case 9: case 9:
if (highlightItem) { if (highlightItem) {
this.selectItem(event, this.suggestions[DomHandler.index(highlightItem)]); this.selectHighlightItem(event, highlightItem);
} }
this.hideOverlay(); this.hideOverlay();
@ -436,6 +437,15 @@ export default {
} }
} }
}, },
selectHighlightItem(event, item) {
if (this.optionGroupLabel) {
let optionGroup = this.suggestions[item.dataset.group];
this.selectItem(event, this.getOptionGroupChildren(optionGroup)[item.dataset.index]);
}
else {
this.selectItem(event, this.suggestions[DomHandler.indexOfType(item)]);
}
},
findNextItem(item) { findNextItem(item) {
let nextItem = item.nextElementSibling; let nextItem = item.nextElementSibling;