[Vue3] fixed some errors. first steps to reconstruct storage

This commit is contained in:
Tim Gröger 2021-01-31 20:40:18 +01:00 committed by Ferdinand Thiessen
parent 152b86fb4f
commit 8f8da5ffd1
19 changed files with 150 additions and 84 deletions

View File

@ -233,7 +233,8 @@ export default boot<UserSessionState>(({ router, store, app }) => {
}; };
// get all plugins // get all plugins
const pluginsContext = require.context('src/plugins', true, /.+\/plugin.ts$/); //const pluginsContext = require.context('src/plugins', true, /.+\/plugin.ts$/);
const pluginsContext = require['context']('src/plugins', true, /.+\/plugin.ts$/);
pluginsContext.keys().forEach((fileName: string) => { pluginsContext.keys().forEach((fileName: string) => {
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
plugins.push(pluginsContext(fileName).default); plugins.push(pluginsContext(fileName).default);
@ -298,5 +299,6 @@ export default boot<UserSessionState>(({ router, store, app }) => {
loadedPlugins.routes.forEach((route) => router.addRoute(route)); loadedPlugins.routes.forEach((route) => router.addRoute(route));
// save plugins in VM-variable // save plugins in VM-variable
console.log(store);
app.provide('flaschengeistPlugins', loadedPlugins); app.provide('flaschengeistPlugins', loadedPlugins);
}); });

View File

@ -63,33 +63,43 @@
<script lang="ts"> <script lang="ts">
import { computed, ref, defineComponent, onBeforeMount } from 'vue'; import { computed, ref, defineComponent, onBeforeMount } from 'vue';
import { hasPermission } from 'src/utils/permission'; import { hasPermission } from 'src/utils/permission';
import { StateInterfaceBalance } from '../store/balance'; import { BalanceInterface, StateInterfaceBalance } from '../store/balance';
import { Store } from 'vuex'; import { Store, useStore, mapGetters } from 'vuex';
import BalanceHeader from '../components/BalanceHeader.vue'; import BalanceHeader from '../components/BalanceHeader.vue';
import PERMISSIONS from '../permissions'; import PERMISSIONS from '../permissions';
import { UserStateInterface } from 'src/plugins/user/store/user';
import { StateInterface } from 'src/store';
export default defineComponent({ export default defineComponent({
name: 'BalanceAdd', name: 'BalanceAdd',
components: { BalanceHeader }, components: { BalanceHeader },
setup(_, { root, emit }) { setup(_, { emit }) {
onBeforeMount(() => { onBeforeMount(() => {
void store.dispatch('balance/getShortcuts'); void store.dispatch('balance/getShortcuts');
if (store.state.balance.transactions.length == 0) if ((<FG.Transaction[]>balanceGatters.transactions())?.length == 0)
// No transaction, load at most six since yesterday // No transaction, load at most six since yesterday
void store.dispatch('balance/getTransactions', { void store.dispatch('balance/getTransactions', {
filter: { limit: 6, from: new Date(new Date().setDate(new Date().getDate() - 1)) }, filter: { limit: 6, from: new Date(new Date().setDate(new Date().getDate() - 1)) },
}); });
}); });
const store = <Store<StateInterfaceBalance>>root.$store; //const store = <Store<StateInterfaceBalance>>root.$store;
const store = useStore<Store<StateInterface>>();
const userStore = useStore<Store<UserStateInterface>>();
//const userState = <UserStateInterface>store.state.user;
//const balanceState = <BalanceInterface>store.state.balance;
const userGetters = mapGetters('users', ['currentUser', 'roles', 'users']);
const balanceGatters = mapGetters('balance', ['balances', 'transactions', 'shortcuts']);
const amount = ref<number>(0); const amount = ref<number>(0);
const showAddShortcut = ref(false); const showAddShortcut = ref(false);
const user = ref(store.state.user.currentUser); //const user = ref(userState.currentUser);
const shortCuts = ref(store.state.balance.shortcuts); const user = computed(() => <FG.User>userGetters.currentUser());
//const shortCuts = ref(balanceState.shortcuts);
const shortCuts = computed(() => <number[]>balanceGatters.shortcuts());
const canAddCredit = computed(() => hasPermission(PERMISSIONS.CREDIT, store)); const canAddCredit = computed(() => hasPermission(PERMISSIONS.CREDIT));
const showSelector = computed( const showSelector = computed(
() => hasPermission(PERMISSIONS.DEBIT, store) || hasPermission(PERMISSIONS.CREDIT, store) () => hasPermission(PERMISSIONS.DEBIT) || hasPermission(PERMISSIONS.CREDIT)
); );
function addShortcut() { function addShortcut() {
@ -99,7 +109,8 @@ export default defineComponent({
void store.dispatch('balance/removeShortcut', shortcut); void store.dispatch('balance/removeShortcut', shortcut);
} }
function userUpdated(selectedUser: FG.User) { function userUpdated(selectedUser: FG.User) {
user.value = selectedUser; //TODO:
//user.value = selectedUser;
} }
function changeBalance(amount: number) { function changeBalance(amount: number) {
store store

View File

@ -17,7 +17,9 @@
import { ref, computed, defineComponent, onBeforeMount } from 'vue'; import { ref, computed, defineComponent, onBeforeMount } from 'vue';
import UserSelector from 'src/plugins/user/components/UserSelector.vue'; import UserSelector from 'src/plugins/user/components/UserSelector.vue';
import { StateInterfaceBalance } from '../store/balance'; import { StateInterfaceBalance } from '../store/balance';
import { Store } from 'vuex'; import { Store, useStore } from 'vuex';
import { UserStateInterface } from 'src/plugins/user/store/user';
import { StateInterface } from 'src/store';
interface Props { interface Props {
showSelector: boolean; showSelector: boolean;
@ -29,7 +31,9 @@ export default defineComponent({
props: ['showSelector'], props: ['showSelector'],
setup(props: Props, { root, emit }) { setup(props: Props, { root, emit }) {
onBeforeMount(() => void store.dispatch('balance/getBalance')); onBeforeMount(() => void store.dispatch('balance/getBalance'));
const store = <Store<StateInterfaceBalance>>root.$store; //const store = <Store<StateInterfaceBalance>>root.$store;
const store = useStore<StateInterfaceBalance>();
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
const user = ref(<FG.User>store.state.user.currentUser); const user = ref(<FG.User>store.state.user.currentUser);
const balance = computed(() => { const balance = computed(() => {
const balances = store.state.balance.balances; const balances = store.state.balance.balances;
@ -43,10 +47,12 @@ export default defineComponent({
function userUpdated(selectedUser: FG.User) { function userUpdated(selectedUser: FG.User) {
void store.dispatch('balance/getBalance', selectedUser); void store.dispatch('balance/getBalance', selectedUser);
user.value = selectedUser; user.value = selectedUser;
// eslint-disable-next-line @typescript-eslint/no-unsafe-call
emit('update:user', selectedUser); emit('update:user', selectedUser);
} }
function openHistory() { function openHistory() {
// eslint-disable-next-line @typescript-eslint/no-unsafe-call
emit('open-history'); emit('open-history');
} }

View File

@ -30,19 +30,22 @@
import { computed, ref, defineComponent } from 'vue'; import { computed, ref, defineComponent } from 'vue';
import { hasPermission } from 'src/utils/permission'; import { hasPermission } from 'src/utils/permission';
import { StateInterfaceBalance } from '../store/balance'; import { StateInterfaceBalance } from '../store/balance';
import { Store } from 'vuex'; import { Store, useStore } from 'vuex';
import UserSelector from 'src/plugins/user/components/UserSelector.vue'; import UserSelector from 'src/plugins/user/components/UserSelector.vue';
import BalanceHeader from '../components/BalanceHeader.vue'; import BalanceHeader from '../components/BalanceHeader.vue';
import PERMISSIONS from '../permissions'; import PERMISSIONS from '../permissions';
import { UserStateInterface } from 'src/plugins/user/store/user';
export default defineComponent({ export default defineComponent({
name: 'BalanceTransfer', name: 'BalanceTransfer',
components: { BalanceHeader, UserSelector }, components: { BalanceHeader, UserSelector },
setup(_, { root, emit }) { setup(_, { root, emit }) {
const store: Store<StateInterfaceBalance> = <Store<StateInterfaceBalance>>root.$store; //const store: Store<StateInterfaceBalance> = <Store<StateInterfaceBalance>>root.$store;
const store = useStore<Store<StateInterface>>();
const userState = <UserStateInterface>store.state.user;
const showSelector = computed(() => hasPermission(PERMISSIONS.SEND_OTHER, store)); const showSelector = computed(() => hasPermission(PERMISSIONS.SEND_OTHER, store));
const sender = ref(store.state.user.currentUser); const sender = ref(userState.currentUser);
const receiver = ref<FG.User | undefined>(undefined); const receiver = ref<FG.User | undefined>(undefined);
const amount = ref<number>(0); const amount = ref<number>(0);

View File

@ -1,14 +1,14 @@
<template> <template>
<div> <div>
<q-card flat square> <q-card flat square>
<q-card-section class="row items-center justify-between" horizontal> <q-card-section class="row items-center justify-between" horizontal>
<div class="col-5 text-left q-px-sm"> <div class="col-5 text-left q-px-sm">
<div <div :class="{ 'text-negative': isNegative() }" class="text-weight-bold text-h6">
:class="{ 'text-negative': isNegative() }"
class="text-weight-bold text-h6"
>
<span v-if="isNegative()">-</span>{{ transaction.amount.toFixed(2) }}&#8239; <span v-if="isNegative()">-</span>{{ transaction.amount.toFixed(2) }}&#8239;
</div> </div>
<div class="text-caption">{{ text }}</div>
<div class="text-caption">{{ timeStr }}</div>
</div>
<div class="col-5 q-px-sm text-center"> <div class="col-5 q-px-sm text-center">
<div class="text-subtitle1" v-if="isReversed">Storniert</div> <div class="text-subtitle1" v-if="isReversed">Storniert</div>
</div> </div>
@ -34,7 +34,9 @@ import { ref, computed, defineComponent, onUnmounted, onMounted } from 'vue';
import { hasPermission } from 'src/utils/permission'; import { hasPermission } from 'src/utils/permission';
import { formatDateTime } from 'src/utils/datetime'; import { formatDateTime } from 'src/utils/datetime';
import { StateInterfaceBalance } from 'src/plugins/balance/store/balance'; import { StateInterfaceBalance } from 'src/plugins/balance/store/balance';
import { Store } from 'vuex'; import { Store, useStore } from 'vuex';
import { StateInterface } from 'src/store';
import { UserStateInterface } from 'src/plugins/user/store/user';
interface Props { interface Props {
transaction: FG.Transaction; transaction: FG.Transaction;
@ -52,13 +54,15 @@ export default defineComponent({
setup(props: Props, { root, emit }) { setup(props: Props, { root, emit }) {
const now = ref(Date.now()); const now = ref(Date.now());
const ival = setInterval(() => (now.value = Date.now()), 1000); const ival = setInterval(() => (now.value = Date.now()), 1000);
const store: Store<StateInterfaceBalance> = <Store<StateInterfaceBalance>>root.$store; //const store: Store<StateInterfaceBalance> = <Store<StateInterfaceBalance>>root.$store;
const store = useStore<Store<StateInterface>>();
const userState = <UserStateInterface>store.state.user;
const text = ref(''); const text = ref('');
onUnmounted(() => clearInterval(ival)); onUnmounted(() => clearInterval(ival));
onMounted(() => refreshText()); onMounted(() => refreshText());
const isNegative = () => props.transaction.sender_id === store.state.user.currentUser?.userid; const isNegative = () => props.transaction.sender_id === userState.currentUser?.userid;
const refreshText = async () => { const refreshText = async () => {
if (isNegative()) { if (isNegative()) {
@ -88,7 +92,7 @@ export default defineComponent({
() => () =>
!isReversed.value && !isReversed.value &&
(hasPermission('balance_reversal', store) || (hasPermission('balance_reversal', store) ||
(props.transaction.sender_id === store.state.user.currentUser?.userid && (props.transaction.sender_id === userState.currentUser?.userid &&
now.value - props.transaction.time.getTime() < 10000)) now.value - props.transaction.time.getTime() < 10000))
); );

View File

@ -8,8 +8,9 @@
<script lang="ts"> <script lang="ts">
import { computed, defineComponent, onBeforeMount } from 'vue'; import { computed, defineComponent, onBeforeMount } from 'vue';
import { StateInterfaceBalance } from 'src/plugins/balance/store/balance'; import { BalanceInterface, StateInterfaceBalance } from 'src/plugins/balance/store/balance';
import { Store } from 'vuex'; import { Store, useStore } from 'vuex';
import { UserStateInterface } from 'src/plugins/user/store/user';
export default defineComponent({ export default defineComponent({
name: 'BalanceWidget', name: 'BalanceWidget',
@ -20,12 +21,13 @@ export default defineComponent({
}); });
}); });
const store = <Store<StateInterfaceBalance>>root.$store; //const store = <Store<StateInterfaceBalance>>root.$store;
const store = useStore<Store<StateInterface>>();
const balanceState = <BalanceInterface>store.state.balance;
const userState = <UserStateInterface>store.state.user;
const balance = computed( const balance = computed(
() => () => balanceState.balances.get(userState.currentUser.userid)?.balance || NaN
store.state.balance.balances.get((<FG.User>store.state.user.currentUser).userid)?.balance ||
NaN
); );
return { balance }; return { balance };

View File

@ -15,11 +15,12 @@
import { ref, defineComponent, onMounted } from 'vue'; import { ref, defineComponent, onMounted } from 'vue';
import { StateInterfaceBalance, BalancesResponse } from '../store/balance'; import { StateInterfaceBalance, BalancesResponse } from '../store/balance';
import { Store } from 'vuex'; import { Store, useStore } from 'vuex';
export default defineComponent({ export default defineComponent({
// name: 'PageName' // name: 'PageName'
setup(_, { root }) { setup(_, { root }) {
const store = <Store<StateInterfaceBalance>>root.$store; //const store = <Store<StateInterfaceBalance>>root.$store;
const store = useStore();
onMounted( onMounted(
() => () =>

View File

@ -68,20 +68,22 @@
<script lang="ts"> <script lang="ts">
import { computed, defineComponent, ref, onMounted } from 'vue'; import { computed, defineComponent, ref, onMounted } from 'vue';
import { Store } from 'vuex'; import { Store, useStore } from 'vuex';
import { hasPermissions, hasSomePermissions } from 'src/utils/permission'; import { hasPermissions, hasSomePermissions } from 'src/utils/permission';
import PERMISSIONS from '../permissions'; import PERMISSIONS from '../permissions';
import { Screen } from 'quasar'; import { Screen } from 'quasar';
import BalanceAdd from '../components/BalanceAdd.vue'; import BalanceAdd from '../components/BalanceAdd.vue';
import BalanceTransfer from '../components/BalanceTransfer.vue'; import BalanceTransfer from '../components/BalanceTransfer.vue';
import Transaction from '../components/Transaction.vue'; import Transaction from '../components/Transaction.vue';
import { StateInterfaceBalance } from '../store/balance'; import { BalanceInterface, StateInterfaceBalance } from '../store/balance';
export default defineComponent({ export default defineComponent({
name: 'BalanceManage', name: 'BalanceManage',
components: { BalanceAdd, BalanceTransfer, Transaction }, components: { BalanceAdd, BalanceTransfer, Transaction },
setup(_, { root }) { setup(_, { root }) {
const store = <Store<StateInterfaceBalance>>root.$store; //const store = <Store<StateInterfaceBalance>>root.$store;
const store = useStore<Store<StateInterface>>();
const balanceState = <BalanceInterface>store.state.balance;
const now = new Date(); const now = new Date();
onMounted(() => { onMounted(() => {
void store.dispatch('balance/getTransactions', { void store.dispatch('balance/getTransactions', {
@ -89,7 +91,7 @@ export default defineComponent({
}); });
}); });
const transactions = computed(() => { const transactions = computed(() => {
const a = store.state.balance.transactions const a = balanceState.transactions
.filter((t) => t.original_id == undefined) .filter((t) => t.original_id == undefined)
.filter((t) => t.time > new Date(now.getFullYear(), now.getMonth(), now.getDate())) .filter((t) => t.time > new Date(now.getFullYear(), now.getMonth(), now.getDate()))
.sort((a, b) => (a.time >= b.time ? -1 : 1)); .sort((a, b) => (a.time >= b.time ? -1 : 1));

View File

@ -33,14 +33,19 @@
<script lang="ts"> <script lang="ts">
import { computed, defineComponent, onMounted, ref } from 'vue'; import { computed, defineComponent, onMounted, ref } from 'vue';
import { StateInterfaceBalance, TransactionsResponse } from '../store/balance'; import { BalanceInterface, StateInterfaceBalance, TransactionsResponse } from '../store/balance';
import { Store } from 'vuex'; import { Store, useStore } from 'vuex';
import { formatDateTime } from 'src/utils/datetime'; import { formatDateTime } from 'src/utils/datetime';
import { StateInterface } from 'src/store';
import { UserStateInterface } from 'src/plugins/user/store/user';
export default defineComponent({ export default defineComponent({
// name: 'PageName' // name: 'PageName'
setup(_, { root }) { setup(_, { root }) {
const store = <Store<StateInterfaceBalance>>root.$store; //const store = <Store<StateInterfaceBalance>>root.$store;
const store = useStore<Store<StateInterface>>();
const userState = <UserStateInterface>store.state.user;
const balanceState = <BalanceInterface>store.state.balance;
onMounted(() => { onMounted(() => {
void store.dispatch('balance/getBalance'); void store.dispatch('balance/getBalance');
@ -102,9 +107,7 @@ export default defineComponent({
} }
const balance = computed( const balance = computed(
() => () => balanceState.balances.get(userState.currentUser.userid)?.balance || NaN
store.state.balance.balances.get((<FG.User>store.state.user.currentUser).userid)?.balance ||
NaN
); );
const columns = [ const columns = [
@ -138,7 +141,7 @@ export default defineComponent({
else { else {
if (row.receiver_id == null) return 'Angeschrieben'; if (row.receiver_id == null) return 'Angeschrieben';
else { else {
if (row.receiver_id === store.state.user.currentUser?.userid) return 'Bekommen von X'; if (row.receiver_id === userState.currentUser?.userid) return 'Bekommen von X';
else return 'Gesendet an X'; else return 'Gesendet an X';
} }
} }
@ -155,7 +158,7 @@ export default defineComponent({
label: 'Benutzer', label: 'Benutzer',
field: 'author_id', field: 'author_id',
format: (val: string) => { format: (val: string) => {
const user = store.state.user.users.filter((x) => x.userid == val); const user = userState.users.filter((x) => x.userid == val);
if (user.length > 0) return user[0].display_name; if (user.length > 0) return user[0].display_name;
else return val; else return val;
}, },

View File

@ -1,4 +1,5 @@
import { Module, MutationTree, ActionTree, GetterTree } from 'vuex'; import { Module, MutationTree, ActionTree, GetterTree } from 'vuex';
//import store, { StateInterface } from 'src/store';
import store, { StateInterface } from 'src/store'; import store, { StateInterface } from 'src/store';
import { axios } from 'src/boot/axios'; import { axios } from 'src/boot/axios';
import { AxiosResponse } from 'axios'; import { AxiosResponse } from 'axios';
@ -29,7 +30,8 @@ export interface BalanceInterface {
loading: number; loading: number;
} }
export interface StateInterfaceBalance extends StateInterface { //export interface StateInterfaceBalance extends StateInterface {
export interface StateInterfaceBalance {
balance: BalanceInterface; balance: BalanceInterface;
} }
@ -89,6 +91,7 @@ const mutations: MutationTree<BalanceInterface> = {
}; };
const actions: ActionTree<BalanceInterface, StateInterface> = { const actions: ActionTree<BalanceInterface, StateInterface> = {
//const actions: ActionTree<BalanceInterface, any> = {
addShortcut({ commit, state, rootState }, shortcut) { addShortcut({ commit, state, rootState }, shortcut) {
const sc = [...state.shortcuts, shortcut]; const sc = [...state.shortcuts, shortcut];
sc.sort(); sc.sort();
@ -219,7 +222,17 @@ const actions: ActionTree<BalanceInterface, StateInterface> = {
}, },
}; };
const getters: GetterTree<BalanceInterface, StateInterface> = {}; const getters: GetterTree<BalanceInterface, StateInterface> = {
balances: ({ balances }) => {
return balances;
},
shortcuts: ({ shortcuts }) => {
return shortcuts;
},
transactions: ({ transactions }) => {
return transactions;
},
};
const balance: Module<BalanceInterface, StateInterface> = { const balance: Module<BalanceInterface, StateInterface> = {
namespaced: true, namespaced: true,

View File

@ -2,7 +2,8 @@
<q-card class="row justify-center content-center" style="text-align: center"> <q-card class="row justify-center content-center" style="text-align: center">
<q-card-section> <q-card-section>
<div class="text-h6 col-12">Dienste diesen Monat: {{ jobs }}</div> <div class="text-h6 col-12">Dienste diesen Monat: {{ jobs }}</div>
<div class="text-h6 col-12">Nächster Dienst: {{ nextJob | date }}</div> <!--TODO: Filters are deprecated! -->
<!--<div class="text-h6 col-12">Nächster Dienst: {{ nextJob | date }}</div>-->
</q-card-section> </q-card-section>
</q-card> </q-card>
</template> </template>

View File

@ -67,7 +67,7 @@
import { defineComponent, ref, onBeforeMount, computed } from 'vue'; import { defineComponent, ref, onBeforeMount, computed } from 'vue';
import IsoDateInput from 'src/components/utils/IsoDateInput.vue'; import IsoDateInput from 'src/components/utils/IsoDateInput.vue';
import Job from './Job.vue'; import Job from './Job.vue';
import { Store } from 'vuex'; import { Store, useStore } from 'vuex';
import { StateInterface } from 'src/store'; import { StateInterface } from 'src/store';
import { ScheduleInterface } from '../../store/schedule'; import { ScheduleInterface } from '../../store/schedule';
import { date } from 'quasar'; import { date } from 'quasar';
@ -76,7 +76,8 @@ export default defineComponent({
name: 'CreateEvent', name: 'CreateEvent',
components: { IsoDateInput, Job }, components: { IsoDateInput, Job },
setup(_, { root }) { setup(_, { root }) {
const store = <Store<StateInterface>>root.$store; //const store = <Store<StateInterface>>root.$store;
const store = useStore<Store<StateInterface>>();
const state = <ScheduleInterface>store.state.schedule; const state = <ScheduleInterface>store.state.schedule;
const eventtypes = computed(() => state.eventTypes); const eventtypes = computed(() => state.eventTypes);
const jobDeleteDisabled = computed(() => event.value.jobs.length < 2); const jobDeleteDisabled = computed(() => event.value.jobs.length < 2);
@ -140,13 +141,8 @@ export default defineComponent({
function save() { function save() {
console.log('Event:', event); console.log('Event:', event);
void store store.dispatch('schedule/addEvent', event.value).catch((error) => {
.dispatch('schedule/addEvent', event.value)
.catch((error) => {
console.warn(error); console.warn(error);
})
.then(() => {
reset();
}); });
} }

View File

@ -46,14 +46,15 @@
<script lang="ts"> <script lang="ts">
import { defineComponent, ref, computed, onBeforeMount } from 'vue'; import { defineComponent, ref, computed, onBeforeMount } from 'vue';
import { Store } from 'vuex'; import { Store, useStore } from 'vuex';
import { StateInterface } from 'src/store'; import { StateInterface } from 'src/store';
import { ScheduleInterface, EventType } from '../../store/schedule'; import { ScheduleInterface, EventType } from '../../store/schedule';
export default defineComponent({ export default defineComponent({
name: 'EventTypes', name: 'EventTypes',
components: {}, components: {},
setup(_, { root }) { setup(_, { root }) {
const store = <Store<StateInterface>>root.$store; //const store = <Store<StateInterface>>root.$store;
const store = useStore<Store<StateInterface>>();
const state = <ScheduleInterface>store.state.schedule; const state = <ScheduleInterface>store.state.schedule;
const newEventType = ref(''); const newEventType = ref('');
const edittype = ref(false); const edittype = ref(false);

View File

@ -64,7 +64,7 @@
<script lang="ts"> <script lang="ts">
import { defineComponent, computed, ref } from 'vue'; import { defineComponent, computed, ref } from 'vue';
import IsoDateInput from 'src/components/utils/IsoDateInput.vue'; import IsoDateInput from 'src/components/utils/IsoDateInput.vue';
import { Store } from 'vuex'; import { Store, useStore } from 'vuex';
import { StateInterface } from 'src/store'; import { StateInterface } from 'src/store';
import { ScheduleInterface } from '../../store/schedule'; import { ScheduleInterface } from '../../store/schedule';
import { date } from 'quasar'; import { date } from 'quasar';
@ -91,7 +91,8 @@ export default defineComponent({
}, },
setup(props: Props, { root, emit }) { setup(props: Props, { root, emit }) {
const store = <Store<StateInterface>>root.$store; //const store = <Store<StateInterface>>root.$store;
const store = useStore<Store<StateInterafce>>();
const state = <ScheduleInterface>store.state.schedule; const state = <ScheduleInterface>store.state.schedule;
const jobtypes = computed(() => state.jobTypes); const jobtypes = computed(() => state.jobTypes);
// job = computed(() => job); // job = computed(() => job);

View File

@ -46,14 +46,15 @@
<script lang="ts"> <script lang="ts">
import { defineComponent, ref, computed, onBeforeMount } from 'vue'; import { defineComponent, ref, computed, onBeforeMount } from 'vue';
import { Store } from 'vuex'; import { Store, useStore } from 'vuex';
import { StateInterface } from 'src/store'; import { StateInterface } from 'src/store';
import { ScheduleInterface, JobType } from '../../store/schedule'; import { ScheduleInterface, JobType } from '../../store/schedule';
export default defineComponent({ export default defineComponent({
name: 'JobTypes', name: 'JobTypes',
components: {}, components: {},
setup(_, { root }) { setup(_, { root }) {
const store = <Store<StateInterface>>root.$store; //const store = <Store<StateInterface>>root.$store;
const store = useStore<Store<StateInterface>>();
const state = <ScheduleInterface>store.state.schedule; const state = <ScheduleInterface>store.state.schedule;
const newJob = ref(''); const newJob = ref('');
const edittype = ref(false); const edittype = ref(false);

View File

@ -24,20 +24,23 @@
import { computed, defineComponent } from 'vue'; import { computed, defineComponent } from 'vue';
import EssentialLink from 'src/components/navigation/EssentialLink.vue'; import EssentialLink from 'src/components/navigation/EssentialLink.vue';
import mainRoutes from 'src/plugins/schedule/routes'; import mainRoutes from 'src/plugins/schedule/routes';
import { Store } from 'vuex'; import { Store, useStore } from 'vuex';
import { BalanceInterface } from 'src/plugins/balance/store/balance'; import { BalanceInterface } from 'src/plugins/balance/store/balance';
import setLoadingBar from 'src/utils/loading'; import setLoadingBar from 'src/utils/loading';
import { StateInterface } from 'src/store'; import { StateInterface } from 'src/store';
import { useRoute } from 'vue-router';
export default defineComponent({ export default defineComponent({
// name: 'PageName' // name: 'PageName'
components: { EssentialLink }, components: { EssentialLink },
setup(_, { root }) { setup(_) {
const store = <Store<StateInterface>>root.$store; //const store = <Store<StateInterface>>root.$store;
const store = useStore<Store<StateInterface>>();
const route = useRoute();
const loading = computed(() => { const loading = computed(() => {
return (<BalanceInterface>store.state.balance).loading > 0; return (<BalanceInterface>store.state.balance).loading > 0;
}); });
const checkMain = computed(() => { const checkMain = computed(() => {
return root.$route.matched.length == 2; return route.matched.length == 2;
}); });
setLoadingBar(loading); setLoadingBar(loading);

View File

@ -1,5 +1,13 @@
import { store } from 'quasar/wrappers'; import { store } from 'quasar/wrappers';
import { createStore } from 'vuex'; import { createStore } from 'vuex';
import { UserStateInterface } from 'src/plugins/user/store/user';
import { SessionStateInterface } from 'src/plugins/user/store/session';
export interface StateInterface {
user: UserStateInterface;
session: SessionStateInterface;
[key: string]: any;
}
export default store(function (/* { ssrContext } */) { export default store(function (/* { ssrContext } */) {
const Store = createStore({ const Store = createStore({

View File

@ -3,5 +3,13 @@
"target": "esnext", "target": "esnext",
"compilerOptions": { "compilerOptions": {
"baseUrl": ".", "baseUrl": ".",
"lib": [
"es2020",
"dom"
],
"types": [
"webpack-env",
"node"
]
} }
} }

View File

@ -1006,9 +1006,9 @@
integrity sha1-FPzHEqUwA475vhzmlSMVqDn0Zqg= integrity sha1-FPzHEqUwA475vhzmlSMVqDn0Zqg=
"@quasar/app@^3.0.0-alpha.8": "@quasar/app@^3.0.0-alpha.8":
version "3.0.0-alpha.8" version "3.0.0-alpha.9"
resolved "https://registry.yarnpkg.com/@quasar/app/-/app-3.0.0-alpha.8.tgz#4e469763f5256c86291a04457a1153c9a344f2d8" resolved "https://registry.yarnpkg.com/@quasar/app/-/app-3.0.0-alpha.9.tgz#2a5cbf51d79d26b51489201245a9422b6081edfd"
integrity sha512-t0ujMPeWrUGbSwzO7npUHx5Jmdhn7pqWliD8i+rqPF+62g0+Nd1ZRVCMLIYxb1DmNvlW3QOfCAELL94k8yxsQg== integrity sha512-R6vln7x7tcEmv5Xn2439UCQNUBXkaaN3TwPVKOb5J3CAnldpdy1QdEEKXv4uT3f1kir2YOOz0NiWM1xrr+01UA==
dependencies: dependencies:
"@quasar/babel-preset-app" "2.0.1" "@quasar/babel-preset-app" "2.0.1"
"@quasar/fastclick" "1.1.4" "@quasar/fastclick" "1.1.4"
@ -4160,9 +4160,9 @@ eslint-webpack-plugin@^2.4.3:
schema-utils "^3.0.0" schema-utils "^3.0.0"
eslint@^7.18.0: eslint@^7.18.0:
version "7.18.0" version "7.19.0"
resolved "https://registry.yarnpkg.com/eslint/-/eslint-7.18.0.tgz#7fdcd2f3715a41fe6295a16234bd69aed2c75e67" resolved "https://registry.yarnpkg.com/eslint/-/eslint-7.19.0.tgz#6719621b196b5fad72e43387981314e5d0dc3f41"
integrity sha512-fbgTiE8BfUJZuBeq2Yi7J3RB3WGUQ9PNuNbmgi6jt9Iv8qrkxfy19Ds3OpL1Pm7zg3BtTVhvcUZbIRQ0wmSjAQ== integrity sha512-CGlMgJY56JZ9ZSYhJuhow61lMPPjUzWmChFya71Z/jilVos7mR/jPgaEfVGgMBY5DshbKdG8Ezb8FDCHcoMEMg==
dependencies: dependencies:
"@babel/code-frame" "^7.0.0" "@babel/code-frame" "^7.0.0"
"@eslint/eslintrc" "^0.3.0" "@eslint/eslintrc" "^0.3.0"
@ -8198,9 +8198,9 @@ qs@~6.5.2:
integrity sha512-N5ZAX4/LxJmF+7wN74pUD6qAh9/wnvdQcjq9TZjevvXzSUo7bfmw91saqMjzGS2xq91/odN2dW/WOl7qQHNDGA== integrity sha512-N5ZAX4/LxJmF+7wN74pUD6qAh9/wnvdQcjq9TZjevvXzSUo7bfmw91saqMjzGS2xq91/odN2dW/WOl7qQHNDGA==
quasar@^2.0.0-alpha.15: quasar@^2.0.0-alpha.15:
version "2.0.0-alpha.15" version "2.0.0-alpha.17"
resolved "https://registry.yarnpkg.com/quasar/-/quasar-2.0.0-alpha.15.tgz#a0ae3c29179d594b79180a6a0d898f2f59fcf63e" resolved "https://registry.yarnpkg.com/quasar/-/quasar-2.0.0-alpha.17.tgz#07de6767e8e55bdba708f512fd44ca8379b0aeb5"
integrity sha512-kn5sXqv2+hvNUXevCBnihh1s7UNBoPKoRYnQU8RrHrWl31ABRelb3qVu6VLcd8KCyxWw9AC+120fWaAWo+Qqng== integrity sha512-/KTxPdSD6sxSasVz03t24va7jMLXt+CVz80jmsJRDGJJifSIXag1cVdEhWpDTtke8p5nOMoCLHMk3yW4CyCCxA==
query-string@^4.1.0: query-string@^4.1.0:
version "4.3.4" version "4.3.4"
@ -8417,9 +8417,9 @@ regjsgen@^0.5.1:
integrity sha512-OFFT3MfrH90xIW8OOSyUrk6QHD5E9JOTeGodiJeBS3J6IwlgzJMNE/1bZklWz5oTg+9dCMyEetclvCVXOPoN3A== integrity sha512-OFFT3MfrH90xIW8OOSyUrk6QHD5E9JOTeGodiJeBS3J6IwlgzJMNE/1bZklWz5oTg+9dCMyEetclvCVXOPoN3A==
regjsparser@^0.6.4: regjsparser@^0.6.4:
version "0.6.6" version "0.6.7"
resolved "https://registry.yarnpkg.com/regjsparser/-/regjsparser-0.6.6.tgz#6d8c939d1a654f78859b08ddcc4aa777f3fa800a" resolved "https://registry.yarnpkg.com/regjsparser/-/regjsparser-0.6.7.tgz#c00164e1e6713c2e3ee641f1701c4b7aa0a7f86c"
integrity sha512-jjyuCp+IEMIm3N1H1LLTJW1EISEJV9+5oHdEyrt43Pg9cDSb6rrLZei2cVWpl0xTjmmlpec/lEQGYgM7xfpGCQ== integrity sha512-ib77G0uxsA2ovgiYbCVGx4Pv3PSttAx2vIwidqQzbL2U5S4Q+j00HdSAneSBuyVcMvEnTXMjiGgB+DlXozVhpQ==
dependencies: dependencies:
jsesc "~0.5.0" jsesc "~0.5.0"