new Layout and new Routes for router
This commit is contained in:
parent
708f40938a
commit
8f786d3883
|
|
@ -45,7 +45,9 @@
|
|||
"@vue/prettier",
|
||||
"eslint:recommended"
|
||||
],
|
||||
"rules": {},
|
||||
"rules": {
|
||||
"no-console": "off"
|
||||
},
|
||||
"parserOptions": {
|
||||
"parser": "babel-eslint"
|
||||
}
|
||||
|
|
|
|||
10
src/App.vue
10
src/App.vue
|
|
@ -1,18 +1,20 @@
|
|||
<template>
|
||||
<v-app>
|
||||
<TitleBar />
|
||||
<router-view />
|
||||
<v-footer app>
|
||||
<span class="px-4">© {{ new Date().getFullYear()}} Studentenclub Wu 5 e.v.</span>
|
||||
<span class="px-4"
|
||||
>© {{ new Date().getFullYear() }} Studentenclub Wu 5 e.v.</span
|
||||
>
|
||||
</v-footer>
|
||||
</v-app>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TitleBar from './components/TitleBar'
|
||||
export default {
|
||||
name: 'App',
|
||||
|
||||
components: {},
|
||||
|
||||
components: { TitleBar },
|
||||
data: () => ({
|
||||
//
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<v-app-bar app clipped-left hide-on-scroll color="blue accent-4" class="elevation-4" dark>
|
||||
<v-app-bar app clipped-left clipped-right hide-on-scroll color="blue accent-4" class="elevation-4" dark>
|
||||
<v-btn icon>
|
||||
<v-img src="@/assets/logo-big.png" contain height="40"></v-img>
|
||||
</v-btn>
|
||||
|
|
@ -8,42 +8,27 @@
|
|||
<v-btn icon v-if="isFinanzer" href="finanzer">
|
||||
<v-icon>attach_money</v-icon>
|
||||
</v-btn>
|
||||
<v-btn icon v-if="isBar" href="bar">
|
||||
<v-btn icon v-if="isBar">
|
||||
<v-icon>local_bar</v-icon>
|
||||
</v-btn>
|
||||
<v-btn v-if="isLoggedIn" @click="logout">Logout</v-btn>
|
||||
<v-btn icon v-if="isUser">
|
||||
<v-icon>person</v-icon>
|
||||
</v-btn>
|
||||
</v-app-bar>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapActions } from 'vuex'
|
||||
import { mapActions, mapGetters } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'TitleBar',
|
||||
computed: {
|
||||
isBar() {
|
||||
try {
|
||||
return this.$store.getters.getGroup.includes('bar') ? true : false
|
||||
} catch (e) {
|
||||
return false
|
||||
}
|
||||
},
|
||||
isFinanzer() {
|
||||
try {
|
||||
return this.$store.getters.getGroup.includes('moneymaster')
|
||||
? true
|
||||
: false
|
||||
} catch (e) {
|
||||
return false
|
||||
}
|
||||
},
|
||||
isLoggedIn() {
|
||||
return this.$store.getters.getToken
|
||||
}
|
||||
...mapGetters(['isBar', 'isFinanzer', 'isUser', 'isLoggedIn'])
|
||||
},
|
||||
methods: {
|
||||
...mapActions(['logout'])
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,132 @@
|
|||
<template>
|
||||
<v-container v-if="user">
|
||||
<v-card>
|
||||
<v-list-item>
|
||||
<v-list-item-title class="title"
|
||||
>{{ user.firstname }} {{ user.lastname }}</v-list-item-title
|
||||
>
|
||||
</v-list-item>
|
||||
<v-card-text>
|
||||
<v-row>
|
||||
<v-col cols="10">
|
||||
<v-row>
|
||||
<v-col>
|
||||
<v-btn
|
||||
class="creditBtn"
|
||||
block
|
||||
@click="addAmount(200)"
|
||||
:color="color"
|
||||
:disabled="user.locked"
|
||||
>2 €</v-btn
|
||||
>
|
||||
</v-col>
|
||||
<v-col>
|
||||
<v-btn
|
||||
class="creditBtn"
|
||||
block
|
||||
@click="addAmount(100)"
|
||||
:color="color"
|
||||
:disabled="user.locked"
|
||||
>1 €</v-btn
|
||||
>
|
||||
</v-col>
|
||||
<v-col>
|
||||
<v-btn
|
||||
class="creditBtn"
|
||||
block
|
||||
@click="addAmount(50)"
|
||||
:color="color"
|
||||
:disabled="user.locked"
|
||||
>0,50 €</v-btn
|
||||
>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-col>
|
||||
<v-btn
|
||||
class="creditBtn"
|
||||
block
|
||||
@click="addAmount(40)"
|
||||
:color="color"
|
||||
:disabled="user.locked"
|
||||
>0,40 €</v-btn
|
||||
>
|
||||
</v-col>
|
||||
<v-col>
|
||||
<v-btn
|
||||
class="creditBtn"
|
||||
block
|
||||
@click="addAmount(20)"
|
||||
:color="color"
|
||||
:disabled="user.locked"
|
||||
>0,20 €</v-btn
|
||||
>
|
||||
</v-col>
|
||||
<v-col>
|
||||
<v-btn
|
||||
class="creditBtn"
|
||||
block
|
||||
@click="addAmount(10)"
|
||||
:color="color"
|
||||
:disabled="user.locked"
|
||||
>0,10 €</v-btn
|
||||
>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-col>
|
||||
<v-col align-self="center">
|
||||
<v-row>
|
||||
<v-list-item>
|
||||
<v-list-item-action-text :class="getColor(getAllSum())"
|
||||
>{{
|
||||
(getAllSum() / 100).toFixed(2)
|
||||
}}
|
||||
€</v-list-item-action-text
|
||||
>
|
||||
</v-list-item>
|
||||
</v-row>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-alert v-if="user.locked" type="error"
|
||||
>{{ user.firstname }} darf nicht mehr anschreiben.
|
||||
{{ user.firstname }} sollte sich lieber mal beim Finanzer
|
||||
melden.</v-alert
|
||||
>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapGetters, mapActions} from 'vuex'
|
||||
export default {
|
||||
name: 'AddAmount',
|
||||
data() {
|
||||
return {
|
||||
color: 'green accent-4'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
...mapActions({
|
||||
addAmount: 'user/addAmount'
|
||||
}),
|
||||
getColor(value) {
|
||||
return value >= 0 ? 'title green--text' : 'title red--text'
|
||||
},
|
||||
getAllSum() {
|
||||
console.log("getAllSum", this.user)
|
||||
if (this.user)
|
||||
return this.user.creditList[this.year][2].sum + this.user.creditList[this.year][1].last
|
||||
return 0
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters({
|
||||
user: 'user/user',
|
||||
year: 'user/year'
|
||||
}),
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -0,0 +1,107 @@
|
|||
<template>
|
||||
<div>
|
||||
<v-toolbar>
|
||||
<v-toolbar-title>Gesamtübersicht</v-toolbar-title>
|
||||
<v-spacer />
|
||||
<v-toolbar-items>
|
||||
<v-text-field
|
||||
v-model="filter"
|
||||
style="margin-top: 3px"
|
||||
append-icon="search"
|
||||
outlined
|
||||
:rules="[isNumber]"
|
||||
></v-text-field>
|
||||
</v-toolbar-items>
|
||||
</v-toolbar>
|
||||
<div v-for="year in years" :key="years.indexOf(year)">
|
||||
<v-card style="margin-top: 3px" v-if="isFiltered(year)">
|
||||
<v-card-title>{{ year }}</v-card-title>
|
||||
<Table v-bind:user="user" v-bind:year="year" />
|
||||
<v-container fluid>
|
||||
<v-col>
|
||||
<v-row>
|
||||
<v-col>
|
||||
<v-label>Vorjahr:</v-label>
|
||||
</v-col>
|
||||
<v-col>
|
||||
<v-chip
|
||||
outlined
|
||||
:text-color="getLastColor(user.creditList[year][1].last)"
|
||||
>{{ (user.creditList[year][1].last / 100).toFixed(2) }}
|
||||
</v-chip>
|
||||
</v-col>
|
||||
<v-col>
|
||||
<v-label>Gesamt:</v-label>
|
||||
</v-col>
|
||||
<v-col>
|
||||
<v-chip
|
||||
outlined
|
||||
x-large
|
||||
:text-color="
|
||||
getLastColor(
|
||||
getAllSum(
|
||||
user.creditList[year][2].sum,
|
||||
user.creditList[year][1].last
|
||||
)
|
||||
)
|
||||
"
|
||||
>
|
||||
{{
|
||||
(
|
||||
getAllSum(
|
||||
user.creditList[year][2].sum,
|
||||
user.creditList[year][1].last
|
||||
) / 100
|
||||
).toFixed(2)
|
||||
}}
|
||||
</v-chip>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-col>
|
||||
</v-container>
|
||||
</v-card>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex'
|
||||
import Table from '../finanzer/Table'
|
||||
export default {
|
||||
name: 'CreditOverview',
|
||||
components: { Table },
|
||||
data() {
|
||||
return {
|
||||
isNumber: value => Number.isInteger(parseInt(value === '' ? 0 : value)) || "Muss eine Zahl sein.",
|
||||
filter: ''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getLastColor(value) {
|
||||
return value < 0 ? 'red' : 'green'
|
||||
},
|
||||
getAllSum(sum, lastYear) {
|
||||
return lastYear + sum
|
||||
},
|
||||
isFiltered(value) {
|
||||
return value.toString().includes(this.filter)
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters({
|
||||
user: 'user/user'
|
||||
}),
|
||||
years() {
|
||||
let years = []
|
||||
if (this.user) {
|
||||
for (let year in this.user.creditList) {
|
||||
years.unshift(parseInt(year))
|
||||
}
|
||||
}
|
||||
return years
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -15,7 +15,9 @@ const url = {
|
|||
finanzerSetConfig: main + 'finanzerSetConfig',
|
||||
finanzerAddUser: main + 'finanzerAddUser',
|
||||
finanzerSendAllMail: main + 'finanzerSendAllMail',
|
||||
finanzerSendOneMail: main + 'finanzerSendOneMail'
|
||||
finanzerSendOneMail: main + 'finanzerSendOneMail',
|
||||
userMain: main + 'user/main',
|
||||
userAddAmount: main + 'user/addAmount'
|
||||
}
|
||||
|
||||
export default url
|
||||
|
|
|
|||
|
|
@ -3,7 +3,12 @@ import VueRouter from 'vue-router'
|
|||
import FinanzerView from '@/views/FinanzerView'
|
||||
import Login from '@/views/Login'
|
||||
import store from '@/store/index'
|
||||
import BarView from '@/views/BarView'
|
||||
import GeruechteView from '../views/contents/GeruechteView'
|
||||
import AddAmount from '../components/user/AddAmount'
|
||||
import CreditOverview from '../components/user/CreditOverview'
|
||||
import MainView from '../views/MainView'
|
||||
import UserView from '../views/UserView'
|
||||
import BarView from '../views/BarView'
|
||||
|
||||
Vue.use(VueRouter)
|
||||
|
||||
|
|
@ -19,9 +24,45 @@ const routes = [
|
|||
component: FinanzerView
|
||||
},
|
||||
{
|
||||
path: '/bar',
|
||||
name: 'bar',
|
||||
component: BarView
|
||||
path: '/main',
|
||||
name: 'main',
|
||||
component: MainView,
|
||||
children: [
|
||||
{
|
||||
path: 'user',
|
||||
name: 'user',
|
||||
component: UserView,
|
||||
children: [
|
||||
{
|
||||
path: 'add',
|
||||
name: 'add',
|
||||
component: AddAmount
|
||||
},
|
||||
{
|
||||
path: 'overview',
|
||||
name: 'userOverview',
|
||||
component: CreditOverview
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: 'bar',
|
||||
name: 'bar',
|
||||
component: BarView,
|
||||
children: [
|
||||
{
|
||||
path: 'geruecht',
|
||||
name: 'geruecht',
|
||||
component: GeruechteView
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: 'finanzer',
|
||||
name: 'finanzer',
|
||||
component: FinanzerView
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '*',
|
||||
|
|
@ -39,18 +80,23 @@ const router = new VueRouter({
|
|||
|
||||
router.beforeEach((to, from, next) => {
|
||||
store.dispatch('fetchAccessToken')
|
||||
let sites = ['/finanzer', '/bar']
|
||||
if (sites.includes(to.fullPath)) {
|
||||
if (to.fullPath === '/finanzer') {
|
||||
console.log('fullPath', to.fullPath)
|
||||
if (to.fullPath.includes('/main')) {
|
||||
if (to.fullPath.includes('/main/finanzer')) {
|
||||
if (!store.state.login.user.group.includes('moneymaster')) {
|
||||
next('/login')
|
||||
}
|
||||
}
|
||||
if (to.fullPath === '/bar') {
|
||||
if (to.fullPath.includes('/main/bar')) {
|
||||
if (!store.state.login.user.group.includes('bar')) {
|
||||
next('/login')
|
||||
}
|
||||
}
|
||||
if (to.fullPath.includes('/main/user')) {
|
||||
if (!store.state.login.user.group.includes('user')) {
|
||||
next('/login')
|
||||
}
|
||||
}
|
||||
if (!store.state.login.user.accessToken) {
|
||||
next('/login')
|
||||
}
|
||||
|
|
@ -58,9 +104,11 @@ router.beforeEach((to, from, next) => {
|
|||
if (to.fullPath === '/login') {
|
||||
if (store.state.login.user.accessToken) {
|
||||
if (store.state.login.user.group.includes('moneymaster')) {
|
||||
next('/finanzer')
|
||||
next('/main/finanzer')
|
||||
} else if (store.state.login.user.group.includes('bar')) {
|
||||
next('/bar')
|
||||
next('/main/bar/geruecht')
|
||||
} else if (store.state.login.user.group.includes('user')) {
|
||||
next('/main/user/add')
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ import Vuex from 'vuex'
|
|||
import login from './modules/login'
|
||||
import finanzerUsers from './modules/finanzerUsers'
|
||||
import barUsers from '@/store/modules/barUsers'
|
||||
import user from '@/store/modules/user'
|
||||
|
||||
Vue.use(Vuex)
|
||||
|
||||
|
|
@ -10,6 +11,7 @@ export default new Vuex.Store({
|
|||
modules: {
|
||||
login,
|
||||
finanzerUsers,
|
||||
barUsers
|
||||
barUsers,
|
||||
user
|
||||
}
|
||||
})
|
||||
|
|
|
|||
|
|
@ -55,9 +55,11 @@ const actions = {
|
|||
commit('loginStop', null)
|
||||
commit('updateAccessToken', response.data)
|
||||
if (state.user.group.includes('moneymaster')) {
|
||||
router.push('/finanzer')
|
||||
router.push('/main/finanzer')
|
||||
} else if (state.user.group.includes('bar')) {
|
||||
router.push('/bar')
|
||||
router.push('/main/bar/geruecht')
|
||||
} else if (state.user.group.includes('user')) {
|
||||
router.push('/main/user/add')
|
||||
}
|
||||
} catch (err) {
|
||||
commit('loginStop', err.response.data.error)
|
||||
|
|
@ -96,6 +98,30 @@ const getters = {
|
|||
},
|
||||
loginError: state => {
|
||||
return state.loginError
|
||||
},
|
||||
isBar: state => {
|
||||
try {
|
||||
return state.user.group.includes('bar') ? true : false
|
||||
} catch (e) {
|
||||
return false
|
||||
}
|
||||
},
|
||||
isFinanzer: state => {
|
||||
try {
|
||||
return state.user.group.includes('moneymaster') ? true : false
|
||||
} catch (e) {
|
||||
return false
|
||||
}
|
||||
},
|
||||
isUser: state => {
|
||||
try {
|
||||
return state.user.group.includes('user') ? true : false
|
||||
} catch (e) {
|
||||
return false
|
||||
}
|
||||
},
|
||||
isLoggedIn: state => {
|
||||
return state.user.accessToken ? true : false
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,168 @@
|
|||
import axios from 'axios'
|
||||
import url from '@/plugins/routes'
|
||||
|
||||
const state = {
|
||||
user: null,
|
||||
creditList: []
|
||||
}
|
||||
|
||||
const mutations = {
|
||||
setUser: (state, user) => {
|
||||
state.user = user
|
||||
let list = {}
|
||||
for (let creditList in user['creditList']) {
|
||||
console.log(creditList)
|
||||
let amount = mutations.createAmount(user['creditList'][creditList])
|
||||
let credit = mutations.createCredit(user['creditList'][creditList])
|
||||
let sum = mutations.createSum(credit, amount)
|
||||
list[creditList] = [{ ...credit }, { ...amount }, { ...sum }]
|
||||
}
|
||||
state.user.creditList = list
|
||||
state.creditList = []
|
||||
console.log(state.user)
|
||||
},
|
||||
createAmount(creditList) {
|
||||
let amount = {
|
||||
type: 'Schulden',
|
||||
jan_amount: 0 - creditList.jan.depts,
|
||||
feb_amount: 0 - creditList.feb.depts,
|
||||
maer_amount: 0 - creditList.maer.depts,
|
||||
apr_amount: 0 - creditList.apr.depts,
|
||||
mai_amount: 0 - creditList.mai.depts,
|
||||
jun_amount: 0 - creditList.jun.depts,
|
||||
jul_amount: 0 - creditList.jul.depts,
|
||||
aug_amount: 0 - creditList.aug.depts,
|
||||
sep_amount: 0 - creditList.sep.depts,
|
||||
okt_amount: 0 - creditList.okt.depts,
|
||||
nov_amount: 0 - creditList.nov.depts,
|
||||
dez_amount: 0 - creditList.dez.depts,
|
||||
last: 0 - creditList['last']
|
||||
}
|
||||
|
||||
amount.sum =
|
||||
amount.jan_amount +
|
||||
amount.feb_amount +
|
||||
amount.maer_amount +
|
||||
amount.apr_amount +
|
||||
amount.mai_amount +
|
||||
amount.jun_amount +
|
||||
amount.jul_amount +
|
||||
amount.aug_amount +
|
||||
amount.sep_amount +
|
||||
amount.okt_amount +
|
||||
amount.nov_amount +
|
||||
amount.dez_amount
|
||||
return amount
|
||||
},
|
||||
createCredit(creditList) {
|
||||
let credit = {
|
||||
type: 'Guthaben',
|
||||
jan_amount: creditList.jan.credit,
|
||||
feb_amount: creditList.feb.credit,
|
||||
maer_amount: creditList.maer.credit,
|
||||
apr_amount: creditList.apr.credit,
|
||||
mai_amount: creditList.mai.credit,
|
||||
jun_amount: creditList.jun.credit,
|
||||
jul_amount: creditList.jul.credit,
|
||||
aug_amount: creditList.aug.credit,
|
||||
sep_amount: creditList.sep.credit,
|
||||
okt_amount: creditList.okt.credit,
|
||||
nov_amount: creditList.nov.credit,
|
||||
dez_amount: creditList.dez.credit
|
||||
}
|
||||
credit.sum =
|
||||
credit.jan_amount +
|
||||
credit.feb_amount +
|
||||
credit.maer_amount +
|
||||
credit.apr_amount +
|
||||
credit.mai_amount +
|
||||
credit.jun_amount +
|
||||
credit.jul_amount +
|
||||
credit.aug_amount +
|
||||
credit.sep_amount +
|
||||
credit.okt_amount +
|
||||
credit.nov_amount +
|
||||
credit.dez_amount
|
||||
return credit
|
||||
},
|
||||
createSum(credit, amount) {
|
||||
let sum = {
|
||||
type: 'Summe',
|
||||
jan_amount: credit.jan_amount + amount.jan_amount,
|
||||
feb_amount: credit.feb_amount + amount.feb_amount,
|
||||
maer_amount: credit.maer_amount + amount.maer_amount,
|
||||
apr_amount: credit.apr_amount + amount.apr_amount,
|
||||
mai_amount: credit.mai_amount + amount.mai_amount,
|
||||
jun_amount: credit.jun_amount + amount.jun_amount,
|
||||
jul_amount: credit.jul_amount + amount.jul_amount,
|
||||
aug_amount: credit.aug_amount + amount.aug_amount,
|
||||
sep_amount: credit.sep_amount + amount.sep_amount,
|
||||
okt_amount: credit.okt_amount + amount.okt_amount,
|
||||
nov_amount: credit.nov_amount + amount.nov_amount,
|
||||
dez_amount: credit.dez_amount + amount.dez_amount
|
||||
}
|
||||
sum.sum =
|
||||
sum.jan_amount +
|
||||
sum.feb_amount +
|
||||
sum.maer_amount +
|
||||
sum.apr_amount +
|
||||
sum.mai_amount +
|
||||
sum.jun_amount +
|
||||
sum.jul_amount +
|
||||
sum.aug_amount +
|
||||
sum.sep_amount +
|
||||
sum.okt_amount +
|
||||
sum.nov_amount +
|
||||
sum.dez_amount
|
||||
return sum
|
||||
}
|
||||
}
|
||||
|
||||
const actions = {
|
||||
async getUser({ commit, rootState, dispatch }) {
|
||||
try {
|
||||
const response = await axios.get(url.userMain, {
|
||||
headers: { Token: rootState.login.user.accessToken }
|
||||
})
|
||||
commit('setUser', response.data)
|
||||
} catch (e) {
|
||||
if (e.response)
|
||||
if (e.response.status === 401) dispatch('logout', null, { root: true })
|
||||
}
|
||||
},
|
||||
async addAmount({ commit, rootState, dispatch }, amount) {
|
||||
try {
|
||||
const response = await axios.post(
|
||||
url.userAddAmount,
|
||||
{ amount: amount },
|
||||
{ headers: { Token: rootState.login.user.accessToken } }
|
||||
)
|
||||
commit('setUser', response.data)
|
||||
} catch (e) {
|
||||
if (e.response)
|
||||
if (e.response.status === 401) dispatch('logout', null, { root: true })
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const getters = {
|
||||
user: state => {
|
||||
return state.user
|
||||
},
|
||||
year: state => {
|
||||
let year = 0
|
||||
for (let creditList in state.user.creditList) {
|
||||
let currentYear = parseInt(creditList)
|
||||
if (currentYear > year) year = currentYear
|
||||
}
|
||||
return year
|
||||
}
|
||||
}
|
||||
|
||||
export default {
|
||||
namespaced: true,
|
||||
state,
|
||||
mutations,
|
||||
actions,
|
||||
getters
|
||||
}
|
||||
|
|
@ -1,29 +1,13 @@
|
|||
<template>
|
||||
<div>
|
||||
<TitleBar />
|
||||
<v-content>
|
||||
<SearchBar />
|
||||
<CreditLists></CreditLists>
|
||||
</v-content>
|
||||
</div>
|
||||
<v-content>
|
||||
<router-view/>
|
||||
</v-content>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TitleBar from '@/components/TitleBar'
|
||||
import CreditLists from '@/components/baruser/CreditLists'
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
import axios from 'axios'
|
||||
import SearchBar from '../components/baruser/SearchBar'
|
||||
export default {
|
||||
name: 'BarView',
|
||||
components: { SearchBar, CreditLists, TitleBar },
|
||||
created() {},
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
methods: {}
|
||||
name: 'BarView'
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
<style scoped></style>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,14 @@
|
|||
<template>
|
||||
<div>
|
||||
<TitleBar />
|
||||
<v-navigation-drawer mini-variant expand-on-hover app clipped permanent overflow>
|
||||
<v-navigation-drawer
|
||||
mini-variant
|
||||
expand-on-hover
|
||||
app
|
||||
clipped
|
||||
permanent
|
||||
overflow
|
||||
right
|
||||
>
|
||||
<v-list>
|
||||
<v-list-item class="title" link @click="setActiveUser(activeUser)">
|
||||
<v-list-item-icon>
|
||||
|
|
@ -15,11 +22,17 @@
|
|||
<v-list-item
|
||||
v-for="user in users"
|
||||
v-bind:key="users.indexOf(user)"
|
||||
:class="user.username === activeUser.username ? 'v-list-item--highlighted' : ''"
|
||||
:class="
|
||||
user.username === activeUser.username
|
||||
? 'v-list-item--highlighted'
|
||||
: ''
|
||||
"
|
||||
link
|
||||
@click="setActiveUser(user)"
|
||||
>
|
||||
<v-list-item-title>{{user.lastname}}, {{user.firstname}}</v-list-item-title>
|
||||
<v-list-item-title
|
||||
>{{ user.lastname }}, {{ user.firstname }}</v-list-item-title
|
||||
>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
<template v-slot:append>
|
||||
|
|
@ -63,7 +76,6 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import TitleBar from '@/components/TitleBar'
|
||||
import Overview from '../components/finanzer/Overview'
|
||||
import User from '../components/finanzer/User'
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
|
|
@ -72,10 +84,11 @@ import { mapActions } from 'vuex'
|
|||
|
||||
export default {
|
||||
name: 'FinanzerView',
|
||||
components: { User, Overview, TitleBar },
|
||||
components: { User, Overview },
|
||||
created() {
|
||||
this.getAllUsers()
|
||||
this.getUsers()
|
||||
this.createYears()
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -86,7 +99,9 @@ export default {
|
|||
getAllUsers: 'finanzerUsers/getAllUsers',
|
||||
setActiveUser: 'finanzerUsers/setActiveUser',
|
||||
getUsers: 'finanzerUsers/getUsers',
|
||||
finanzerUsers: 'finanzerUsers/addUser'
|
||||
finanzerUsers: 'finanzerUsers/addUser',
|
||||
createYears: 'finanzerUsers/createYears',
|
||||
logout: 'logout'
|
||||
}),
|
||||
computed: mapGetters({
|
||||
users: 'finanzerUsers/users',
|
||||
|
|
@ -96,5 +111,4 @@ export default {
|
|||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
<style scoped></style>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
<template>
|
||||
<div>
|
||||
<TitleBar />
|
||||
<v-content>
|
||||
<v-container class="fill-height" fluid>
|
||||
<v-row align="center" justify="center">
|
||||
|
|
@ -19,7 +18,9 @@
|
|||
type="text"
|
||||
v-model="username"
|
||||
ref="first"
|
||||
@keyup.enter="doLogin({username: username, password: password})"
|
||||
@keyup.enter="
|
||||
doLogin({ username: username, password: password })
|
||||
"
|
||||
@input="resetLoginError"
|
||||
/>
|
||||
|
||||
|
|
@ -30,19 +31,26 @@
|
|||
prepend-icon="lock"
|
||||
type="password"
|
||||
v-model="password"
|
||||
@keyup.enter="doLogin({username: username, password: password})"
|
||||
@keyup.enter="
|
||||
doLogin({ username: username, password: password })
|
||||
"
|
||||
@input="resetLoginError"
|
||||
/>
|
||||
</v-form>
|
||||
</v-card-text>
|
||||
<v-alert v-if="loginError" dense type="error">{{ loginError }}</v-alert>
|
||||
<v-alert v-if="loginError" dense type="error">{{
|
||||
loginError
|
||||
}}</v-alert>
|
||||
<v-card-actions>
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
@click="doLogin({username: username, password: password})"
|
||||
@submit.prevent="doLogin({username: username, password: password})"
|
||||
@click="doLogin({ username: username, password: password })"
|
||||
@submit.prevent="
|
||||
doLogin({ username: username, password: password })
|
||||
"
|
||||
color="primary"
|
||||
>Login</v-btn>
|
||||
>Login</v-btn
|
||||
>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-col>
|
||||
|
|
@ -53,13 +61,12 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import TitleBar from '@/components/TitleBar'
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
import { mapActions } from 'vuex'
|
||||
import { mapGetters } from 'vuex'
|
||||
export default {
|
||||
name: 'Login',
|
||||
components: { TitleBar },
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
username: null,
|
||||
|
|
@ -71,5 +78,4 @@ export default {
|
|||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
<style scoped></style>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,84 @@
|
|||
<template>
|
||||
<div>
|
||||
<v-navigation-drawer
|
||||
v-if="isLoggedIn"
|
||||
mini-variant
|
||||
expand-on-hover
|
||||
app
|
||||
clipped
|
||||
permanent
|
||||
overflow
|
||||
>
|
||||
<v-list>
|
||||
<v-list-item v-if="isUser" class="title" link to="/main/user/add">
|
||||
<v-list-item-icon>
|
||||
<v-icon>person</v-icon>
|
||||
</v-list-item-icon>
|
||||
<v-list-item-title>Account</v-list-item-title>
|
||||
</v-list-item>
|
||||
<v-list-item v-if="isBar" class="title" link to="/main/bar/geruecht">
|
||||
<v-list-item-icon>
|
||||
<v-icon>local_bar</v-icon>
|
||||
</v-list-item-icon>
|
||||
<v-list-item-title>
|
||||
Gerüchte
|
||||
</v-list-item-title>
|
||||
</v-list-item>
|
||||
<v-list-item v-if="isFinanzer" class="title" link to="/main/finanzer">
|
||||
<v-list-item-icon>
|
||||
<v-icon>attach_money</v-icon>
|
||||
</v-list-item-icon>
|
||||
<v-list-item-title>Finanzer</v-list-item-title>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
<v-divider />
|
||||
<v-list v-if="isUser">
|
||||
<v-list-item link to="/main/user/overview">
|
||||
<v-list-item-icon>
|
||||
<v-icon>account_balance</v-icon>
|
||||
</v-list-item-icon>
|
||||
<v-list-item-title>Finanzübersicht</v-list-item-title>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
<template v-slot:append>
|
||||
<v-list>
|
||||
<v-list-item>
|
||||
<v-list-item-icon>
|
||||
<v-icon>exit_to_app</v-icon>
|
||||
</v-list-item-icon>
|
||||
<v-list-item-title>
|
||||
<v-btn block text @click="logout">Logout</v-btn>
|
||||
</v-list-item-title>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
</template>
|
||||
</v-navigation-drawer>
|
||||
<router-view />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapActions, mapGetters } from 'vuex'
|
||||
export default {
|
||||
name: 'MainView',
|
||||
components: { },
|
||||
created() {
|
||||
},
|
||||
methods: {
|
||||
...mapActions({
|
||||
logout: 'logout'
|
||||
})
|
||||
},
|
||||
computed: {
|
||||
...mapGetters({
|
||||
group: 'group',
|
||||
isBar: 'isBar',
|
||||
isUser: 'isUser',
|
||||
isFinanzer: 'isFinanzer',
|
||||
isLoggedIn: 'isLoggedIn'
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
<template>
|
||||
<v-content>
|
||||
<router-view/>
|
||||
</v-content>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapActions, mapGetters } from 'vuex'
|
||||
export default {
|
||||
name: 'UserView',
|
||||
created() {
|
||||
this.getUser()
|
||||
},
|
||||
methods: {
|
||||
...mapActions({
|
||||
getUser: 'user/getUser'
|
||||
})
|
||||
},
|
||||
computed: {
|
||||
...mapGetters({
|
||||
user: 'user/user'
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
<template>
|
||||
<div>
|
||||
<SearchBar />
|
||||
<CreditLists></CreditLists>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import CreditLists from '@/components/baruser/CreditLists'
|
||||
import { mapActions } from 'vuex'
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
import axios from 'axios'
|
||||
import SearchBar from '../../components/baruser/SearchBar'
|
||||
export default {
|
||||
name: 'GeruechteView',
|
||||
components: { SearchBar, CreditLists },
|
||||
created() {},
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
methods: {
|
||||
...mapActions(['logout'])
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
Loading…
Reference in New Issue