Adds placeholder and smaller icons to relationship auto-complete. Adds placeholder image when thumbnail not available in relationship autocomplete.
This commit is contained in:
parent
dca744ef0c
commit
a8eb5c1e31
|
@ -346,6 +346,7 @@ return apply_filters( 'tainacan-admin-i18n', [
|
||||||
'info_updated_at' => __( 'Updated at', 'tainacan' ),
|
'info_updated_at' => __( 'Updated at', 'tainacan' ),
|
||||||
'info_editing_metadata_values' => __( 'Editing metadata values...', 'tainacan' ),
|
'info_editing_metadata_values' => __( 'Editing metadata values...', 'tainacan' ),
|
||||||
'info_updating_metadata_values' => __( 'Updating metadata values...', 'tainacan' ),
|
'info_updating_metadata_values' => __( 'Updating metadata values...', 'tainacan' ),
|
||||||
|
'info_type_to_search' => __( 'Type to search...', 'tainacan' ),
|
||||||
|
|
||||||
// Tainacan Metadatum Types
|
// Tainacan Metadatum Types
|
||||||
'tainacan-text' => __( 'Text', 'tainacan' ),
|
'tainacan-text' => __( 'Text', 'tainacan' ),
|
||||||
|
|
|
@ -6,17 +6,19 @@
|
||||||
:id="id"
|
:id="id"
|
||||||
v-model="selected"
|
v-model="selected"
|
||||||
:data="options"
|
:data="options"
|
||||||
|
expanded
|
||||||
@input="search"
|
@input="search"
|
||||||
:loading="isLoading"
|
:loading="isLoading"
|
||||||
field="label"
|
field="label"
|
||||||
@select="option => setResults(option) ">
|
@select="option => setResults(option) "
|
||||||
|
:placeholder="$i18n.get('info_type_to_search')">
|
||||||
<template slot-scope="props">
|
<template slot-scope="props">
|
||||||
<div class="media">
|
<div class="media">
|
||||||
<div
|
<div
|
||||||
class="media-left"
|
class="media-left"
|
||||||
v-if="props.option.img">
|
v-if="props.option.img">
|
||||||
<img
|
<img
|
||||||
width="32"
|
width="24"
|
||||||
:src="`${props.option.img}`">
|
:src="`${props.option.img}`">
|
||||||
</div>
|
</div>
|
||||||
<div class="media-content">
|
<div class="media-content">
|
||||||
|
|
|
@ -1,6 +1,11 @@
|
||||||
import { tainacan as axios } from '../../js/axios/axios';
|
import { tainacan as axios } from '../../js/axios/axios';
|
||||||
|
|
||||||
export const filter_type_mixin = {
|
export const filter_type_mixin = {
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
thumbPlaceholderPath: tainacan_plugin.base_url + '/admin/images/placeholder_square.png'
|
||||||
|
}
|
||||||
|
},
|
||||||
props: {
|
props: {
|
||||||
filter: {
|
filter: {
|
||||||
type: Object // concentrate all attributes metadatum id and type
|
type: Object // concentrate all attributes metadatum id and type
|
||||||
|
@ -51,7 +56,7 @@ export const filter_type_mixin = {
|
||||||
.then(res => {
|
.then(res => {
|
||||||
if (res.data.length > 0) {
|
if (res.data.length > 0) {
|
||||||
for (let item of res.data) {
|
for (let item of res.data) {
|
||||||
this.options.push({label: item.title, value: item.id, img: item.thumbnail.thumb });
|
this.options.push({label: item.title, value: item.id, img: ( item.thumbnail.thumb ? item.thumbnail.thumb : this.thumbPlaceholderPath ) });
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
Loading…
Reference in New Issue