[Balance] Bereich zum Hinzufügen von Schulden

Es können auch schon schulden hinzugefügt werden.
This commit is contained in:
Tim Gröger 2020-10-31 21:30:02 +01:00
parent ef71481931
commit 3247a5bb01
7 changed files with 236 additions and 56 deletions

View File

@ -1,6 +1,6 @@
import { boot } from 'quasar/wrappers';
import { RouteConfig } from 'vue-router';
import { Module, Store } from 'vuex';
import { Store } from 'vuex';
import { StateInterface } from 'src/store';
import { FG_Plugin } from 'src/plugins';
import routes from 'src/router/routes';

View File

@ -1,22 +1,28 @@
<template>
<q-item clickable tag="a" target="self" :to="{ name: link }" v-if="hasPermissions">
<q-item
clickable
tag="a"
target="self"
:to="{ name: link }"
v-if="hasPermissions"
>
<q-item-section v-if="icon" avatar>
<q-icon :name="icon" />
</q-item-section>
<q-item-section>
<q-item-label>{{ realTitle }}</q-item-label>
<q-item-label caption>
{{ permissions }}
</q-item-label>
<!--<q-item-label caption>
{{ caption }}
</q-item-label>-->
</q-item-section>
</q-item>
</template>
<script lang="ts">
import { computed, defineComponent } from '@vue/composition-api';
import {Store} from 'vuex'
import {StateInterface} from "src/store";
import { Store } from 'vuex';
import { StateInterface } from 'src/store';
export default defineComponent({
name: 'EssentialLink',
@ -60,14 +66,16 @@ export default defineComponent({
});
const hasPermissions = computed(() => {
let permissions = props.permissions
let permissions = props.permissions;
if (permissions) {
return (<string[]>permissions).every(permission => {
return (<{'user/permissions': string[]}>(<Store<StateInterface>>root.$store).getters)['user/permissions'].includes(permission)
})
return (<{ 'user/permissions': string[] }>(
(<Store<StateInterface>>root.$store).getters
))['user/permissions'].includes(permission);
});
}
return true
})
return true;
});
return { realTitle: title, hasPermissions };
}

View File

@ -4,8 +4,9 @@
<script lang="ts">
import { computed, defineComponent } from '@vue/composition-api';
import {Store} from "vuex";
import {StateInterface} from "src/store";
import { Store } from 'vuex';
import { StateInterface } from 'src/store';
export default defineComponent({
name: 'ShortCutLink',
props: {
@ -22,17 +23,18 @@ export default defineComponent({
}
},
setup(props, { root }) {
const hasPermissions = computed(() => {
let permissions = props.permissions
let permissions = props.permissions;
if (permissions) {
return (<string[]>permissions).every(permission => {
return (<{'user/permissions': string[]}>(<Store<StateInterface>>root.$store).getters)['user/permissions'].includes(permission)
})
return (<{ 'user/permissions': string[] }>(
(<Store<StateInterface>>root.$store).getters
))['user/permissions'].includes(permission);
});
}
return true
})
return {hasPermissions}
return true;
});
return { hasPermissions };
}
});
</script>

View File

@ -1,12 +1,95 @@
<template>
<q-page padding>
<h1>Add works</h1>
<q-card>
<q-card-section class="row">
<div class="col-4 row q-pa-sm">
<q-btn
class="col"
color="green"
label="2€"
@click="changeBalance(-2)"
/>
</div>
<div class="col-4 row q-pa-sm">
<q-btn
class="col"
color="green"
label="1€"
@click="changeBalance(-1)"
/>
</div>
<div class="col-4 row q-pa-sm">
<q-btn
class="col"
color="green"
label="0,50€"
@click="changeBalance(-0.5)"
/>
</div>
<div class="col-4 row q-pa-sm">
<q-btn
class="col"
color="green"
label="0,40€"
@click="changeBalance(-0.4)"
/>
</div>
<div class="col-4 row q-pa-sm">
<q-btn
class="col"
color="green"
label="0,20€"
@click="changeBalance(-0.2)"
/>
</div>
<div class="col-4 row q-pa-sm">
<q-btn
class="col"
color="green"
label="0,10€"
@click="changeBalance(-0.1)"
/>
</div>
</q-card-section>
<q-card-section>
<div class="text-h6">{{ balance.toFixed(2) }} </div>
</q-card-section>
<q-card-actions>
<q-btn label="test" @click="$store.dispatch('balance/getBalance')" />
</q-card-actions>
</q-card>
</q-page>
</template>
<script lang="ts">
import { defineComponent } from '@vue/composition-api'
import { computed, defineComponent, onBeforeMount } from '@vue/composition-api';
import { BalanceInterface } from 'src/plugins/balance/store/balance';
import { Store } from 'vuex';
export default defineComponent({
// name: 'PageName'
})
setup(_, { root }) {
onBeforeMount(() => {
store.dispatch('balance/getBalance').catch(err => {
console.warn(err);
});
});
const store: Store<{ balance: BalanceInterface }> = <
Store<{ balance: BalanceInterface }>
>root.$store;
const balance = computed<number>(() => {
return store.state.balance.balance;
});
function changeBalance(amount: number) {
store
.dispatch('balance/changeBalance', amount)
.catch(err => console.log(err));
}
return { balance, changeBalance };
}
});
</script>

View File

@ -1,13 +1,17 @@
import { Module } from 'vuex';
import {StateInterface} from "src/store";
import mainRoutes from "./routes"
import { StateInterface } from 'src/store';
import mainRoutes from './routes';
import { FG_Plugin } from 'src/plugins';
import balance, { BalanceInterface } from './store/balance';
const plugin: FG_Plugin.Plugin = {
name: 'Balance',
mainRoutes,
requiredModules: ['User'],
version: '0.0.1',
}
store: new Map<string, Module<BalanceInterface, StateInterface>>([
['balance', balance]
])
};
export default plugin;

View File

@ -2,21 +2,21 @@ import {FG_Plugin} from 'src/plugins';
const permissions = {
// Show own and others balance
SHOW: "balance_show",
SHOW_OTHER: "balance_show_others",
SHOW: 'balance_show',
SHOW_OTHER: 'balance_show_others',
// Credit balance
ADD: "balance_add",
ADD: 'balance_add',
// Debit balance
SUB: "balance_sub",
SUB: 'balance_sub',
// Send from to other
SEND: "balance_send",
SEND: 'balance_send',
// Send from other to another
SEND_OTHER: "balance_send_others",
SEND_OTHER: 'balance_send_others',
// Can set limit for users
SET_LIMIT: "balance_set_limit",
SET_LIMIT: 'balance_set_limit',
//Allow sending / sub while exceeding the set limit
EXCEED_LIMIT: "balance_exceed_limit"
}
EXCEED_LIMIT: 'balance_exceed_limit'
};
const mainRoutes: FG_Plugin.PluginRouteConfig[] = [
{
@ -33,11 +33,11 @@ const mainRoutes: FG_Plugin.PluginRouteConfig[] = [
path: 'balance-add',
name: 'balance-add',
shortcut: true,
meta: {permissions: [permissions.ADD, permissions.SHOW]},
meta: { permissions: [permissions.SUB, permissions.SHOW] },
component: () => import('../pages/Add.vue')
}
]
}
]
];
export default mainRoutes
export default mainRoutes;

View File

@ -0,0 +1,83 @@
import { Module, MutationTree, ActionTree, GetterTree } from 'vuex';
import { StateInterface } from 'src/store';
import { axios } from 'src/boot/axios';
import { AxiosResponse } from 'axios';
interface BalanceResponse {
balance: number;
credit: number;
debit: number;
}
export interface BalanceInterface extends BalanceResponse {
limit: number;
}
const state: BalanceInterface = {
balance: 0,
credit: 0,
debit: 0,
limit: 0
};
const mutations: MutationTree<BalanceInterface> = {
setBalance(state, data: number) {
state.balance = data;
},
setCredit(state, data: number) {
state.credit = data;
},
setDebit(state, data: number) {
state.debit = data;
},
setLimit(state, data: number) {
state.limit = data;
}
};
const actions: ActionTree<BalanceInterface, StateInterface> = {
getBalance({ commit, rootState }) {
axios
.get(`/users/${rootState.user.user.userid}/balance`)
.then(({ data }: AxiosResponse<BalanceResponse>) => {
commit('setBalance', data.balance);
commit('setCredit', data.credit);
commit('setDebit', data.debit);
})
.catch(err => {
console.warn(err);
});
},
getLimit({ rootState }) {
axios
.get(`/users/${rootState.user.user.userid}/balance/limit`)
.then(({ data }) => {
console.log(data);
})
.catch(err => {
console.warn(err);
});
},
changeBalance({ rootState, dispatch }, amount: number) {
axios
.put(`/users/${rootState.user.user.userid}/balance`, <{ amount: number }>{
amount: amount
})
.then(() => {
dispatch('getBalance').catch(err => console.warn(err));
})
.catch(err => console.warn(err));
}
};
const getters: GetterTree<BalanceInterface, StateInterface> = {};
const balance: Module<BalanceInterface, StateInterface> = {
namespaced: true,
state,
mutations,
actions,
getters
};
export default balance;