diff options
Diffstat (limited to 'src/components/Settings/SettingsAddressbookShare.vue.orig')
| -rw-r--r-- | src/components/Settings/SettingsAddressbookShare.vue.orig | 173 |
1 files changed, 173 insertions, 0 deletions
diff --git a/src/components/Settings/SettingsAddressbookShare.vue.orig b/src/components/Settings/SettingsAddressbookShare.vue.orig new file mode 100644 index 00000000..1fea4a72 --- /dev/null +++ b/src/components/Settings/SettingsAddressbookShare.vue.orig @@ -0,0 +1,173 @@ +<!-- + - @copyright Copyright (c) 2018 Team Popcorn <teampopcornberlin@gmail.com> + - + - @author Team Popcorn <teampopcornberlin@gmail.com> + - + - @license GNU AGPL version 3 or any later version + - + - This program is free software: you can redistribute it and/or modify + - it under the terms of the GNU Affero General Public License as + - published by the Free Software Foundation, either version 3 of the + - License, or (at your option) any later version. + - + - This program is distributed in the hope that it will be useful, + - but WITHOUT ANY WARRANTY; without even the implied warranty of + - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + - GNU Affero General Public License for more details. + - + - You should have received a copy of the GNU Affero General Public License + - along with this program. If not, see <http://www.gnu.org/licenses/>. + - +--> + +<template> + <div class="addressbook-shares"> + <multiselect + id="users-groups-search" + :options="usersOrGroups" + :searchable="true" + :loading="isLoading" + :internal-search="false" + :options-limit="250" + :limit="3" + :max-height="600" + :show-no-results="false" + :placeholder="placeholder" + track-by="match" + label="match" + open-direction="bottom" + class="multiselect-vue" + @search-change="asyncFind" + @input="shareAddressbook"> + <template slot="singleLabel" slot-scope="props"><span class="option__desc"><span class="option__title">{{ props.option.matchpattern }}</span></span></template> + <template slot="option" slot-scope="props"> + <div class="option__desc"> + <span>{{ props.option.matchstart }}</span><span class="shareematch--bold">{{ props.option.matchpattern }}</span><span>{{ props.option.matchend }} {{ props.option.matchtag }}</span> + </div> + </template> + <span slot="noResult">{{ noResult }} </span> + </multiselect> + <!-- list of user or groups addressbook is shared with --> + <ul v-if="addressbook.shares.length > 0" class="addressbook__shares__list"> + <address-book-sharee v-for="sharee in addressbook.shares" :key="sharee.displayname + sharee.group" :sharee="sharee" /> + </ul> + </div> +</template> + +<script> +import clickOutside from 'vue-click-outside' +import api from '../../services/api' +import Multiselect from 'vue-multiselect' +<<<<<<< HEAD +import addressbookSharee from './SettingsAddressbookSharee' + +import clickOutside from 'vue-click-outside' + +import api from '../../services/api' + +======= +import addressBookSharee from './SettingsAddressbookSharee' +>>>>>>> added id to sharees and used this to look for existing shares, however there is still some error in the code that does not effectively implement the filter function. Added debounce package and function. +export default { + name: 'SettingsShareAddressbook', + components: { + clickOutside, + Multiselect, + addressBookSharee + }, + directives: { + clickOutside + }, + props: { + addressbook: { + type: Object, + default() { + return {} + } + } + }, + data() { + return { + isLoading: false, + usersOrGroups: [] + } + }, + computed: { + placeholder() { + return t('contacts', 'Share with users or groups') + }, + noResult() { + return t('contacts', 'Oops! No elements found. Consider changing the search query.') + } + }, + methods: { + /** + * Share addressbook + * + * @param {Object} chosenUserOrGroup + */ + shareAddressbook({ sharee, id, group }) { + let addressbook = this.addressbook + this.$store.dispatch('shareAddressbook', { addressbook, sharee, id, group }) + }, + /** + * Format responses from axios.all and add them to the option array + * + * @param {Array} matches Array of matches returned from the axios request + * @param {String} query + * @param {Boolean} group + */ + formatMatchResults(matches, query, group) { + if (matches.length < 1) { + return + } + let regex = new RegExp(query, 'i') + let existingSharees = this.addressbook.shares.map(share => share.id + share.group) + matches.filter(share => existingSharees.indexOf(share.id + group) === -1) + for (let i = 0; i < matches.length; i++) { + let matchResult = matches[i].displayname.split(regex) + let newMatch = { + sharee: matches[i].displayname, + id: matches[i].id, + matchstart: matchResult[0], + matchpattern: matches[i].displayname.match(regex)[0], + matchend: matchResult[1], + matchtag: group ? '(group)' : '(user)', + group: group + } + this.usersOrGroups.push(newMatch) + } + }, + /** + * Use Axios api call to find matches to the query from the existing Users & Groups + * + * @param {String} query + */ + asyncFind(query) { + this.isLoading = true + this.usersOrGroups = [] + if (query.length > 0) { + api.all([ + api.get(OC.linkToOCS('cloud', 2) + 'users/details?search=' + query), + api.get(OC.linkToOCS('cloud', 2) + 'groups/details?search=' + query) + ]).then(response => { + let matchingUsers = Object.values(response[0].data.ocs.data.users) + let matchingGroups = response[1].data.ocs.data.groups + try { + this.formatMatchResults(matchingUsers, query, false) + } catch (error) { + console.debug(error) + } + try { + this.formatMatchResults(matchingGroups, query, true) + } catch (error) { + console.debug(error) + } + }).then(() => { + this.isLoading = false + }) + } + } + } +} +</script> |