2
0
mirror of https://github.com/frappe/books.git synced 2024-11-13 00:46:28 +00:00

fix: Show loading state in AutoComplete

This commit is contained in:
Faris Ansari 2020-02-03 23:06:41 +05:30
parent ce864c5d0c
commit 75a7e1d58d

View File

@ -1,5 +1,5 @@
<template> <template>
<Dropdown :items="suggestions"> <Dropdown :items="suggestions" :is-loading="isLoading">
<template <template
v-slot="{ v-slot="{
toggleDropdown, toggleDropdown,
@ -32,7 +32,6 @@
</template> </template>
<script> <script>
import frappe from 'frappejs';
import Base from './Base'; import Base from './Base';
import Dropdown from '@/components/Dropdown'; import Dropdown from '@/components/Dropdown';
@ -46,6 +45,7 @@ export default {
return { return {
linkValue: '', linkValue: '',
showDropdown: false, showDropdown: false,
isLoading: false,
suggestions: [], suggestions: [],
highlightedIndex: -1 highlightedIndex: -1
}; };
@ -66,6 +66,7 @@ export default {
keyword = e.target.value; keyword = e.target.value;
this.linkValue = keyword; this.linkValue = keyword;
} }
this.isLoading = true;
let suggestions = await this.getSuggestions(keyword); let suggestions = await this.getSuggestions(keyword);
this.suggestions = suggestions.map(d => { this.suggestions = suggestions.map(d => {
if (!d.action) { if (!d.action) {
@ -73,10 +74,15 @@ export default {
} }
return d; return d;
}); });
this.isLoading = false;
}, },
async getSuggestions(keyword = '') { async getSuggestions(keyword = '') {
keyword = keyword.toLowerCase(); keyword = keyword.toLowerCase();
let list = this.df.getList ? this.df.getList() : this.df.options || [];
let list = this.df.getList
? await this.df.getList()
: this.df.options || [];
let items = list.map(d => { let items = list.map(d => {
if (typeof d === 'string') { if (typeof d === 'string') {
return { return {