mirror of
https://github.com/HabitRPG/habitica.git
synced 2025-12-16 14:17:22 +01:00
c5e0bcfb0e
* View party now opens member modal * Clicking member in header opens member detail modal * Began sticky header * Added sleep * Removed extra inbox and added name styles * Lint fixes * Added member filter * Added task counts * Updated quest start modal * Updated members modal style * Fixed editing party * Updated tavern * Updated my guilds * More guild styles * Many challenge styles and fixes * Fixed notification menu display * Added initial styles to groupplans * Added syncing with inbox * Fixed lint * Added new edit profile layout * Added initial achievement layout * Began adding new stats layout * Removed duplicate: * fix(CI): attempt to address Travis Mongo connection issue * fix(CI): don't strand us in Mongo shell * Travis updates * Try percise
73 lines
2.0 KiB
Vue
73 lines
2.0 KiB
Vue
<template lang="pug">
|
|
.standard-page.container
|
|
.row(v-for='(category, key) in achievements')
|
|
h2.col-12 {{ $t(key+'Achievs') }}
|
|
.col-3.text-center(v-for='achievment in category.achievements')
|
|
div.achievement-container(:data-popover-html='achievment.title + achievment.text',
|
|
popover-placement='achievPopoverPlacement',
|
|
popover-append-to-body='achievAppendToBody')
|
|
div(popover-trigger='mouseenter',
|
|
:data-popover-html='achievment.title + achievment.text',
|
|
popover-placement='achievPopoverPlacement',
|
|
popover-append-to-body='achievAppendToBody')
|
|
.achievement(:class='achievment.icon + "2x"', v-if='achievment.earned')
|
|
.counter.badge.badge-info.stack-count(v-if='achievment.optionalCount') {{achievment.optionalCount}}
|
|
.achievement(class='achievement-unearned2x', v-if='!achievment.earned')
|
|
.row
|
|
.col-6
|
|
h2 Challeges Won
|
|
div(v-for='chal in user.achievements.challenges')
|
|
span {{chal}}
|
|
.col-6
|
|
h2 Quests Completed
|
|
div(v-for='(value, key) in user.achievements.quests')
|
|
span {{ content.quests[k].text() }}
|
|
span {{ value }}
|
|
</template>
|
|
|
|
<style lang="scss" scoped>
|
|
h2 {
|
|
margin-top: 2em;
|
|
}
|
|
|
|
.achievement-container {
|
|
margin-bottom: 1em;
|
|
padding: 2em;
|
|
background: #fff;
|
|
}
|
|
|
|
.achievement {
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.counter.badge {
|
|
color: #fff;
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
background-color: #ff944c;
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
import { mapState } from 'client/libs/store';
|
|
|
|
import achievementsLib from '../../../common/script/libs/achievements';
|
|
import Content from '../../../common/script/content';
|
|
|
|
export default {
|
|
data () {
|
|
return {
|
|
achievements: {},
|
|
content: Content,
|
|
};
|
|
},
|
|
mounted () {
|
|
this.achievements = achievementsLib.getAchievementsForProfile(this.user);
|
|
},
|
|
computed: {
|
|
...mapState({user: 'user.data'}),
|
|
},
|
|
};
|
|
</script>
|