mirror of
https://gitee.com/element-plus/element-plus.git
synced 2024-12-14 01:11:25 +08:00
ca27cb051c
* feat(docs): enable mirror site redirection - Allow zh-CN users to redirect to the mirror site * Update content max width
115 lines
3.0 KiB
Vue
115 lines
3.0 KiB
Vue
<script setup lang="ts">
|
|
import { onMounted } from 'vue'
|
|
import { ElMessageBox } from 'element-plus'
|
|
import nprogress from 'nprogress'
|
|
import { useToggle } from '../composables/toggle'
|
|
import { useSidebar } from '../composables/sidebar'
|
|
import { useToggleWidgets } from '../composables/toggle-widgets'
|
|
import { useLang } from '../composables/lang'
|
|
import { breakpoints } from '../constant'
|
|
import VPOverlay from './vp-overlay.vue'
|
|
import VPNav from './vp-nav.vue'
|
|
import VPSubNav from './vp-subnav.vue'
|
|
import VPSidebar from './vp-sidebar.vue'
|
|
import VPContent from './vp-content.vue'
|
|
import VPSponsors from './vp-sponsors.vue'
|
|
|
|
const [isSidebarOpen, toggleSidebar] = useToggle(false)
|
|
const { hasSidebar } = useSidebar()
|
|
const lang = useLang()
|
|
|
|
useToggleWidgets(isSidebarOpen, () => {
|
|
if (window.outerWidth >= breakpoints.lg) {
|
|
toggleSidebar(false)
|
|
}
|
|
})
|
|
|
|
onMounted(async () => {
|
|
window.addEventListener(
|
|
'click',
|
|
(e) => {
|
|
const link = e.target.closest('a')
|
|
if (!link) return
|
|
|
|
const { protocol, hostname, pathname, target } = link
|
|
const currentUrl = window.location
|
|
const extMatch = pathname.match(/\.\w+$/)
|
|
// only intercept inbound links
|
|
if (
|
|
!e.ctrlKey &&
|
|
!e.shiftKey &&
|
|
!e.altKey &&
|
|
!e.metaKey &&
|
|
target !== `_blank` &&
|
|
protocol === currentUrl.protocol &&
|
|
hostname === currentUrl.hostname &&
|
|
!(extMatch && extMatch[0] !== '.html')
|
|
) {
|
|
e.preventDefault()
|
|
if (pathname !== currentUrl.pathname) {
|
|
nprogress.start()
|
|
}
|
|
}
|
|
},
|
|
{ capture: true }
|
|
)
|
|
|
|
if (lang.value === 'zh-CN') {
|
|
try {
|
|
await ElMessageBox.confirm(
|
|
'建议大陆用户访问部署在国内的站点，是否跳转？',
|
|
'提示',
|
|
{
|
|
confirmButtonText: '跳转',
|
|
cancelButtonText: '取消',
|
|
}
|
|
)
|
|
const toLang = '/zh-CN/'
|
|
location.href = `https://element-plus.gitee.io${toLang}${location.pathname.slice(
|
|
toLang.length
|
|
)}`
|
|
} catch (e) {
|
|
// do nothing
|
|
}
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<div class="App">
|
|
<VPOverlay
|
|
class="overlay"
|
|
:show="isSidebarOpen"
|
|
@click="toggleSidebar(false)"
|
|
/>
|
|
<VPNav />
|
|
<VPSubNav v-if="hasSidebar" @open-menu="toggleSidebar(true)" />
|
|
<VPSidebar :open="isSidebarOpen" @close="toggleSidebar(false)">
|
|
<template #top>
|
|
<VPSponsors />
|
|
</template>
|
|
<template #bottom>
|
|
<slot name="sidebar-bottom" />
|
|
</template>
|
|
</VPSidebar>
|
|
<VPContent :is-sidebar-open="isSidebarOpen">
|
|
<template #content-top>
|
|
<slot name="content-top" />
|
|
</template>
|
|
<template #content-bottom>
|
|
<slot name="content-bottom" />
|
|
</template>
|
|
<template #aside-top>
|
|
<slot name="aside-top" />
|
|
</template>
|
|
<template #aside-mid>
|
|
<slot name="aside-mid" />
|
|
</template>
|
|
<template #aside-bottom>
|
|
<slot name="aside-bottom" />
|
|
</template>
|
|
</VPContent>
|
|
<Debug />
|
|
</div>
|
|
</template>
|