use pinia to replace vuex, code refactor

This commit is contained in:
MaysWind
2023-06-10 23:13:31 +08:00
parent 0d84f2857f
commit 46d85e92cd
80 changed files with 4972 additions and 4859 deletions
+8 -2
View File
@@ -18,6 +18,9 @@
<script>
import { mapStores } from 'pinia';
import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';
export default {
props: [
'f7router'
@@ -28,12 +31,15 @@ export default {
loadingError: null
};
},
computed: {
...mapStores(useTransactionCategoriesStore)
},
created() {
const self = this;
self.loading = true;
self.$store.dispatch('loadAllCategories', {
self.transactionCategoriesStore.loadAllCategories({
force: false
}).then(() => {
self.loading = false;
@@ -53,7 +59,7 @@ export default {
reload(done) {
const self = this;
self.$store.dispatch('loadAllCategories', {
self.transactionCategoriesStore.loadAllCategories({
force: true
}).then(() => {
if (done) {
+17 -9
View File
@@ -128,6 +128,13 @@
</template>
<script>
import { mapStores } from 'pinia';
import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';
import categoryConstants from '@/consts/category.js';
import iconConstants from '@/consts/icon.js';
import colorConstants from '@/consts/color.js';
export default {
props: [
'f7route',
@@ -145,8 +152,8 @@ export default {
type: parseInt(query.type),
name: '',
parentId: query.parentId,
icon: self.$constants.icons.defaultCategoryIconId,
color: self.$constants.colors.defaultCategoryColor,
icon: iconConstants.defaultCategoryIconId,
color: colorConstants.defaultCategoryColor,
comment: '',
visible: true,
showIconSelectionSheet: false,
@@ -156,6 +163,7 @@ export default {
};
},
computed: {
...mapStores(useTransactionCategoriesStore),
title() {
if (!this.editCategoryId) {
if (this.category.parentId === '0') {
@@ -175,10 +183,10 @@ export default {
}
},
allCategoryIcons() {
return this.$constants.icons.allCategoryIcons;
return iconConstants.allCategoryIcons;
},
allCategoryColors() {
return this.$constants.colors.allCategoryColors;
return colorConstants.allCategoryColors;
},
inputIsEmpty() {
return !!this.inputEmptyProblemMessage;
@@ -205,7 +213,7 @@ export default {
self.loading = true;
self.editCategoryId = query.id;
self.$store.dispatch('getCategory', {
self.transactionCategoriesStore.getCategory({
categoryId: self.editCategoryId
}).then(category => {
self.category.id = category.id;
@@ -229,9 +237,9 @@ export default {
} else if (query.parentId) {
const categoryType = parseInt(query.type);
if (categoryType !== this.$constants.category.allCategoryTypes.Income &&
categoryType !== this.$constants.category.allCategoryTypes.Expense &&
categoryType !== this.$constants.category.allCategoryTypes.Transfer) {
if (categoryType !== categoryConstants.allCategoryTypes.Income &&
categoryType !== categoryConstants.allCategoryTypes.Expense &&
categoryType !== categoryConstants.allCategoryTypes.Transfer) {
self.$toast('Parameter Invalid');
self.loadingError = 'Parameter Invalid';
return;
@@ -272,7 +280,7 @@ export default {
submitCategory.hidden = !self.category.visible;
}
self.$store.dispatch('saveCategory', {
self.transactionCategoriesStore.saveCategory({
category: submitCategory
}).then(() => {
self.submitting = false;
+25 -18
View File
@@ -87,6 +87,12 @@
</template>
<script>
import { mapStores } from 'pinia';
import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';
import categoryConstants from '@/consts/category.js';
import { onSwipeoutDeleted } from '@/lib/ui.mobile.js';
export default {
props: [
'f7route',
@@ -109,19 +115,20 @@ export default {
};
},
computed: {
...mapStores(useTransactionCategoriesStore),
categories() {
if (!this.categoryId || this.categoryId === '' || this.categoryId === '0') {
if (!this.$store.state.allTransactionCategories || !this.$store.state.allTransactionCategories[this.categoryType]) {
if (!this.transactionCategoriesStore.allTransactionCategories || !this.transactionCategoriesStore.allTransactionCategories[this.categoryType]) {
return [];
}
return this.$store.state.allTransactionCategories[this.categoryType];
return this.transactionCategoriesStore.allTransactionCategories[this.categoryType];
} else if (this.categoryId && this.categoryId !== '' && this.categoryId !== '0') {
if (!this.$store.state.allTransactionCategoriesMap || !this.$store.state.allTransactionCategoriesMap[this.categoryId]) {
if (!this.transactionCategoriesStore.allTransactionCategoriesMap || !this.transactionCategoriesStore.allTransactionCategoriesMap[this.categoryId]) {
return [];
}
return this.$store.state.allTransactionCategoriesMap[this.categoryId].subCategories;
return this.transactionCategoriesStore.allTransactionCategoriesMap[this.categoryId].subCategories;
} else {
return [];
}
@@ -130,13 +137,13 @@ export default {
let title = '';
switch (this.categoryType) {
case this.$constants.category.allCategoryTypes.Income:
case categoryConstants.allCategoryTypes.Income:
title = 'Income';
break;
case this.$constants.category.allCategoryTypes.Expense:
case categoryConstants.allCategoryTypes.Expense:
title = 'Expense';
break;
case this.$constants.category.allCategoryTypes.Transfer:
case categoryConstants.allCategoryTypes.Transfer:
title = 'Transfer';
break;
default:
@@ -189,9 +196,9 @@ export default {
self.categoryType = parseInt(query.type);
if (self.categoryType !== this.$constants.category.allCategoryTypes.Income &&
self.categoryType !== this.$constants.category.allCategoryTypes.Expense &&
self.categoryType !== this.$constants.category.allCategoryTypes.Transfer) {
if (self.categoryType !== categoryConstants.allCategoryTypes.Income &&
self.categoryType !== categoryConstants.allCategoryTypes.Expense &&
self.categoryType !== categoryConstants.allCategoryTypes.Transfer) {
self.$toast('Parameter Invalid');
self.loadingError = 'Parameter Invalid';
return;
@@ -207,7 +214,7 @@ export default {
self.loading = true;
self.$store.dispatch('loadAllCategories', {
self.transactionCategoriesStore.loadAllCategories({
force: false
}).then(() => {
self.loading = false;
@@ -222,7 +229,7 @@ export default {
},
methods: {
onPageAfterIn() {
if (this.$store.state.transactionCategoryListStateInvalid && !this.loading) {
if (this.transactionCategoriesStore.transactionCategoryListStateInvalid && !this.loading) {
this.reload(null);
}
@@ -236,7 +243,7 @@ export default {
const self = this;
self.$store.dispatch('loadAllCategories', {
self.transactionCategoriesStore.loadAllCategories({
force: true
}).then(() => {
if (done) {
@@ -276,7 +283,7 @@ export default {
return;
}
self.$store.dispatch('changeCategoryDisplayOrder', {
self.transactionCategoriesStore.changeCategoryDisplayOrder({
categoryId: id,
from: event.from,
to: event.to
@@ -298,7 +305,7 @@ export default {
self.displayOrderSaving = true;
self.$showLoading();
self.$store.dispatch('updateCategoryDisplayOrders', {
self.transactionCategoriesStore.updateCategoryDisplayOrders({
type: self.categoryType,
parentId: self.categoryId,
}).then(() => {
@@ -325,7 +332,7 @@ export default {
self.$showLoading();
self.$store.dispatch('hideCategory', {
self.transactionCategoriesStore.hideCategory({
category: category,
hidden: hidden
}).then(() => {
@@ -356,10 +363,10 @@ export default {
self.categoryToDelete = null;
self.$showLoading();
self.$store.dispatch('deleteCategory', {
self.transactionCategoriesStore.deleteCategory({
category: category,
beforeResolve: (done) => {
self.$ui.onSwipeoutDeleted(self.getCategoryDomId(category), done);
onSwipeoutDeleted(self.getCategoryDomId(category), done);
}
}).then(() => {
self.$hideLoading();
+22 -15
View File
@@ -55,6 +55,12 @@
</template>
<script>
import { mapStores } from 'pinia';
import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';
import categoryConstants from '@/consts/category.js';
import { copyArrayTo } from '@/lib/common.js';
export default {
props: [
'f7route',
@@ -74,6 +80,7 @@ export default {
};
},
computed: {
...mapStores(useTransactionCategoriesStore),
allLanguages() {
return this.$locale.getAllLanguageInfos();
}
@@ -85,9 +92,9 @@ export default {
self.categoryType = parseInt(query.type);
if (self.categoryType !== 0 &&
self.categoryType !== this.$constants.category.allCategoryTypes.Income &&
self.categoryType !== this.$constants.category.allCategoryTypes.Expense &&
self.categoryType !== this.$constants.category.allCategoryTypes.Transfer) {
self.categoryType !== categoryConstants.allCategoryTypes.Income &&
self.categoryType !== categoryConstants.allCategoryTypes.Expense &&
self.categoryType !== categoryConstants.allCategoryTypes.Transfer) {
self.$toast('Parameter Invalid');
self.loadingError = 'Parameter Invalid';
return;
@@ -97,13 +104,13 @@ export default {
for (let i = 1; i <= 3; i++) {
self.allCategories.push({
type: i,
categories: self.$utilities.copyArrayTo(self.getDefaultCategories(i), [])
categories: copyArrayTo(self.getDefaultCategories(i), [])
});
}
} else {
self.allCategories.push({
type: self.categoryType,
categories: self.$utilities.copyArrayTo(self.getDefaultCategories(self.categoryType), [])
categories: copyArrayTo(self.getDefaultCategories(self.categoryType), [])
});
}
},
@@ -113,12 +120,12 @@ export default {
},
getDefaultCategories(categoryType) {
switch (categoryType) {
case this.$constants.category.allCategoryTypes.Income:
return this.$constants.category.defaultIncomeCategories;
case this.$constants.category.allCategoryTypes.Expense:
return this.$constants.category.defaultExpenseCategories;
case this.$constants.category.allCategoryTypes.Transfer:
return this.$constants.category.defaultTransferCategories;
case categoryConstants.allCategoryTypes.Income:
return categoryConstants.defaultIncomeCategories;
case categoryConstants.allCategoryTypes.Expense:
return categoryConstants.defaultExpenseCategories;
case categoryConstants.allCategoryTypes.Transfer:
return categoryConstants.defaultTransferCategories;
default:
return [];
}
@@ -159,7 +166,7 @@ export default {
}
}
self.$store.dispatch('addCategories', {
self.transactionCategoriesStore.addCategories({
categories: categories
}).then(() => {
self.submitting = false;
@@ -178,11 +185,11 @@ export default {
},
getCategoryTypeName(categoryType) {
switch (categoryType) {
case this.$constants.category.allCategoryTypes.Income:
case categoryConstants.allCategoryTypes.Income:
return this.$t('Income Categories');
case this.$constants.category.allCategoryTypes.Expense:
case categoryConstants.allCategoryTypes.Expense:
return this.$t('Expense Categories');
case this.$constants.category.allCategoryTypes.Transfer:
case categoryConstants.allCategoryTypes.Transfer:
return this.$t('Transfer Categories');
default:
return this.$t('Transaction Categories');