Flaschengeist/flaschengeist-frontend
Flaschengeist
/
flaschengeist-frontend
7
0
Fork 1
Code Issues Pull Requests Projects Releases Activity

Merge remote-tracking branch 'origin/feature/useroptions' into feature/useroptions 

# Conflicts:
#	src/plugins/routes.js
This commit is contained in:
Tim Gröger 2020-01-26 23:57:00 +01:00
parent 7d27421659 23d24658cf
commit 743018e9ed
7 changed files with 303 additions and 185 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/finanzer/Overview.vue
View File

@ -66,7 +66,8 @@
</v-expand-transition>
</v-card>
</v-expand-transition>
<TableSkeleton v-if="loading" />
<v-progress-linear v-if="loading && users.length !== 0" indeterminate />
<TableSkeleton v-if="loading && users.length === 0" />
<div v-for="user in users" :key="users.indexOf(user)">
<v-card
v-if="user.creditList[year] && isFiltered(user)"

82
src/components/finanzer/Skeleton/UserSkeleton.vue Normal file
View File

@ -0,0 +1,82 @@
<template>
<div>
<v-toolbar tile>
<v-toolbar-title>
<v-row>
<v-col>
<v-skeleton-loader type="chip" />
</v-col>
<v-col>
<v-skeleton-loader type="chip" />
</v-col>
</v-row>
</v-toolbar-title>
<v-spacer />
<v-toolbar-items>
<v-skeleton-loader type="button" />
</v-toolbar-items>
</v-toolbar>
<v-card style="margin-top: 3px;">
<v-card-title><v-skeleton-loader type="heading"/></v-card-title>
<v-card-text>
<v-form style="margin-left: 15px; margin-right: 15px">
<v-row>
<v-col>
<v-skeleton-loader type="chip" />
</v-col>
<v-col>
<v-skeleton-loader type="chip" />
</v-col>
<v-col>
<v-skeleton-loader type="button" />
</v-col>
</v-row>
<v-divider style="margin-bottom: 15px;" />
<v-row>
<v-col>
<v-skeleton-loader type="chip" />
</v-col>
<v-col>
<v-skeleton-loader type="chip" />
</v-col>
</v-row>
<v-row>
<v-skeleton-loader type="button" />
</v-row>
</v-form>
</v-card-text>
</v-card>
<v-card style="margin-top: 3px;">
<v-card-title><v-skeleton-loader type="chip"/></v-card-title>
<v-card-text>
<v-form style="margin-left: 15px; margin-right: 15px">
<v-row>
<v-col>
<v-skeleton-loader type="chip" />
</v-col>
<v-col>
<v-skeleton-loader type="chip" />
</v-col>
</v-row>
<v-row>
<v-col>
<v-skeleton-loader type="chip" />
</v-col>
<v-col>
<v-skeleton-loader type="chip" />
</v-col>
</v-row>
</v-form>
<v-skeleton-loader type="button" />
</v-card-text>
</v-card>
</div>
</template>
<script>
export default {
name: 'UserSkeleton'
}
</script>
<style scoped></style>

352
src/components/finanzer/User.vue
View File

@ -1,194 +1,207 @@
<template>
<v-content v-if="activeUser">
<v-toolbar tile>
<v-toolbar-title>{{ activeUser.lastname }}, {{ activeUser.firstname }}</v-toolbar-title>
<v-spacer />
<v-toolbar-items>
<v-btn @click="sendMail({ username: activeUser.username })" text>Email senden</v-btn>
</v-toolbar-items>
</v-toolbar>
<v-expand-transition>
<v-card style="margin-top: 3px" v-show="errorMail">
<v-alert dense :type="computeError(errorMail)">
{{
errorMessage(errorMail)
}}
</v-alert>
</v-card>
</v-expand-transition>
<v-card style="margin-top: 3px;">
<v-card-title>Konfiguration</v-card-title>
<v-card-text>
<v-form style="margin-left: 15px; margin-right: 15px">
<v-row>
<v-col>
<v-label>Status:</v-label>
</v-col>
<v-col>
<v-chip
outlined
:text-color="getLockedColor(activeUser.locked)"
>{{ activeUser.locked ? 'Gesperrt' : 'nicht Gesperrt' }}</v-chip>
</v-col>
<v-col>
<v-btn
@click="
doLock({ user: activeUser, locked: !activeUser.locked })
"
>{{ activeUser.locked ? 'Entperren' : 'Sperren' }}</v-btn>
</v-col>
</v-row>
<v-divider style="margin-bottom: 15px;" />
<v-row>
<v-col>
<v-text-field
:rules="[isNumber]"
label="Betrag des Sperrlimits in € (EURO)"
v-model="limit"
></v-text-field>
</v-col>
<v-col>
<v-select
return-object
v-model="autoLock"
label="Automatische Sperre"
:items="[
{ value: true, text: 'Aktiviert' },
{ value: false, text: 'Deaktiviert' }
]"
item-text="text"
item-value="value"
/>
</v-col>
</v-row>
<v-row>
<v-btn
block
@click="
saveConfig({
user: activeUser,
limit: limit,
autoLock: autoLock.value
})
"
>Speichern</v-btn>
</v-row>
</v-form>
</v-card-text>
</v-card>
<v-card style="margin-top: 3px;">
<v-card-title>Geld transferieren</v-card-title>
<v-card-text>
<v-form style="margin-left: 15px; margin-right: 15px">
<v-row>
<v-col>
<v-text-field :rules="[isNumber]" label="Betrag" v-model="amount"></v-text-field>
</v-col>
<v-col>
<v-select
return-object
v-model="type"
label="Typ"
:items="[
{ value: 'amount', text: 'Schulden' },
{ value: 'credit', text: 'Guthaben' }
]"
item-text="text"
item-value="value"
></v-select>
</v-col>
</v-row>
<v-row>
<v-col>
<v-select
return-object
v-model="selectedYear"
label="Jahr"
:items="selectYears"
item-text="text"
item-value="value"
></v-select>
</v-col>
<v-col>
<v-select
return-object
v-model="selectedMonth"
label="Monat"
:items="months"
item-text="text"
item-value="value"
></v-select>
</v-col>
</v-row>
</v-form>
<v-btn block @click="add">Hinzufügen</v-btn>
</v-card-text>
</v-card>
<div v-for="year in years" :key="years.indexOf(year)">
<div>
<v-content v-if="loading" >
<UserSkeleton />
</v-content>
<v-content v-if="activeUser">
<v-toolbar tile>
<v-toolbar-title
>{{ activeUser.lastname }},
{{ activeUser.firstname }}</v-toolbar-title
>
<v-spacer />
<v-toolbar-items>
<v-btn @click="sendMail({ username: activeUser.username })" text
>Email senden</v-btn
>
</v-toolbar-items>
</v-toolbar>
<v-progress-linear v-if="activeUser.loading" indeterminate />
<v-expand-transition>
<v-card style="margin-top: 3px" v-show="errorMail">
<v-alert dense :type="computeError(errorMail)">
{{ errorMessage(errorMail) }}
</v-alert>
</v-card>
</v-expand-transition>
<v-card style="margin-top: 3px;">
<v-card-title>{{ year }}</v-card-title>
<Table v-bind:user="activeUser" v-bind:year="year" />
<v-container fluid>
<v-col>
<v-card-title>Konfiguration</v-card-title>
<v-card-text>
<v-form style="margin-left: 15px; margin-right: 15px">
<v-row>
<v-col>
<v-label>Vorjahr:</v-label>
<v-label>Status:</v-label>
</v-col>
<v-col>
<v-chip
outlined
:text-color="
getLastColor(activeUser.creditList[year][1].last)
"
>
{{
(activeUser.creditList[year][1].last / 100).toFixed(2)
}}
<v-chip outlined :text-color="getLockedColor(activeUser.locked)"
>{{ activeUser.locked ? 'Gesperrt' : 'nicht Gesperrt' }}
</v-chip>
</v-col>
<v-col>
<v-label>Gesamt:</v-label>
</v-col>
<v-col>
<v-chip
outlined
x-large
:text-color="
getLastColor(
getAllSum(
activeUser.creditList[year][2].sum,
activeUser.creditList[year][1].last
)
)
<v-btn
@click="
doLock({ user: activeUser, locked: !activeUser.locked })
"
>
{{
(
getAllSum(
activeUser.creditList[year][2].sum,
activeUser.creditList[year][1].last
) / 100
).toFixed(2)
}}
</v-chip>
>{{ activeUser.locked ? 'Entperren' : 'Sperren' }}
</v-btn>
</v-col>
</v-row>
</v-col>
</v-container>
<v-divider style="margin-bottom: 15px;" />
<v-row>
<v-col>
<v-text-field
:rules="[isNumber]"
label="Betrag des Sperrlimits in € (EURO)"
v-model="limit"
></v-text-field>
</v-col>
<v-col>
<v-select
return-object
v-model="autoLock"
label="Automatische Sperre"
:items="[
{ value: true, text: 'Aktiviert' },
{ value: false, text: 'Deaktiviert' }
]"
item-text="text"
item-value="value"
/>
</v-col>
</v-row>
<v-row>
<v-btn
block
@click="
saveConfig({
user: activeUser,
limit: limit,
autoLock: autoLock.value
})
"
>Speichern
</v-btn>
</v-row>
</v-form>
</v-card-text>
</v-card>
</div>
</v-content>
<v-card style="margin-top: 3px;">
<v-card-title>Geld transferieren</v-card-title>
<v-card-text>
<v-form style="margin-left: 15px; margin-right: 15px">
<v-row>
<v-col>
<v-text-field
:rules="[isNumber]"
label="Betrag"
v-model="amount"
></v-text-field>
</v-col>
<v-col>
<v-select
return-object
v-model="type"
label="Typ"
:items="[
{ value: 'amount', text: 'Schulden' },
{ value: 'credit', text: 'Guthaben' }
]"
item-text="text"
item-value="value"
></v-select>
</v-col>
</v-row>
<v-row>
<v-col>
<v-select
return-object
v-model="selectedYear"
label="Jahr"
:items="selectYears"
item-text="text"
item-value="value"
></v-select>
</v-col>
<v-col>
<v-select
return-object
v-model="selectedMonth"
label="Monat"
:items="months"
item-text="text"
item-value="value"
></v-select>
</v-col>
</v-row>
</v-form>
<v-btn block @click="add">Hinzufügen</v-btn>
</v-card-text>
</v-card>
<div v-for="year in years" :key="years.indexOf(year)">
<v-card style="margin-top: 3px;">
<v-card-title>{{ year }}</v-card-title>
<Table v-bind:user="activeUser" 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(activeUser.creditList[year][1].last)
"
>
{{ (activeUser.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(
activeUser.creditList[year][2].sum,
activeUser.creditList[year][1].last
)
)
"
>
{{
(
getAllSum(
activeUser.creditList[year][2].sum,
activeUser.creditList[year][1].last
) / 100
).toFixed(2)
}}
</v-chip>
</v-col>
</v-row>
</v-col>
</v-container>
</v-card>
</div>
</v-content>
</div>
</template>
<script>
import Table from './Table'
import { mapGetters, mapActions } from 'vuex'
import UserSkeleton from "./Skeleton/UserSkeleton";
export default {
name: 'User',
props: {
id: String
},
components: { Table },
components: {UserSkeleton, Table },
data() {
return {
isNumber: value => !isNaN(value) || 'Betrag muss eine Zahl sein.',
@ -328,7 +341,8 @@ export default {
activeUser: 'finanzerUsers/activeUser',
errorMail: 'finanzerUsers/errorMail',
months: 'finanzerUsers/months',
selectYears: 'finanzerUsers/selectYears'
selectYears: 'finanzerUsers/selectYears',
loading: 'finanzerUsers/addUserLoading'
})
},
watch: {

10
src/store/modules/barUsers.js
View File

@ -89,7 +89,7 @@ const actions = {
commit('setUsersLoading', false)
},
async addAmount({ commit, rootState, dispatch }, data) {
commit('updateUser', {username: data.username, loading: true})
commit('updateUser', { username: data.username, loading: true })
try {
const response = await axios.post(
url.barAddAmount,
@ -101,10 +101,10 @@ const actions = {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
commit('updateUser', {username: data.username, loading: false})
commit('updateUser', { username: data.username, loading: false })
},
async addCreditList({ commit, rootState, dispatch }, data) {
commit('updateUser', {username: data.username, loading: true})
commit('updateUser', { username: data.username, loading: true })
try {
const response = await axios.post(
url.barGetUser,
@ -116,7 +116,7 @@ const actions = {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
commit('updateUser', {username: data.username, loading: false})
commit('updateUser', { username: data.username, loading: false })
},
async getAllUsers({ commit, rootState, dispatch }) {
commit('setAllUsersLoading', true)
@ -153,7 +153,7 @@ const getters = {
},
allUsersLoading: state => {
return state.allUsersLoading
},
}
}
export default {

31
src/store/modules/finanzerUsers.js
View File

@ -26,7 +26,9 @@ const state = {
{ value: 12, text: 'Dezember' }
],
allUsersLoading: false,
usersLoading: false
usersLoading: false,
emailLoading: false,
addUserLoading: false
}
const mutations = {
@ -227,6 +229,12 @@ const mutations = {
},
setUsersLoading: (state, value) => {
state.usersLoading = value
},
setEMailLoading: (state, value) => {
state.emailLoading = value
},
setAddUserLoading: (state, value) => {
state.addUserLoading = value
}
}
@ -267,7 +275,7 @@ const actions = {
commit('setActiveUser', username)
},
async addAmount({ commit, rootState, dispatch }, data) {
commit('updateUsers', {username: data.user.username, loading: true})
commit('updateUsers', { username: data.user.username, loading: true })
try {
const response = await axios.post(
url.finanzerAddAmount,
@ -291,10 +299,10 @@ const actions = {
if (err.response.status === 401)
dispatch('logout', null, { root: true })
}
commit('updateUsers', {username: data.user.username, loading: false})
commit('updateUsers', { username: data.user.username, loading: false })
},
async addCredit({ commit, rootState, dispatch }, data) {
commit('updateUsers', {username: data.user.username, loading: true})
commit('updateUsers', { username: data.user.username, loading: true })
try {
const response = await axios.post(
url.finanzerAddCredit,
@ -318,9 +326,10 @@ const actions = {
if (err.response.status === 401)
dispatch('logout', null, { root: true })
}
commit('updateUsers', {username: data.user.username, loading: false})
commit('updateUsers', { username: data.user.username, loading: false })
},
async doLock({ commit, rootState, dispatch }, data) {
commit('updateUsers', { username: data.user.username, loading: true })
try {
const response = await axios.post(
url.lockUser,
@ -332,8 +341,10 @@ const actions = {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
commit('updateUsers', { username: data.user.username, loading: false })
},
async saveConfig({ commit, rootState, dispatch }, data) {
commit('updateUsers', { username: data.user.username, loading: true })
try {
const response = await axios.post(
url.finanzerSetConfig,
@ -349,8 +360,10 @@ const actions = {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
commit('updateUsers', { username: data.user.username, loading: false })
},
async addUser({ commit, rootState, dispatch }, data) {
commit('setAddUserLoading', true)
try {
const response = await axios.post(
url.finanzerAddUser,
@ -362,8 +375,10 @@ const actions = {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
commit('setAddUserLoading', false)
},
async sendMails({ commit, rootState, dispatch }) {
commit('setEMailLoading', true)
try {
const response = await axios.get(url.finanzerSendAllMail, {
headers: { Token: rootState.login.user.accessToken }
@ -373,8 +388,10 @@ const actions = {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
commit('setEMailLoading', false)
},
async sendMail({ commit, rootState, dispatch }, data) {
commit('updateUsers', { username: data.username, loading: true })
try {
const response = await axios.post(
url.finanzerSendOneMail,
@ -386,6 +403,7 @@ const actions = {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
commit('updateUsers', { username: data.username, loading: false })
},
createYears({ commit }) {
commit('setYears')
@ -434,6 +452,9 @@ const getters = {
},
usersLoading: state => {
return state.usersLoading
},
addUserLoading: state => {
return state.addUserLoading
}
}

6
src/store/modules/serviceManagement.js
View File

@ -248,10 +248,10 @@ const actions = {
}
},
setDayLoading({ commit, getters }, date) {
commit('setDayLoading', {date, getters})
commit('setDayLoading', { date, getters })
},
setDayNotLoading({commit, getters}, date) {
commit('setDayNotLoading', {date, getters})
setDayNotLoading({ commit, getters }, date) {
commit('setDayNotLoading', { date, getters })
}
}
const getters = {

4
src/store/modules/user.js
View File

@ -136,7 +136,7 @@ const mutations = {
const actions = {
async getUser({ commit, rootState, dispatch }) {
commit("setLoading", true)
commit('setLoading', true)
try {
const response = await axios.get(url.userMain, {
headers: { Token: rootState.login.user.accessToken }
@ -147,7 +147,7 @@ const actions = {
if (e.response)
if (e.response.status === 401) dispatch('logout', null, { root: true })
}
commit("setLoading", false)
commit('setLoading', false)
},
async addAmount({ commit, rootState, dispatch }, amount) {
commit('setAddLoading', true)