Fixes taginput selected behaviour for User and Relationsip inputs.
This commit is contained in:
parent
14f595fb07
commit
7c6d74f966
|
@ -11,7 +11,7 @@
|
||||||
:disabled="disabled"
|
:disabled="disabled"
|
||||||
size="is-small"
|
size="is-small"
|
||||||
icon="magnify"
|
icon="magnify"
|
||||||
:model-value="selected"
|
:model-value="JSON.parse(JSON.stringify(selected))"
|
||||||
:data="options"
|
:data="options"
|
||||||
:maxtags="maxtags != undefined ? maxtags : (itemMetadatum.metadatum.multiple == 'yes' || allowNew === true ? (maxMultipleValues !== undefined ? maxMultipleValues : null) : '1')"
|
:maxtags="maxtags != undefined ? maxtags : (itemMetadatum.metadatum.multiple == 'yes' || allowNew === true ? (maxMultipleValues !== undefined ? maxMultipleValues : null) : '1')"
|
||||||
autocomplete
|
autocomplete
|
||||||
|
@ -51,6 +51,9 @@
|
||||||
<div v-html="props.option.valuesAsHtml" />
|
<div v-html="props.option.valuesAsHtml" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
<template #tag="props">
|
||||||
|
{{ (props.tag && props.tag.label) ? props.tag.label : '' }}
|
||||||
|
</template>
|
||||||
<template
|
<template
|
||||||
v-if="!isLoading"
|
v-if="!isLoading"
|
||||||
#empty>
|
#empty>
|
||||||
|
|
|
@ -6,7 +6,7 @@
|
||||||
:disabled="disabled"
|
:disabled="disabled"
|
||||||
size="is-small"
|
size="is-small"
|
||||||
icon="account"
|
icon="account"
|
||||||
:model-value="selected"
|
:model-value="JSON.parse(JSON.stringify(selected))"
|
||||||
:data="options"
|
:data="options"
|
||||||
:maxtags="maxtags != undefined ? maxtags : (itemMetadatum.metadatum.multiple == 'yes' || allowNew === true ? (maxMultipleValues !== undefined ? maxMultipleValues : null) : '1')"
|
:maxtags="maxtags != undefined ? maxtags : (itemMetadatum.metadatum.multiple == 'yes' || allowNew === true ? (maxMultipleValues !== undefined ? maxMultipleValues : null) : '1')"
|
||||||
autocomplete
|
autocomplete
|
||||||
|
@ -30,17 +30,20 @@
|
||||||
<template #default="props">
|
<template #default="props">
|
||||||
<div class="media">
|
<div class="media">
|
||||||
<div
|
<div
|
||||||
v-if="props.option.avatar_urls && props.option.avatar_urls['24']"
|
v-if="props.option.img"
|
||||||
class="media-left">
|
class="media-left">
|
||||||
<img
|
<img
|
||||||
width="24"
|
width="24"
|
||||||
:src="props.option.avatar_urls['24']">
|
:src="props.option.img">
|
||||||
</div>
|
</div>
|
||||||
<div class="media-content">
|
<div class="media-content">
|
||||||
{{ props.option.name }}
|
{{ props.option.name }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
<template #tag="props">
|
||||||
|
{{ (props.tag && props.tag.name) ? props.tag.name : '' }}
|
||||||
|
</template>
|
||||||
<template
|
<template
|
||||||
v-if="!isLoading"
|
v-if="!isLoading"
|
||||||
#empty>
|
#empty>
|
||||||
|
@ -98,7 +101,7 @@ export default {
|
||||||
]),
|
]),
|
||||||
onInput(newSelected) {
|
onInput(newSelected) {
|
||||||
this.selected = newSelected;
|
this.selected = newSelected;
|
||||||
this.$emit('update:value', newSelected.map((user) => user.id || user.value));
|
this.$emit('update:value', this.selected.map((user) => user.id || user.value));
|
||||||
},
|
},
|
||||||
onBlur() {
|
onBlur() {
|
||||||
this.$emit('blur');
|
this.$emit('blur');
|
||||||
|
@ -109,17 +112,14 @@ export default {
|
||||||
this.isLoading = true;
|
this.isLoading = true;
|
||||||
let query = qs.stringify({ include: this.itemMetadatum.value });
|
let query = qs.stringify({ include: this.itemMetadatum.value });
|
||||||
let endpoint = '/users/';
|
let endpoint = '/users/';
|
||||||
|
|
||||||
wpApi.get(endpoint + '?' + query)
|
wpApi.get(endpoint + '?' + query)
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
for (let user of res.data) {
|
this.selected = res.data.map((user) => ({
|
||||||
this.selected.push({
|
name: user.name,
|
||||||
name: user.name,
|
value: user.id,
|
||||||
value: user.id,
|
img: user.avatar_urls && user.avatar_urls['24'] ? user.avatar_urls['24'] : ''
|
||||||
img: user.avatar_urls && user.avatar_urls['24'] ? user.avatar_urls['24'] : ''
|
}));
|
||||||
}) ;
|
|
||||||
}
|
|
||||||
|
|
||||||
this.isLoading = false;
|
this.isLoading = false;
|
||||||
})
|
})
|
||||||
.catch(() => this.isLoading = false );
|
.catch(() => this.isLoading = false );
|
||||||
|
|
Loading…
Reference in New Issue