Merge branch 'next' of groeger-clan.duckdns.org:newgeruecht-vue into next

This commit is contained in:
Tim Gröger 2021-01-29 22:53:20 +01:00
commit 059142c506
4 changed files with 91 additions and 73 deletions

View File

@ -5,7 +5,6 @@ import { Store } from 'vuex';
import { StateInterface } from 'src/store';
import { LocalStorage } from 'quasar';
import { Notify } from 'quasar';
import {Router} from 'src/router';
declare module 'vue/types/vue' {
interface Vue {
@ -17,21 +16,22 @@ export const setBaseUrl = (url: string) => {
LocalStorage.set('baseURL', url);
axios.defaults.baseURL = url;
Notify.create({
message: "Serveraddresse gespeichert",
position: "bottom",
message: 'Serveraddresse gespeichert',
position: 'bottom',
caption: `${url}`,
color: "positive"
})
setTimeout(() => {window.location.reload()}, 5000)
}
color: 'positive'
});
setTimeout(() => {
window.location.reload();
}, 5000);
};
export default boot<Store<StateInterface>>(({ Vue, store, router }) => {
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
Vue.prototype.$axios = axios;
const baseURL = <string | undefined>LocalStorage.getItem('baseURL');
if (baseURL) {
axios.defaults.baseURL = baseURL
axios.defaults.baseURL = baseURL;
} else {
axios.defaults.baseURL = config.baseURL;
}

View File

@ -35,13 +35,11 @@
<q-btn label="Login" type="submit" color="primary" tabindex="3" />
</div>
</q-form>
</q-card-section>
<div class="row justify-end">
<q-btn flat round icon="mdi-menu-down" class="cordova-only" @click="openServerSettings" />
</div>
<q-slide-transition class="cordova-only">
<div v-show="visible">
<q-separator />
<q-card-section>
@ -51,7 +49,6 @@
<q-btn size="xs" dense color="primary" label="Speichern" type="submit" />
</q-form>
</q-card-section>
</div>
</q-slide-transition>
</q-card>
@ -72,16 +69,16 @@ export default defineComponent({
const userid = ref('');
const password = ref('');
const rules = [(val: string) => (val && val.length > 0) || 'Feld darf nicht leer sein!'];
const server = ref<string|undefined>(root.$axios.defaults.baseURL)
const server = ref<string | undefined>(root.$axios.defaults.baseURL);
const visible = ref(false);
function openServerSettings() {
visible.value = !visible.value
visible.value = !visible.value;
}
function changeUrl() {
if (server.value) {
setBaseUrl(server.value)
setBaseUrl(server.value);
}
}
@ -147,7 +144,17 @@ export default defineComponent({
});
}
return { userid, password, doLogin, doReset, rules, server, changeUrl, visible, openServerSettings };
return {
userid,
password,
doLogin,
doReset,
rules,
server,
changeUrl,
visible,
openServerSettings
};
}
});
</script>

View File

@ -16,7 +16,16 @@
:loading="loading"
@request="onRequest"
binary-state-sort
/>
>
<template v-slot:top="props">
<q-toggle v-model="showCancelled" label="Stornierte einblenden" />
</template>
<template v-slot:body-cell="props">
<q-td :props="props" v-bind:class="{ 'bg-grey': props.row.reversal_id != null }">
{{ props.value }}
</q-td>
</template>
</q-table>
</q-card-section>
</q-card>
</q-page>
@ -24,7 +33,7 @@
<script lang="ts">
import { computed, defineComponent, onMounted, ref } from '@vue/composition-api';
import { StateInterfaceBalance } from '../store/balance';
import { StateInterfaceBalance, TransactionsResponse } from '../store/balance';
import { Store } from 'vuex';
import { formatDateTime } from 'src/utils/datetime';
@ -41,10 +50,11 @@ export default defineComponent({
});
});
const showCancelled = ref(false);
const data = ref<FG.Transaction[]>([]);
const loading = ref(false);
const pagination = ref({
sortBy: 'desc',
sortBy: 'time',
descending: false,
page: 1,
rowsPerPage: 3,
@ -61,34 +71,32 @@ export default defineComponent({
function onRequest(props: { pagination: PaginationInterface; filter?: string }) {
const { page, rowsPerPage, sortBy, descending } = props.pagination;
const filter = props.filter;
loading.value = true;
void store.dispatch('balance/getTransactionsCount', filter).then((value: number) => {
pagination.value.rowsNumber = value;
// get all rows if "All" (0) is selected
const fetchCount = rowsPerPage === 0 ? pagination.value.rowsNumber : rowsPerPage;
// calculate starting row of data
const startRow = (page - 1) * rowsPerPage;
// fetch data from "server"
store
.dispatch('balance/getTransactions', {
filter: { row: startRow, limit: fetchCount }
filter: {
offset: startRow,
limit: fetchCount,
showCancelled: showCancelled.value,
showReversals: false
}
})
.then((gotTransactions: FG.Transaction[]) => {
.then((result: TransactionsResponse) => {
// clear out existing data and add new
data.value.splice(0, data.value.length, ...gotTransactions);
data.value.splice(0, data.value.length, ...result.transactions);
// don't forget to update local pagination object
pagination.value.page = page;
pagination.value.rowsPerPage = rowsPerPage;
pagination.value.sortBy = sortBy;
pagination.value.descending = descending;
if (result.count) pagination.value.rowsNumber = result.count;
})
.finally(() => (loading.value = false));
});
}
const balance = computed(
@ -134,7 +142,7 @@ export default defineComponent({
}
];
return { data, pagination, onRequest, loading, balance, columns };
return { data, pagination, onRequest, loading, balance, columns, showCancelled };
}
});
</script>

View File

@ -9,6 +9,11 @@ interface BalanceResponse {
debit: number;
}
export interface TransactionsResponse {
transactions: Array<FG.Transaction>;
count?: number;
}
export interface UserBalance extends BalanceResponse {
limit: number | null;
}
@ -121,7 +126,14 @@ const actions: ActionTree<BalanceInterface, StateInterface> = {
{ commit, rootState },
payload: {
userid?: string;
filter?: { limit?: number; offset?: number; from?: Date; to?: Date };
filter?: {
limit?: number;
offset?: number;
from?: Date;
to?: Date;
showReversals?: boolean;
showCancelled?: boolean;
};
}
) {
commit('setLoading');
@ -129,22 +141,13 @@ const actions: ActionTree<BalanceInterface, StateInterface> = {
if (!payload.filter) payload.filter = { limit: 10 };
return axios
.get(`/users/${payload.userid}/balance/transactions`, { params: payload.filter || {} })
.then(({ data }: AxiosResponse<[FG.Transaction]>) => {
data.forEach(t => fixTransaction(t));
commit('addTransactions', data);
.then(({ data }: AxiosResponse<TransactionsResponse>) => {
data.transactions.forEach(t => fixTransaction(t));
commit('addTransactions', data.transactions);
return data;
})
.finally(() => commit('setLoading', false));
},
getTransactionsCount(
{ state },
payload: {
userid?: string;
filter?: { limit?: number; offset?: number; from?: Date; to?: Date };
}
) {
return Promise.resolve(3);
},
getLimit({ rootState, commit }) {
commit('setLoading');
axios