Fixed shortcuts for adding balance
This commit is contained in:
		
							parent
							
								
									ba485f87c5
								
							
						
					
					
						commit
						04237246fa
					
				|  | @ -6,15 +6,22 @@ | |||
|         <q-separator /> | ||||
| 
 | ||||
|         <q-card-section class="row q-col-gutter-md" v-if="shortCuts"> | ||||
|           <div v-for="(amount, index) in shortCuts" v-bind:key="index" class="col-4"> | ||||
|           <div :key="index" v-for="(shortcut, index) in shortCuts" class="col-4"> | ||||
|             <q-btn | ||||
|               push | ||||
|               v-if="shortcut" | ||||
|               color="primary" | ||||
|               style="width: 100%" | ||||
|               :label="amount.toFixed(2).toString() + ' €'" | ||||
|               @click="changeBalance(amount)" | ||||
|             /> | ||||
|           </div> | ||||
|         </q-card-section> | ||||
|               :label="shortcut.toFixed(2).toString() + ' €'" | ||||
|               @click="changeBalance(shortcut)" | ||||
|             > | ||||
|               <q-popup-proxy context-menu> | ||||
|                 <q-btn label="Entfernen" @click="removeShortcut(shortcut)" /> | ||||
|               </q-popup-proxy> | ||||
|               <q-tooltip>Rechtsklick um Verknüpfung zu entfernen</q-tooltip> | ||||
|             </q-btn> | ||||
|           </div></q-card-section | ||||
|         > | ||||
|         <q-card-section class="row q-col-gutter-md items-center"> | ||||
|           <div class="col-sm-4 col-xs-12"> | ||||
|             <q-input | ||||
|  | @ -34,8 +41,9 @@ | |||
|               @click="changeBalance(amount * -1)" | ||||
|               ><q-tooltip>Rechtsklick um Betrag als Verknüpfung hinzuzufügen</q-tooltip> | ||||
|               <q-popup-proxy context-menu v-model="showAddShortcut"> | ||||
|                 <q-btn label="neue Verknüpfung" @click="addShortcut" /></q-popup-proxy | ||||
|             ></q-btn> | ||||
|                 <q-btn label="neue Verknüpfung" @click="addShortcut"></q-btn> | ||||
|               </q-popup-proxy> | ||||
|             </q-btn> | ||||
|           </div> | ||||
|           <div class="col-sm-4 col-xs-6"> | ||||
|             <q-btn | ||||
|  | @ -55,8 +63,6 @@ | |||
| </template> | ||||
| 
 | ||||
| <script lang="ts"> | ||||
| // TODO: Shortcuts are not displayed when first loaded | ||||
| 
 | ||||
| import { computed, ref, defineComponent, onBeforeMount } from '@vue/composition-api'; | ||||
| import { hasPermission } from 'src/utils/permission'; | ||||
| import { StateInterfaceBalance } from '../store/balance'; | ||||
|  | @ -83,9 +89,10 @@ export default defineComponent({ | |||
|     ); | ||||
| 
 | ||||
|     function addShortcut() { | ||||
|       // TODO: Save shortcuts on backend | ||||
|       showAddShortcut.value = false; | ||||
|       console.log(amount); | ||||
|       void store.dispatch('balance/addShortcut', amount.value * -1); | ||||
|     } | ||||
|     function removeShortcut(shortcut: number) { | ||||
|       void store.dispatch('balance/removeShortcut', shortcut); | ||||
|     } | ||||
|     function userUpdated(selectedUser: FG.User) { | ||||
|       user.value = selectedUser; | ||||
|  | @ -109,6 +116,7 @@ export default defineComponent({ | |||
|     return { | ||||
|       user, | ||||
|       addShortcut, | ||||
|       removeShortcut, | ||||
|       showAddShortcut, | ||||
|       changeBalance, | ||||
|       transactions, | ||||
|  |  | |||
|  | @ -52,11 +52,28 @@ const mutations: MutationTree<BalanceInterface> = { | |||
|     else state.loading -= 1; | ||||
|   }, | ||||
|   setShortcuts(state, data: Array<number>) { | ||||
|     state.shortcuts = data.sort().reverse(); | ||||
|     state.shortcuts.splice(0, state.shortcuts.length, ...data); | ||||
|   } | ||||
| }; | ||||
| 
 | ||||
| const actions: ActionTree<BalanceInterface, StateInterface> = { | ||||
|   addShortcut({ commit, state, rootState }, shortcut) { | ||||
|     const sc = [...state.shortcuts, shortcut]; | ||||
|     sc.sort().reverse(); | ||||
| 
 | ||||
|     const user = <FG.User>rootState.user.currentUser; | ||||
|     return axios.put(`/users/${user.userid}/balance/shortcuts`, sc).then(() => { | ||||
|       commit('setShortcuts', sc); | ||||
|     }); | ||||
|   }, | ||||
|   removeShortcut({ commit, state, rootState }, shortcut) { | ||||
|     const sc = state.shortcuts.filter((value: number) => value != shortcut); | ||||
| 
 | ||||
|     const user = <FG.User>rootState.user.currentUser; | ||||
|     return axios.put(`/users/${user.userid}/balance/shortcuts`, sc).then(() => { | ||||
|       commit('setShortcuts', sc); | ||||
|     }); | ||||
|   }, | ||||
|   getShortcuts({ commit, state, rootState }, force = false) { | ||||
|     if (force || state.shortcuts.length == 0) { | ||||
|       commit('setLoading'); | ||||
|  |  | |||
		Loading…
	
		Reference in New Issue