Fixes thumbnail on autocomplete for terms and relationship filter.

This commit is contained in:
Mateus Machado Luna 2019-10-31 16:21:18 -03:00
parent 4f814b12d3
commit 52c0f37152
5 changed files with 33 additions and 29 deletions

View File

@ -155,7 +155,18 @@
@focus="clearErrors('parent');"
:disabled="!hasParent">
<template slot-scope="props">
{{ props.option.name }}
<div class="media">
<div
v-if="props.option.header_image"
class="media-left">
<img
width="28"
:src="props.option.header_image">
</div>
<div class="media-content">
{{ props.option.name }}
</div>
</div>
</template>
<template slot="empty">{{ $i18n.get('info_no_parent_term_found') }}</template>
</b-autocomplete>

View File

@ -51,19 +51,22 @@
.is-small { color: $gray4; }
&.is-active { background-color: $turquoise2; }
.media-left {
margin-right: 0.5rem;
}
.media-content {
display: flex;
.media {
align-items: center;
width: 80%;
.media-left {
margin-right: 0.5rem;
}
.media-content {
display: flex;
width: 80%;
.ellipsed-text {
overflow-x: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-right: 3px;
.ellipsed-text {
overflow-x: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-right: 3px;
}
}
}
}

View File

@ -121,7 +121,7 @@ $subheader-height: 42px;
$side-menu-width: 160px;
$filter-menu-width: 16.666666667%;
$filter-menu-width-theme: 20.833333333%;
$page-height: calc(100% - 94px);
$page-height: calc(100vh - 94px);
// Overall Pages padding:
$page-side-padding: 4.166666667%;//82px;

View File

@ -20,7 +20,7 @@
<img
:alt="$i18n.get('label_thumbnail')"
width="24"
:src="`${props.option.img}`">
:src="props.option.img">
</div>
<div class="media-content">
<span class="ellipsed-text">{{ props.option.label }}</span>
@ -148,15 +148,4 @@
}
}
}
</script>
<style scoped>
#profileImage {
width: 32px;
height: 32px;
font-size: 2.1875rem;
color: #fff;
text-align: center;
line-height: 9.375rem;
margin: 20px 0;
}
</style>
</script>

View File

@ -276,13 +276,14 @@ export const dynamicFilterTypeMixin = {
sResults.push({
label: item.label,
value: item.value,
img: item.thumbnail && item.thumbnail['tainacan-small'] && item.thumbnail['tainacan-small'][0] ? item.thumbnail['tainacan-small'][0] : (item.img ? item.img : ''),
total_items: item.total_items
});
} else if (indexToIgnore < 0) {
opts.push({
label: item.label,
value: item.value,
img: (item.img ? item.img : this.thumbPlaceholderPath),
img: item.thumbnail && item.thumbnail['tainacan-small'] && item.thumbnail['tainacan-small'][0] ? item.thumbnail['tainacan-small'][0] : (item.img ? item.img : ''),
total_items: item.total_items
});
}
@ -291,14 +292,14 @@ export const dynamicFilterTypeMixin = {
sResults.push({
label: item.label,
value: item.value,
img: (item.img ? item.img : this.thumbPlaceholderPath),
img: item.thumbnail && item.thumbnail['tainacan-small'] && item.thumbnail['tainacan-small'][0] ? item.thumbnail['tainacan-small'][0] : (item.img ? item.img : ''),
total_items: item.total_items
});
} else {
opts.push({
label: item.label,
value: item.value,
img: (item.img ? item.img : this.thumbPlaceholderPath),
img: item.thumbnail && item.thumbnail['tainacan-small'] && item.thumbnail['tainacan-small'][0] ? item.thumbnail['tainacan-small'][0] : (item.img ? item.img : ''),
total_items: item.total_items
});
}