This is an automated email from the ASF dual-hosted git repository. machristie pushed a commit to branch master in repository https://gitbox.apache.org/repos/asf/airavata-django-portal.git
commit 56dd8449c3ee35c9ad9c92fb338f998a809101aa Author: Marcus Christie <[email protected]> AuthorDate: Wed Sep 19 21:34:43 2018 -0400 Fix display of search icon in ShareButton --- .../common/js/components/AutocompleteTextInput.vue | 106 ++++++++++----------- django_airavata/static/common/package-lock.json | 21 ++-- django_airavata/static/common/package.json | 2 +- 3 files changed, 65 insertions(+), 64 deletions(-) diff --git a/django_airavata/static/common/js/components/AutocompleteTextInput.vue b/django_airavata/static/common/js/components/AutocompleteTextInput.vue index b44fcd4..6caf16b 100644 --- a/django_airavata/static/common/js/components/AutocompleteTextInput.vue +++ b/django_airavata/static/common/js/components/AutocompleteTextInput.vue @@ -1,104 +1,98 @@ <template> - <div class="autocomplete-text-input"> - <b-input-group> - <b-input-group-addon> - <i class="fa fa-search"></i> - </b-input-group-addon> - <b-form-input type="text" :value="searchValue" placeholder="Type to get suggestions..." - @input="updateSearchValue" - @keydown.native.enter = 'enter' - @keydown.native.down = 'down' - @keydown.native.up = 'up' - ></b-form-input> - </b-input-group> - <b-list-group class="autocomplete-suggestion-list" v-if="open"> - <b-list-group-item v-for="(suggestion, index) in filtered.slice(0,5)" - v-bind:class="{'active': isActive(index)}" - href="#" @click="suggestionClick(index)" v-bind:key="suggestion.id"> - <slot name="suggestion" :suggestion="suggestion"> - {{ suggestion.name }} - </slot> - </b-list-group-item> - </b-list-group> - </div> + <div class="autocomplete-text-input"> + <b-input-group> + <b-input-group-text slot="prepend"> + <i class="fa fa-search"></i> + </b-input-group-text> + <b-form-input type="text" :value="searchValue" placeholder="Type to get suggestions..." @input="updateSearchValue" @keydown.native.enter='enter' + @keydown.native.down='down' @keydown.native.up='up'></b-form-input> + </b-input-group> + <b-list-group class="autocomplete-suggestion-list" v-if="open"> + <b-list-group-item v-for="(suggestion, index) in filtered.slice(0,5)" v-bind:class="{'active': isActive(index)}" href="#" + @click="suggestionClick(index)" v-bind:key="suggestion.id"> + <slot name="suggestion" :suggestion="suggestion"> + {{ suggestion.name }} + </slot> + </b-list-group-item> + </b-list-group> + </div> </template> <script> - export default { - - name: 'autocomplete-text-input', + name: "autocomplete-text-input", props: { suggestions: { type: Array, required: true } }, - data () { + data() { return { open: false, current: 0, - searchValue: '', - } + searchValue: "" + }; }, computed: { - filtered () { - return this.suggestions.filter((data) => { + filtered() { + return this.suggestions.filter(data => { // Case insensitive search - return data.name.toLowerCase().indexOf(this.searchValue.toLowerCase()) >= 0 - }) - }, + return ( + data.name.toLowerCase().indexOf(this.searchValue.toLowerCase()) >= 0 + ); + }); + } }, methods: { - updateSearchValue (value) { + updateSearchValue(value) { if (this.open === false) { - this.open = true - this.current = 0 + this.open = true; + this.current = 0; } - if(value===''){ + if (value === "") { this.open = false; } this.searchValue = value; }, - enter () { + enter() { this.emitSelectedItem(this.current); - this.searchValue = ''; - this.open = false + this.searchValue = ""; + this.open = false; }, - up () { + up() { if (this.current > 0) { - this.current-- + this.current--; } }, - down () { + down() { if (this.current < this.filtered.length - 1) { - this.current++ + this.current++; } }, - isActive (index) { - return index === this.current + isActive(index) { + return index === this.current; }, - suggestionClick (index) { + suggestionClick(index) { this.emitSelectedItem(index); - this.searchValue = ''; + this.searchValue = ""; this.open = false; }, emitSelectedItem(index) { - this.$emit('selected', this.filtered[index]); + this.$emit("selected", this.filtered[index]); } - }, -} - + } +}; </script> <style scoped> .autocomplete-text-input { - position: relative; + position: relative; } .autocomplete-suggestion-list { - width: 100%; - position: absolute; - z-index: 1; + width: 100%; + position: absolute; + z-index: 1; } </style> diff --git a/django_airavata/static/common/package-lock.json b/django_airavata/static/common/package-lock.json index 52ec2ac..ecdc57f 100644 --- a/django_airavata/static/common/package-lock.json +++ b/django_airavata/static/common/package-lock.json @@ -1164,14 +1164,16 @@ "integrity": "sha512-rDFIzgXcof0jDyjNosjv4Sno77X4KuPeFxG2XZZv1/Kc8DRVGVADdoQyyOVDwPqL36DDmtCQbrpMCqvpPLJQ0w==" }, "bootstrap-vue": { - "version": "1.5.1", - "resolved": "https://registry.npmjs.org/bootstrap-vue/-/bootstrap-vue-1.5.1.tgz";, - "integrity": "sha512-bkob7vTHA5VZN6U0Wj34Yj+6jNtqAtc6MwcsLdBz78fcy8Ju5tlYUYMDUefQ0rQH7hhdtFDn9GuDiqhUPmE1sA==", + "version": "2.0.0-rc.11", + "resolved": "https://registry.npmjs.org/bootstrap-vue/-/bootstrap-vue-2.0.0-rc.11.tgz";, + "integrity": "sha512-LxR+oL8yKr1DVoWUWTX+XhiT0xaTMH6142u2VSFDm4tewTH8HIrzN2YIl7HLZrw2DIuE9bRMIdWJqqn3aQe7Hw==", "requires": { + "bootstrap": "^4.1.1", + "lodash.get": "^4.4.2", "lodash.startcase": "^4.4.0", "opencollective": "^1.0.3", "popper.js": "^1.12.9", - "vue-functional-data-merge": "^2.0.3" + "vue-functional-data-merge": "^2.0.5" } }, "brace-expansion": { @@ -4483,7 +4485,7 @@ }, "external-editor": { "version": "2.2.0", - "resolved": "https://registry.npmjs.org/external-editor/-/external-editor-2.2.0.tgz";, + "resolved": "http://registry.npmjs.org/external-editor/-/external-editor-2.2.0.tgz";, "integrity": "sha512-bSn6gvGxKt+b7+6TKEv1ZycHleA7aHhRHyAqJyp5pbUFuYYNIzpZnQDk7AsYckyWdEnTeAnay0aCy2aV6iTk9A==", "requires": { "chardet": "^0.4.0", @@ -6559,6 +6561,11 @@ "lodash._root": "^3.0.0" } }, + "lodash.get": { + "version": "4.4.2", + "resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz";, + "integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk=" + }, "lodash.memoize": { "version": "4.1.2", "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz";, @@ -6956,7 +6963,7 @@ }, "node-fetch": { "version": "1.6.3", - "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.6.3.tgz";, + "resolved": "http://registry.npmjs.org/node-fetch/-/node-fetch-1.6.3.tgz";, "integrity": "sha1-3CNO3WSJmC1Y6PDbT2lQKavNjAQ=", "requires": { "encoding": "^0.1.11", @@ -9555,7 +9562,7 @@ }, "through": { "version": "2.3.8", - "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz";, + "resolved": "http://registry.npmjs.org/through/-/through-2.3.8.tgz";, "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=" }, "thunky": { diff --git a/django_airavata/static/common/package.json b/django_airavata/static/common/package.json index 747d978..4e24c9c 100644 --- a/django_airavata/static/common/package.json +++ b/django_airavata/static/common/package.json @@ -14,7 +14,7 @@ "django-airavata-api": "file:../../apps/api", "vue": "^2.3.3", "bootstrap": "^4.0.0", - "bootstrap-vue": "^1.5.1" + "bootstrap-vue": "^2.0.0-rc.11" }, "devDependencies": { "babel-core": "^6.0.0",
