branch bow-v2-go updated (e467561 -> 953d790)
This is an automated email from the git hooks/post-receive script. New change to branch bow-v2-go in repository bow. See https://gitlab.nuiton.org/chorem/bow.git from e467561 ajout dans le menu le lien vers les stats new 953d790 creation d'un composant pour encapsuler l'input des tags The 1 revisions listed above as "new" are entirely new to this repository and will be described in separate emails. The revisions listed as "adds" were already present in the repository and have only been added to this reference. Detailed log of new commits: commit 953d790d9cb8fac60989b4229de348a9e3d7290a Author: Benjamin <poussin@codelutin.com> Date: Tue May 19 23:11:06 2020 +0200 creation d'un composant pour encapsuler l'input des tags Summary of changes: web/src/components/common/TagsInput.vue | 84 ++++++++++++++++++++++++++ web/src/components/preferences/TagsEditor.vue | 85 +++------------------------ web/src/views/BookmarkEdit.vue | 5 +- 3 files changed, 96 insertions(+), 78 deletions(-) create mode 100644 web/src/components/common/TagsInput.vue -- To stop receiving notification emails like this one, please contact chorem.org SCM administrator <admin+scm@chorem.org>.
This is an automated email from the git hooks/post-receive script. New commit to branch bow-v2-go in repository bow. See https://gitlab.nuiton.org/chorem/bow.git commit 953d790d9cb8fac60989b4229de348a9e3d7290a Author: Benjamin <poussin@codelutin.com> Date: Tue May 19 23:11:06 2020 +0200 creation d'un composant pour encapsuler l'input des tags --- web/src/components/common/TagsInput.vue | 84 ++++++++++++++++++++++++++ web/src/components/preferences/TagsEditor.vue | 85 +++------------------------ web/src/views/BookmarkEdit.vue | 5 +- 3 files changed, 96 insertions(+), 78 deletions(-) diff --git a/web/src/components/common/TagsInput.vue b/web/src/components/common/TagsInput.vue new file mode 100644 index 0000000..a904468 --- /dev/null +++ b/web/src/components/common/TagsInput.vue @@ -0,0 +1,84 @@ +/* +props: + noCreation: n'autorise pas la création de nouveau élément (default: false; création autorisée) + limit: le nombre maximum délément autorisé (default: pas de limite) + displayCount: affiche on non le nombre d'occurence du tag (default: false; par d'affichage) + selected: le tableau contenant le résultat de l'édition (contient les tags) +*/ +<template> + <vue-tags-input + id="oldTags" + v-model="currentTag" + :tags="selectedTags" + @tags-changed="onChange" + :add-only-from-autocomplete="noCreation" + :max-tags="limit" + :autocomplete-items="filteredTags" + :add-on-key="key" + :save-on-key="key" + > + <template v-if="displayCount" #tag-right="{ tag }"> ({{ tag.count }}) </template> + </vue-tags-input> +</template> + +<script> +import { Component, Prop, Vue } from 'vue-property-decorator' +import VueTagsInput from '@johmun/vue-tags-input' + +@Component({ + name: 'TagsInput', + props: ['noCreation', 'limit', 'displayCount', 'selected'], + components: { VueTagsInput } +}) +class TagsInput extends Vue { + @Prop noCreation + @Prop limit + @Prop displayCount + @Prop selected + + key = [13, ',', ';', ' ', '\t'] + + allTags = [] + + currentTag = '' + get selectedTags() { + return this.selected.map(text => {return {text}}) + } + + onChange(tags) { + // on remplace tous les elements par les nouveaux, pour que le tabeau original venant du parent soit aussi modifié + this.selected.splice.apply(this.selected, [0, Number.MAX_VALUE].concat(tags.map((t) => t.text))) + } + + get filteredTags() { + let lowerCased = this.currentTag.toLowerCase() + return this.allTags.filter((a) => { + return a.text.toLowerCase().indexOf(lowerCased) !== -1 + }) + } + + load() { + this.$fetch.get('/bookmarks/tags?with-count=true').then( + (tags) => { + console.log('ok', tags) + this.allTags = tags[0].map((text, i) => { + return { text, count: tags[1][i] } + }) + }, + (err) => { + console.log('ko', err) + this.errorMsg = err.cause + } + ) + } + + beforeMount() { + this.load() + console.log('xxxx', this.canCreate, this.limit, this.displayCount, this.selected) + } +} + +export default TagsInput +</script> + +<style scoped lang="less"></style> diff --git a/web/src/components/preferences/TagsEditor.vue b/web/src/components/preferences/TagsEditor.vue index 3199a4f..4a98184 100644 --- a/web/src/components/preferences/TagsEditor.vue +++ b/web/src/components/preferences/TagsEditor.vue @@ -1,32 +1,9 @@ <template> <div class="tags-editor"> - <label for="oldTags">Replace</label - ><vue-tags-input - id="oldTags" - v-model="oldName" - :tags="oldTags" - @tags-changed="(t) => (oldTags = t)" - :add-only-from-autocomplete="true" - :max-tags="1" - :autocomplete-items="filteredOldTags" - :add-on-key="key" - :save-on-key="key" - > - <template #tag-right="{ tag }"> - ({{ tag.count }}) - </template> - </vue-tags-input> - <label for="newTags">with</label - ><vue-tags-input - id="newTags" - v-model="newName" - :tags="newTags" - @tags-changed="(t) => (newTags = t)" - :max-tags="1" - :autocomplete-items="filteredNewTags" - :add-on-key="key" - :save-on-key="key" - /> + <label for="oldTags">Replace</label> + <TagsInput id="oldTags" :selected="oldTags" :noCreation="true" :limit="1" :displayCount="true"></TagsInput> + <label for="newTags">with</label> + <TagsInput id="oldTags" :selected="newTags" :limit="1"></TagsInput> <button class="replace" @click.prevent="doAction">replace</button> <span class="errorMsg">{{ errorMsg }}</span> </div> @@ -34,40 +11,18 @@ <script> import { Component, Vue } from 'vue-property-decorator' -import VueTagsInput from '@johmun/vue-tags-input' +import TagsInput from '@/components/common/TagsInput' @Component({ name: 'TagsEditor', - components: { VueTagsInput } + components: { TagsInput } }) class TagsEditor extends Vue { errorMsg = '' - key = [13, ',', ';', ' ', '\t'] - - tags = [] - - oldName = '' oldTags = [] - newName = '' newTags = [] - get filteredOldTags() { - return this.filteredTags(this.oldName) - } - - get filteredNewTags() { - return this.filteredTags(this.newName) - } - - filteredTags(tag) { - let lowerCased = tag.toLowerCase() - console.log('XXXXX', tag, lowerCased) - return this.tags.filter((a) => { - return a.text.toLowerCase().indexOf(lowerCased) !== -1 - }) - } - doAction() { if (this.newTags[0]) { this.doReplace() @@ -77,13 +32,11 @@ class TagsEditor extends Vue { } doReplace() { - let oldName = this.oldTags[0].text - let newName = this.newTags[0].text + let oldName = this.oldTags[0] + let newName = this.newTags[0] this.$fetch.put(`/bookmarks/tags/${oldName}/${newName}`).then( (data) => { this.errorMsg = `renamed ${oldName}(${data.count}) -> ${newName}` - this.oldName = '' - this.newName = '' this.oldTags = [] this.newTags = [] // on recharge pour avoir le nouveau tag et le bon count @@ -97,12 +50,10 @@ class TagsEditor extends Vue { } doDelete() { - let oldName = this.oldTags[0].text + let oldName = this.oldTags[0] this.$fetch.delete(`/bookmarks/tags/${oldName}`).then( (data) => { this.errorMsg = `deleted ${oldName}(${data.count})` - this.oldName = '' - this.newName = '' this.oldTags = [] this.newTags = [] // on recharge pour avoir le bon count @@ -115,24 +66,6 @@ class TagsEditor extends Vue { ) } - load() { - this.$fetch.get('/bookmarks/tags?with-count=true').then( - (tags) => { - console.log('ok', tags) - this.tags = tags[0].map((text, i) => { - return {text, count: tags[1][i]} - }) - }, - (err) => { - console.log('ko', err) - this.errorMsg = err.cause - } - ) - } - - beforeMount() { - this.load() - } } export default TagsEditor diff --git a/web/src/views/BookmarkEdit.vue b/web/src/views/BookmarkEdit.vue index cfdca4e..f1271ba 100644 --- a/web/src/views/BookmarkEdit.vue +++ b/web/src/views/BookmarkEdit.vue @@ -6,7 +6,7 @@ <input type="text" v-model.trim="bookmark.uri" /> <br /> <!-- <span>{{ bookmark.authenticationinfo }}</span> faire afficher une popup de modification de l'objet auth--> <textarea v-model.trim="bookmark.description"></textarea> - tags: <input type="text" v-model.trim="bookmark.tags" /> <br /> + tags: <TagsInput :selected="bookmark.tags"></TagsInput> <!-- <input type="text" v-model.trim="bookmark.tags" /> <br /> --> <!-- <span>{{ bookmark.lang }}</span> --> <!-- <span>{{ bookmark.owner }}</span> si mon id n'est pas le meme alors c'est le bookmark d'un autre partage par un group --> private alias: <input type="text" v-model.trim="bookmark.privatealias" /> @@ -21,6 +21,7 @@ <script> import { Component, Prop, Vue } from 'vue-property-decorator' +import TagsInput from '@/components/common/TagsInput' @Component({ name: 'BookmarkEdit', @@ -33,7 +34,7 @@ import { Component, Prop, Vue } from 'vue-property-decorator' 'publicalias', 'lang' ], - components: {} + components: {TagsInput} }) class BookmarkEdit extends Vue { @Prop id -- To stop receiving notification emails like this one, please contact chorem.org SCM administrator <admin+scm@chorem.org>.
participants (1)
-
chorem.org scm