zhengchen.tao/ezbookkeeping
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

migrate entry and router file to typescript

Browse Source
This commit is contained in:
MaysWind
2025-01-25 16:13:55 +08:00
parent 05d8f8b9ab
commit a0b9ca7fae
8 changed files with 71 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/MobileApp.vue
+4 -3
View File
@@ -7,9 +7,9 @@
<script setup lang="ts">
import { ref, computed, watch, onMounted } from 'vue';
import type { Notification, Actions, Dialog, Popover, Popup, Sheet } from 'framework7/types';
import type { Framework7Parameters, Notification, Actions, Dialog, Popover, Popup, Sheet } from 'framework7/types';
import { f7ready } from 'framework7-vue';
import routes from './router/mobile.js';
import routes from './router/mobile.ts';
import { useI18n } from '@/locales/helpers.ts';
@@ -38,7 +38,7 @@ const userStore = useUserStore();
const tokensStore = useTokensStore();
const exchangeRatesStore = useExchangeRatesStore();
const f7params = ref<object>({
const f7params = ref<Framework7Parameters>({
name: 'ezBookkeeping',
theme: 'ios',
colors: {
@@ -70,6 +70,7 @@ const f7params = ref<object>({
closeOnEscape: true
},
dialog: {
// @ts-expect-error there is an "animate" field in dialog parameters, but it is not declared in the type definition file
animate: isEnableAnimate(),
backdrop: true
},
src/desktop-main.js → src/desktop-main.ts
+4 -7
View File
@@ -68,14 +68,11 @@ import '@vuepic/vue-datepicker/dist/main.css';
import draggable from 'vuedraggable';
import router from '@/router/desktop.js';
import router from '@/router/desktop.ts';
import { getVersion, getBuildTime } from '@/lib/version.ts';
import { getI18nOptions } from '@/locales/helpers.ts';
import {
translateError,
i18nFunctions
} from '@/locales/helper.js';
// @ts-expect-error the above file is migrating to ts
import { i18nFunctions } from '@/locales/helper.js';
import PinCodeInput from '@/components/common/PinCodeInput.vue';
import MapView from '@/components/common/MapView.vue';
@@ -468,6 +465,6 @@ app.component('DateRangeSelectionDialog', DateRangeSelectionDialog);
app.component('MonthRangeSelectionDialog', MonthRangeSelectionDialog);
app.component('SwitchToMobileDialog', SwitchToMobileDialog);
app.config.globalProperties.$locale = i18nFunctions(i18n.global);
app.config.globalProperties['$locale'] = i18nFunctions(i18n.global);
app.mount('#app');
src/desktop.html
+1 -1
View File
@@ -66,6 +66,6 @@
</noscript>
<div id="app"></div>
<script type="module" src="./desktop-main.js"></script>
<script type="module" src="./desktop-main.ts"></script>
</body>
</html>
src/mobile-main.js → src/mobile-main.ts
+11 -11
View File
@@ -36,7 +36,9 @@ import Framework7Treeview from 'framework7/components/treeview';
import Framework7Typography from 'framework7/components/typography';
import Framework7Swiper from 'framework7/components/swiper';
import Framework7PhotoBrowser from 'framework7/components/photo-browser';
// @ts-expect-error there is a function called "registerComponents" in the framework7-vue package, but it is not declared in the type definition file
import Framework7Vue, { registerComponents } from 'framework7-vue/bundle';
import type { Dialog } from 'framework7/types';
import 'framework7/css';
import 'framework7/components/dialog/css';
@@ -79,11 +81,9 @@ import 'line-awesome/dist/line-awesome/css/line-awesome.css';
import VueDatePicker from '@vuepic/vue-datepicker';
import '@vuepic/vue-datepicker/dist/main.css';
import { getVersion, getBuildTime } from '@/lib/version.ts';
import { getI18nOptions } from '@/locales/helpers.ts';
import {
i18nFunctions
} from '@/locales/helper.js';
// @ts-expect-error the above file is migrating to ts
import { i18nFunctions } from '@/locales/helper.js';
import {
showAlert,
showConfirm,
@@ -201,13 +201,13 @@ app.component('ScheduleFrequencySheet', ScheduleFrequencySheet);
app.directive('TextareaAutoSize', TextareaAutoSize);
app.config.globalProperties.$locale = i18nFunctions(i18n.global);
app.config.globalProperties['$locale'] = i18nFunctions(i18n.global);
app.config.globalProperties.$alert = (message, confirmCallback) => showAlert(message, confirmCallback, i18n.global.t);
app.config.globalProperties.$confirm = (message, confirmCallback, cancelCallback) => showConfirm(message, confirmCallback, cancelCallback, i18n.global.t);
app.config.globalProperties.$toast = (message, timeout) => showToast(message, timeout, i18n.global.t);
app.config.globalProperties.$showLoading = showLoading;
app.config.globalProperties.$hideLoading = hideLoading;
app.config.globalProperties.$routeBackOnError = routeBackOnError;
app.config.globalProperties['$alert'] = (message: string, confirmCallback: ((dialog: Dialog.Dialog, e: Event) => void) | undefined) => showAlert(message, confirmCallback, i18n.global.t);
app.config.globalProperties['$confirm'] = (message: string, confirmCallback: (dialog: Dialog.Dialog, e: Event) => void, cancelCallback: ((dialog: Dialog.Dialog, e: Event) => void) | undefined) => showConfirm(message, confirmCallback, cancelCallback, i18n.global.t);
app.config.globalProperties['$toast'] = (message: string, timeout: number | undefined) => showToast(message, timeout, i18n.global.t);
app.config.globalProperties['$showLoading'] = showLoading;
app.config.globalProperties['$hideLoading'] = hideLoading;
app.config.globalProperties['$routeBackOnError'] = routeBackOnError;
app.mount('#app');
src/mobile.html
+1 -1
View File
@@ -66,6 +66,6 @@
</noscript>
<div id="app"></div>
<script type="module" src="./mobile-main.js"></script>
<script type="module" src="./mobile-main.ts"></script>
</body>
</html>
src/router/desktop.js → src/router/desktop.ts
+38 -32
View File
@@ -1,4 +1,4 @@
import { createRouter, createWebHashHistory } from 'vue-router';
import { type NavigationGuardReturn, createRouter, createWebHashHistory } from 'vue-router';
import { TemplateType } from '@/core/template.ts';
import { isUserLogined, isUserUnlocked } from '@/lib/userstate.ts';
@@ -31,7 +31,7 @@ import AppSettingsPage from '@/views/desktop/app/AppSettingsPage.vue';
import ExchangeRatesPage from '@/views/desktop/ExchangeRatesPage.vue';
import AboutPage from '@/views/desktop/AboutPage.vue';
function checkLogin() {
function checkLogin(): NavigationGuardReturn {
if (!isUserLogined()) {
return {
path: '/login',
@@ -45,9 +45,11 @@ function checkLogin() {
replace: true
};
}
return true;
}
function checkLocked() {
function checkLocked(): NavigationGuardReturn {
if (!isUserLogined()) {
return {
path: '/login',
@@ -61,9 +63,11 @@ function checkLocked() {
replace: true
};
}
return true;
}
function checkNotLogin() {
function checkNotLogin(): NavigationGuardReturn {
if (isUserLogined() && !isUserUnlocked()) {
return {
path: '/unlock',
@@ -77,6 +81,8 @@ function checkNotLogin() {
replace: true
};
}
return true;
}
const router = createRouter({
@@ -97,16 +103,16 @@ const router = createRouter({
component: TransactionListPage,
beforeEnter: checkLogin,
props: route => ({
initDateType: route.query.dateType,
initMaxTime: route.query.maxTime,
initMinTime: route.query.minTime,
initType: route.query.type,
initCategoryIds: route.query.categoryIds,
initAccountIds: route.query.accountIds,
initTagIds: route.query.tagIds,
initTagFilterType: route.query.tagFilterType,
initAmountFilter: route.query.amountFilter,
initKeyword: route.query.keyword
initDateType: route.query['dateType'],
initMaxTime: route.query['maxTime'],
initMinTime: route.query['minTime'],
initType: route.query['type'],
initCategoryIds: route.query['categoryIds'],
initAccountIds: route.query['accountIds'],
initTagIds: route.query['tagIds'],
initTagFilterType: route.query['tagFilterType'],
initAmountFilter: route.query['amountFilter'],
initKeyword: route.query['keyword']
})
},
{
@@ -114,18 +120,18 @@ const router = createRouter({
component: StatisticsTransactionPage,
beforeEnter: checkLogin,
props: route => ({
initAnalysisType: route.query.analysisType,
initChartDataType: route.query.chartDataType,
initChartType: route.query.chartType,
initChartDateType: route.query.chartDateType,
initStartTime: route.query.startTime,
initEndTime: route.query.endTime,
initFilterAccountIds: route.query.filterAccountIds,
initFilterCategoryIds: route.query.filterCategoryIds,
initTagIds: route.query.tagIds,
initTagFilterType: route.query.tagFilterType,
initSortingType: route.query.sortingType,
initTrendDateAggregationType: route.query.trendDateAggregationType
initAnalysisType: route.query['analysisType'],
initChartDataType: route.query['chartDataType'],
initChartType: route.query['chartType'],
initChartDateType: route.query['chartDateType'],
initStartTime: route.query['startTime'],
initEndTime: route.query['endTime'],
initFilterAccountIds: route.query['filterAccountIds'],
initFilterCategoryIds: route.query['filterCategoryIds'],
initTagIds: route.query['tagIds'],
initTagFilterType: route.query['tagFilterType'],
initSortingType: route.query['sortingType'],
initTrendDateAggregationType: route.query['trendDateAggregationType']
})
},
{
@@ -169,7 +175,7 @@ const router = createRouter({
component: UserSettingsPage,
beforeEnter: checkLogin,
props: route => ({
initTab: route.query.tab
initTab: route.query['tab']
})
},
{
@@ -177,7 +183,7 @@ const router = createRouter({
component: AppSettingsPage,
beforeEnter: checkLogin,
props: route => ({
initTab: route.query.tab
initTab: route.query['tab']
})
},
{
@@ -201,9 +207,9 @@ const router = createRouter({
path: '/verify_email',
component: VerifyEmailPage,
props: route => ({
email: route.query.email,
token: route.query.token,
hasValidEmailVerifyToken: route.query.emailSent === 'true'
email: route.query['email'],
token: route.query['token'],
hasValidEmailVerifyToken: route.query['emailSent'] === 'true'
})
},
{
@@ -215,7 +221,7 @@ const router = createRouter({
path: '/resetpassword',
component: ResetPasswordPage,
props: route => ({
token: route.query.token
token: route.query['token']
})
},
{
src/router/mobile.js → src/router/mobile.ts
+11 -9
View File
@@ -1,3 +1,5 @@
import type { Router } from 'framework7/types';
import { isUserLogined, isUserUnlocked } from '@/lib/userstate.ts';
import HomePage from '@/views/mobile/HomePage.vue';
@@ -40,15 +42,15 @@ import TagListPage from '@/views/mobile/tags/ListPage.vue';
import TemplateListPage from '@/views/mobile/templates/ListPage.vue';
function asyncResolve(component) {
return function({ resolve }) {
function asyncResolve(component: unknown): (ctx: Router.RouteCallbackCtx) => void {
return function({ resolve }: { resolve: ({ component }: { component: unknown }) => void }): void {
return resolve({
component: component
});
};
} as unknown as (ctx: Router.RouteCallbackCtx) => void;
}
function checkLogin({ router, resolve, reject }) {
function checkLogin({ router, resolve, reject }: { router: Router.Router, resolve: () => void, reject: () => void }): void {
if (!isUserLogined()) {
reject();
router.navigate('/login', {
@@ -70,7 +72,7 @@ function checkLogin({ router, resolve, reject }) {
resolve();
}
function checkLocked({ router, resolve, reject }) {
function checkLocked({ router, resolve, reject }: { router: Router.Router, resolve: () => void, reject: () => void }): void {
if (!isUserLogined()) {
reject();
router.navigate('/login', {
@@ -92,12 +94,12 @@ function checkLocked({ router, resolve, reject }) {
resolve();
}
function checkNotLogin({ router, resolve, reject }) {
function checkNotLogin({ router, resolve, reject }: { router: Router.Router, resolve: () => void, reject: () => void }): void {
if (isUserLogined() && !isUserUnlocked()) {
reject();
router.navigate('/unlock', {
clearPreviousHistory: true,
pushState: false
browserHistory: false
});
return;
}
@@ -106,7 +108,7 @@ function checkNotLogin({ router, resolve, reject }) {
reject();
router.navigate('/', {
clearPreviousHistory: true,
pushState: false
browserHistory: false
});
return;
}
@@ -114,7 +116,7 @@ function checkNotLogin({ router, resolve, reject }) {
resolve();
}
const routes = [
const routes: Router.RouteParameters[] = [
{
path: '/',
async: asyncResolve(HomePage),
src/vue-shim.d.ts
Vendored
+1
View File
@@ -0,0 +1 @@
declare module '*.vue';