Files
habitica/website/client/components/inventory/item.vue
Matteo Pagliazzi 9e1f7f3811 Client/Inventory/Items (#8734)
* client: start working on Inventory/Items

* i18n changes and fixes

* initial displaying of eggs, food and potions + sorting

* add missing files

* remove comment

* show food, eggs and potions

* add label to dropdowns acting as select menus

* popovers

* move badge to slot and component if necessary, general refactor

* fix quantity ordering

* some special items, reorganize
2017-05-22 16:30:52 +02:00

62 lines
1.1 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,
:triggers="['hover']",
:placement="popoverPosition",
@click="click",
)
span(slot="content")
slot(name="popoverContent", :item="item")
.item-wrapper
.item
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';
import { mapState } from 'client/libs/store';
export default {
components: {
bPopover,
},
props: {
item: {
type: Object,
},
itemContentClass: {
type: String,
},
label: {
type: String,
},
emptyItem: {
type: Boolean,
default: false,
},
popoverPosition: {
type: String,
default: 'bottom',
},
},
computed: {
...mapState({
ATTRIBUTES: 'constants.ATTRIBUTES',
}),
},
methods: {
click () {
this.$emit('click', this.item);
},
},
};
</script>