mirror of
https://github.com/HabitRPG/habitica.git
synced 2025-12-17 14:47:53 +01:00
Added initial inbox (#8852)
* Added initial inbox * Minor styles * Added more styles, selected conversations, sending messages * Added translations and colors
This commit is contained in:
@@ -1,54 +1,56 @@
|
||||
<template lang="pug">
|
||||
nav.navbar.navbar-inverse.fixed-top.navbar-toggleable-sm
|
||||
.navbar-header
|
||||
.logo.svg-icon(v-html="icons.logo")
|
||||
.collapse.navbar-collapse
|
||||
ul.navbar-nav.mr-auto
|
||||
router-link.nav-item(tag="li", :to="{name: 'tasks'}", exact)
|
||||
a.nav-link(v-once) {{ $t('tasks') }}
|
||||
router-link.nav-item.dropdown(tag="li", :to="{name: 'items'}", :class="{'active': $route.path.startsWith('/inventory')}")
|
||||
a.nav-link(v-once) {{ $t('inventory') }}
|
||||
.dropdown-menu
|
||||
router-link.dropdown-item(:to="{name: 'items'}", exact) {{ $t('items') }}
|
||||
router-link.dropdown-item(:to="{name: 'equipment'}") {{ $t('equipment') }}
|
||||
router-link.dropdown-item(:to="{name: 'stable'}") {{ $t('stable') }}
|
||||
router-link.nav-item(tag="li", :to="{name: 'shops'}", exact)
|
||||
a.nav-link(v-once) {{ $t('shops') }}
|
||||
router-link.nav-item(tag="li", :to="{name: 'party'}")
|
||||
a.nav-link(v-once) {{ $t('party') }}
|
||||
router-link.nav-item.dropdown(tag="li", :to="{name: 'tavern'}", :class="{'active': $route.path.startsWith('/guilds')}")
|
||||
a.nav-link(v-once) {{ $t('guilds') }}
|
||||
.dropdown-menu
|
||||
router-link.dropdown-item(:to="{name: 'tavern'}") {{ $t('tavern') }}
|
||||
router-link.dropdown-item(:to="{name: 'myGuilds'}") {{ $t('myGuilds') }}
|
||||
router-link.dropdown-item(:to="{name: 'guildsDiscovery'}") {{ $t('guildsDiscovery') }}
|
||||
router-link.nav-item(tag="li", :to="{name: 'challenges'}", exact)
|
||||
a.nav-link(v-once) {{ $t('challenges') }}
|
||||
router-link.nav-item.dropdown(tag="li", to="/help", :class="{'active': $route.path.startsWith('/help')}")
|
||||
a.nav-link(v-once) {{ $t('help') }}
|
||||
.dropdown-menu
|
||||
router-link.dropdown-item(to="/help/faq") {{ $t('faq') }}
|
||||
router-link.dropdown-item(to="/help/report-bug") {{ $t('reportBug') }}
|
||||
router-link.dropdown-item(to="/help/request-feature") {{ $t('requestAF') }}
|
||||
.item-with-icon
|
||||
.svg-icon(v-html="icons.gem")
|
||||
span {{userGems | roundBigNumber}}
|
||||
.item-with-icon
|
||||
.svg-icon(v-html="icons.gold")
|
||||
span {{user.stats.gp | roundBigNumber}}
|
||||
.item-with-icon.item-notifications
|
||||
.svg-icon(v-html="icons.notifications")
|
||||
router-link.dropdown.item-with-icon.item-user(:to="{name: 'avatar'}")
|
||||
.svg-icon(v-html="icons.user")
|
||||
.dropdown-menu.dropdown-menu-right.user-dropdown
|
||||
router-link.dropdown-item.edit-avatar(:to="{name: 'avatar'}")
|
||||
h3 {{ user.profile.name }}
|
||||
span.small-text {{ $t('editAvatar') }}
|
||||
router-link.dropdown-item(:to="{name: 'inbox'}") {{ $t('inbox') }}
|
||||
router-link.dropdown-item(:to="{name: 'stats'}") {{ $t('stats') }}
|
||||
router-link.dropdown-item(:to="{name: 'achievements'}") {{ $t('achievements') }}
|
||||
router-link.dropdown-item(:to="{name: 'settings'}") {{ $t('settings') }}
|
||||
a.nav-link.dropdown-item(to="/", @click.prevent='logout()') {{ $t('logout') }}
|
||||
div
|
||||
inbox-modal
|
||||
nav.navbar.navbar-inverse.fixed-top.navbar-toggleable-sm
|
||||
.navbar-header
|
||||
.logo.svg-icon(v-html="icons.logo")
|
||||
.collapse.navbar-collapse
|
||||
ul.navbar-nav.mr-auto
|
||||
router-link.nav-item(tag="li", :to="{name: 'tasks'}", exact)
|
||||
a.nav-link(v-once) {{ $t('tasks') }}
|
||||
router-link.nav-item.dropdown(tag="li", :to="{name: 'items'}", :class="{'active': $route.path.startsWith('/inventory')}")
|
||||
a.nav-link(v-once) {{ $t('inventory') }}
|
||||
.dropdown-menu
|
||||
router-link.dropdown-item(:to="{name: 'items'}", exact) {{ $t('items') }}
|
||||
router-link.dropdown-item(:to="{name: 'equipment'}") {{ $t('equipment') }}
|
||||
router-link.dropdown-item(:to="{name: 'stable'}") {{ $t('stable') }}
|
||||
router-link.nav-item(tag="li", :to="{name: 'shops'}", exact)
|
||||
a.nav-link(v-once) {{ $t('shops') }}
|
||||
router-link.nav-item(tag="li", :to="{name: 'party'}")
|
||||
a.nav-link(v-once) {{ $t('party') }}
|
||||
router-link.nav-item.dropdown(tag="li", :to="{name: 'tavern'}", :class="{'active': $route.path.startsWith('/guilds')}")
|
||||
a.nav-link(v-once) {{ $t('guilds') }}
|
||||
.dropdown-menu
|
||||
router-link.dropdown-item(:to="{name: 'tavern'}") {{ $t('tavern') }}
|
||||
router-link.dropdown-item(:to="{name: 'myGuilds'}") {{ $t('myGuilds') }}
|
||||
router-link.dropdown-item(:to="{name: 'guildsDiscovery'}") {{ $t('guildsDiscovery') }}
|
||||
router-link.nav-item(tag="li", :to="{name: 'challenges'}", exact)
|
||||
a.nav-link(v-once) {{ $t('challenges') }}
|
||||
router-link.nav-item.dropdown(tag="li", to="/help", :class="{'active': $route.path.startsWith('/help')}")
|
||||
a.nav-link(v-once) {{ $t('help') }}
|
||||
.dropdown-menu
|
||||
router-link.dropdown-item(to="/help/faq") {{ $t('faq') }}
|
||||
router-link.dropdown-item(to="/help/report-bug") {{ $t('reportBug') }}
|
||||
router-link.dropdown-item(to="/help/request-feature") {{ $t('requestAF') }}
|
||||
.item-with-icon
|
||||
.svg-icon(v-html="icons.gem")
|
||||
span {{userGems | roundBigNumber}}
|
||||
.item-with-icon
|
||||
.svg-icon(v-html="icons.gold")
|
||||
span {{user.stats.gp | roundBigNumber}}
|
||||
.item-with-icon.item-notifications
|
||||
.svg-icon(v-html="icons.notifications")
|
||||
router-link.dropdown.item-with-icon.item-user(:to="{name: 'avatar'}")
|
||||
.svg-icon(v-html="icons.user")
|
||||
.dropdown-menu.dropdown-menu-right.user-dropdown
|
||||
router-link.dropdown-item.edit-avatar(:to="{name: 'avatar'}")
|
||||
h3 {{ user.profile.name }}
|
||||
span.small-text {{ $t('editAvatar') }}
|
||||
a.nav-link.dropdown-item(@click.prevent='showInbox()') {{ $t('inbox') }}
|
||||
router-link.dropdown-item(:to="{name: 'stats'}") {{ $t('stats') }}
|
||||
router-link.dropdown-item(:to="{name: 'achievements'}") {{ $t('achievements') }}
|
||||
router-link.dropdown-item(:to="{name: 'settings'}") {{ $t('settings') }}
|
||||
a.nav-link.dropdown-item(to="/", @click.prevent='logout()') {{ $t('logout') }}
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@@ -198,8 +200,12 @@ import goldIcon from 'assets/svg/gold.svg';
|
||||
import notificationsIcon from 'assets/svg/notifications.svg';
|
||||
import userIcon from 'assets/svg/user.svg';
|
||||
import logo from 'assets/svg/logo.svg';
|
||||
import InboxModal from './userMenu/inbox.vue';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
InboxModal,
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
icons: Object.freeze({
|
||||
@@ -222,6 +228,9 @@ export default {
|
||||
localStorage.removeItem('habit-mobile-settings');
|
||||
this.$router.go('/');
|
||||
},
|
||||
showInbox () {
|
||||
this.$root.$emit('show::modal', 'inbox-modal');
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user