Files
habitica/website/client/src/components/inventory/equipment/attributesPopover.vue
T
2019-10-12 17:05:15 +02:00

77 lines
1.4 KiB
Vue

<template>
<div>
<div v-if="item.locked">
<h4 class="popover-content-title">
{{ `${$t('lockedItem')}` }}
</h4>
<div
v-if="item.specialClass"
class="popover-content-text"
>
{{ `${$t('classLockedItem')}` }}
</div>
<div
v-else
class="popover-content-text"
>
{{ `${$t('tierLockedItem')}` }}
</div>
<p></p>
</div>
<div v-else>
<h4 class="popover-content-title">
{{ itemText }}
</h4>
<div class="popover-content-text">
{{ itemNotes }}
</div>
<attributesGrid
:user="user"
:item="item"
/>
</div>
</div>
</template>
<style scoped>
.popover-content-text {
margin-bottom: 25px;
}
</style>
<script>
import { mapState } from '@/libs/store';
import attributesGrid from './attributesGrid';
import statsMixin from '@/mixins/stats';
export default {
components: {
attributesGrid,
},
mixins: [statsMixin],
props: {
item: {
type: Object,
},
},
computed: {
...mapState({
ATTRIBUTES: 'constants.ATTRIBUTES',
user: 'user.data',
}),
itemText () {
if (this.item.text instanceof Function) {
return this.item.text();
}
return this.item.text;
},
itemNotes () {
if (this.item.notes instanceof Function) {
return this.item.notes();
}
return this.item.notes;
},
},
};
</script>