Fix: 修正重定向逻辑 & 使用Pinia管理状态
This commit is contained in:
@ -159,11 +159,22 @@
|
||||
import { computed, onMounted, onUnmounted, ref } from 'vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { navigationConfig } from '@/config/navigation'
|
||||
import { useNavigationStore } from '@/stores/navigation'
|
||||
import { useRoute } from 'vue-router'
|
||||
|
||||
const { t, locale } = useI18n()
|
||||
const route = useRoute()
|
||||
|
||||
const navigationStore = useNavigationStore()
|
||||
|
||||
const drawer = computed({
|
||||
get: () => navigationStore.drawer,
|
||||
set: (value: boolean) => {
|
||||
navigationStore.setDrawerOpen(value)
|
||||
},
|
||||
})
|
||||
const selectedIndex = computed(() => navigationStore.selectedIndex)
|
||||
|
||||
const drawer = ref(true)
|
||||
const selectedIndex = ref(0)
|
||||
const windowWidth = ref(typeof window === 'undefined' ? 1200 : window.innerWidth)
|
||||
|
||||
const showAboutDialog = ref(false)
|
||||
@ -260,7 +271,6 @@
|
||||
}
|
||||
|
||||
function handleSelect (index: number) {
|
||||
selectedIndex.value = index
|
||||
drawer.value = false // 选择后自动关闭抽屉
|
||||
}
|
||||
|
||||
|
||||
@ -69,5 +69,6 @@
|
||||
"appDescription": "Paper tube production auxiliary production tool provides calculation of various parameters such as weight, size, angle, etc.",
|
||||
"allRightsReserved": "All Rights Reserved",
|
||||
"close": "Close",
|
||||
"officialWebsite": "Official website"
|
||||
"officialWebsite": "Official website",
|
||||
"loading": "Loading"
|
||||
}
|
||||
|
||||
@ -69,5 +69,6 @@
|
||||
"appDescription": "纸管制作辅助生产工具,提供纸管重量、尺寸、角度等多种参数的计算。",
|
||||
"allRightsReserved": "版权所有",
|
||||
"close": "关闭",
|
||||
"officialWebsite": "官方网站"
|
||||
"officialWebsite": "官方网站",
|
||||
"loading": "加载中"
|
||||
}
|
||||
|
||||
@ -1,15 +1,48 @@
|
||||
<template>
|
||||
<div>Redirecting...</div>
|
||||
<v-container class="d-flex justify-center align-center" style="min-height: 50vh;">
|
||||
<div class="text-center">
|
||||
<v-progress-circular
|
||||
color="primary"
|
||||
indeterminate
|
||||
size="64"
|
||||
width="6"
|
||||
/>
|
||||
<div class="text-h6 mt-4 text-primary">
|
||||
{{ $t('loading') }}...
|
||||
</div>
|
||||
</div>
|
||||
</v-container>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { onMounted } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
|
||||
const router = useRouter()
|
||||
const route = useRoute()
|
||||
|
||||
onMounted(() => {
|
||||
// Redirect to the calculators page
|
||||
router.push('/calculators/paper-tube-weight')
|
||||
onMounted(async () => {
|
||||
// 等待路由完全准备好
|
||||
await router.isReady()
|
||||
|
||||
// 检查是否是直接访问首页
|
||||
const isDirectAccess = route.path === '/' && !document.referrer.includes(window.location.origin)
|
||||
|
||||
let targetPath = '/calculators/paper-tube-weight' // 默认路径
|
||||
|
||||
if (!isDirectAccess) {
|
||||
// 如果不是直接访问,尝试恢复上次的路径
|
||||
const lastRoute = sessionStorage.getItem('lastRoute')
|
||||
const savedPath = localStorage.getItem('lastPath')
|
||||
targetPath = lastRoute || savedPath || targetPath
|
||||
}
|
||||
|
||||
// 使用 replace 避免在历史记录中留下首页
|
||||
router.replace(targetPath)
|
||||
})
|
||||
</script>
|
||||
|
||||
<route lang="yaml">
|
||||
meta:
|
||||
layout: CalculatorLayout
|
||||
</route>
|
||||
|
||||
@ -33,4 +33,28 @@ router.isReady().then(() => {
|
||||
localStorage.removeItem('vuetify:dynamic-reload')
|
||||
})
|
||||
|
||||
router.beforeEach((to, from, next) => {
|
||||
// 如果访问根路径且不是直接输入地址访问
|
||||
if (to.path === '/' && from.path !== '/') {
|
||||
// 检查是否有保存的路径
|
||||
const lastRoute = sessionStorage.getItem('lastRoute')
|
||||
const savedPath = localStorage.getItem('lastPath')
|
||||
|
||||
if (lastRoute || savedPath) {
|
||||
// 重定向到上次访问的页面
|
||||
next(lastRoute || savedPath || '/calculators/paper-tube-weight')
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
// 保存当前路由(非首页)
|
||||
if (to.path !== '/') {
|
||||
sessionStorage.setItem('lastRoute', to.fullPath)
|
||||
localStorage.setItem('lastPath', to.fullPath)
|
||||
}
|
||||
|
||||
next()
|
||||
|
||||
})
|
||||
|
||||
export default router
|
||||
|
||||
31
src/stores/navigation.ts
Normal file
31
src/stores/navigation.ts
Normal file
@ -0,0 +1,31 @@
|
||||
import { defineStore } from 'pinia'
|
||||
import { computed, ref } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { navigationConfig } from '@/config/navigation'
|
||||
|
||||
export const useNavigationStore = defineStore('navigation', () => {
|
||||
// Status
|
||||
const route = useRoute()
|
||||
const drawer = ref(false)
|
||||
|
||||
// 当前选中的菜单项
|
||||
const selectedIndex = computed(() => {
|
||||
return navigationConfig.findIndex(item => item.to === route.path)
|
||||
})
|
||||
|
||||
// Actions
|
||||
function toggleDrawer () {
|
||||
drawer.value = !drawer.value
|
||||
}
|
||||
|
||||
function setDrawerOpen (open: boolean) {
|
||||
drawer.value = open
|
||||
}
|
||||
|
||||
return {
|
||||
selectedIndex,
|
||||
drawer,
|
||||
toggleDrawer,
|
||||
setDrawerOpen,
|
||||
}
|
||||
})
|
||||
Reference in New Issue
Block a user