Mercurial > gemma
view client/src/application/Userbar.vue @ 1122:a4c74a95c177 store-refactoring
minor store refactoring
removed unused getters from user store and renamed functions to adhere to nameing scheme
removed unnecessary getter from map store
author | Markus Kottlaender <markus@intevation.de> |
---|---|
date | Tue, 06 Nov 2018 11:21:29 +0100 |
parents | ca628dce90dd |
children | d9e6a1f6f394 |
line wrap: on
line source
<template> <div> <img @click="extendUserMenu" class="ui-element userpic shadow" src="../application/assets/user.png"> <div :class="userManagementStyle"> <span v-if="!isUsermenuCollapsed" class="username align-self-center">{{ user }}</span> <span v-if="!isUsermenuCollapsed" class="logout align-self-center" @click="logoff"> <i class="fa fa-power-off"></i> </span> </div> </div> </template> <style lang="scss"> .userpic { background: white; position: absolute; bottom: $offset; left: $offset; height: $icon-width; width: $icon-height; border-radius: $border-radius; } .username { margin-left: 40px; } .usermanagement { background: white; margin-left: $offset; padding: $offset; border-radius: $border-radius; margin-bottom: $offset; height: $icon-height; } .usermanagementcollapsed { transition: 0.3s; width: $icon-width; } .usermanagementexpanded { width: $sidebar-width; } </style> <script> /* * This is Free Software under GNU Affero General Public License v >= 3.0 * without warranty, see README.md and license for details. * * SPDX-License-Identifier: AGPL-3.0-or-later * License-Filename: LICENSES/AGPL-3.0.txt * * Copyright (C) 2018 by via donau * – Österreichische Wasserstraßen-Gesellschaft mbH * Software engineering by Intevation GmbH * * Author(s): * Thomas Junk <thomas.junk@intevation.de> */ import { mapGetters, mapState } from "vuex"; export default { name: "user", data() { return {}; }, methods: { extendUserMenu() { this.$store.commit("application/toggleUserMenu"); }, logoff() { this.$store.commit("user/clearAuth"); this.$store.commit("application/resetSidebar"); this.$store.commit("application/resetUserMenu"); this.$store.commit("application/resetSplitScreen"); this.$router.push("/login"); } }, computed: { ...mapState("user", ["user"]), ...mapGetters("application", ["isUsermenuCollapsed"]), userManagementStyle() { return { "ui-element": true, "d-flex": true, "flex-row": true, "justify-content-around": true, usermanagement: true, usermanagementcollapsed: this.isUsermenuCollapsed, usermanagementexpanded: !this.isUsermenuCollapsed, shadow: true }; } } }; </script>