Files
habitica/website/client/components/inventory/item.vue
negue fcea1ecbc2 [WIP] multiplefixes for items / equipment / stable (#8938)
* highlight egg on dragging a potion - hide popover while dragging - flat show more button

* Show EquipGearModal on Item-Click - misc fixes

* disable dragging

* hide egg notes while dragging

* rename headgear to helm

* sort equipment by name & attributes

* set welcome-dialog flag

* show feeding notification

* select animals on click

* add hatchable popover back

* fix stable sortby A-Z

* remove property brackets
2017-08-13 18:18:46 +02:00

74 lines
1.5 KiB
Vue

<template lang="pug">
div(v-if="emptyItem")
.item-wrapper
.item.item-empty
.item-content
span.item-label(v-if="label") {{ label }}
b-popover(
v-else-if="showPopover",
:triggers="['hover']",
:placement="popoverPosition",
)
span(slot="content")
slot(name="popoverContent", :item="item")
.item-wrapper(@click="click")
.item(:class="{'item-active': active, 'highlight-border':highlightBorder }")
slot(name="itemBadge", :item="item")
span.item-content(
:class="itemContentClass"
)
span.item-label(v-if="label") {{ label }}
.item-wrapper(@click="click", v-else)
.item(:class="{'item-active': active, 'highlight-border':highlightBorder }")
slot(name="itemBadge", :item="item")
span.item-content(
:class="itemContentClass"
)
span.item-label(v-if="label") {{ label }}
</template>
<script>
import bPopover from 'bootstrap-vue/lib/components/popover';
export default {
components: {
bPopover,
},
props: {
item: {
type: Object,
},
itemContentClass: {
type: String,
},
label: {
type: String,
},
emptyItem: {
type: Boolean,
default: false,
},
popoverPosition: {
type: String,
default: 'bottom',
},
showPopover: {
type: Boolean,
default: true,
},
active: {
type: Boolean,
},
highlightBorder: {
type: Boolean,
},
},
methods: {
click () {
this.$emit('click', this.item);
},
},
};
</script>