mirror of
https://github.com/sudoxnym/habitica.git
synced 2026-08-04 01:29:21 +00:00
ade6d9689f
* initial quests.vue - refactorings - add group to quests * shows quests by quest-group * buyQuestModal with rewards sidebar * store / actions to load seasonal/time-travelers shop data * buyModal buyPressed instead of buyAction - seasonal shop categories now with specialClass property - seasonal shop * time travelers vue - show hourglass in shopItem / buyDialog - fix banners * cleanup * show amount of already owned quests * show html notes in popovers / dialog * extract purchase-api to common.ops.purchaseWithSpell to call the same in the store / update the UI on purchases * add time-travelers sprites * fix lint * add last mystery set images * remove unused Page * remove equipment from newClient.json
67 lines
1.4 KiB
Vue
67 lines
1.4 KiB
Vue
<template lang="pug">
|
|
div
|
|
.svg-icon(v-if="withHourglass",v-html="icons.hourglasses")
|
|
span(v-if="withHourglass") {{userHourglasses | roundBigNumber}}
|
|
|
|
.svg-icon(v-html="icons.gem")
|
|
span {{userGems | roundBigNumber}}
|
|
.svg-icon(v-html="icons.gold")
|
|
span {{userGold | roundBigNumber}}
|
|
</template>
|
|
|
|
<style lang="scss" scoped>
|
|
@import '~client/assets/scss/colors.scss';
|
|
|
|
span {
|
|
font-weight: normal;
|
|
font-size: 12px;
|
|
line-height: 1.33;
|
|
color: $gray-200;
|
|
|
|
display: inline-block;
|
|
}
|
|
|
|
.svg-icon {
|
|
vertical-align: middle;
|
|
width: 16px;
|
|
height: 16px;
|
|
margin-right: 8px;
|
|
margin-left: 4px;
|
|
|
|
display: inline-block;
|
|
}
|
|
|
|
</style>
|
|
|
|
<script>
|
|
import { mapState, mapGetters } from 'client/libs/store';
|
|
import svgGem from 'assets/svg/gem.svg';
|
|
import svgGold from 'assets/svg/gold.svg';
|
|
import svgHourglasses from 'assets/svg/hourglass.svg';
|
|
|
|
export default {
|
|
data () {
|
|
return {
|
|
icons: Object.freeze({
|
|
gem: svgGem,
|
|
gold: svgGold,
|
|
hourglasses: svgHourglasses,
|
|
}),
|
|
};
|
|
},
|
|
computed: {
|
|
...mapGetters({
|
|
userGems: 'user:gems',
|
|
}),
|
|
...mapState({
|
|
userHourglasses: 'user.data.purchased.plan.consecutive.trinkets',
|
|
userGold: 'user.data.stats.gp',
|
|
}),
|
|
},
|
|
props: {
|
|
withHourglass: {
|
|
type: Boolean,
|
|
},
|
|
},
|
|
};
|
|
</script>
|