feat: 初始化慧遇书院官网一期

app/app.vue

@@ -0,0 +1,44 @@
+<script setup lang="ts">
+const route = useRoute()
+const config = useRuntimeConfig()
+const scrollProgress = ref(0)
+let scrollFrame = 0
+const canonical = computed(() => `${String(config.public.siteUrl).replace(/\/$/, '')}${route.path === '/' ? '/' : route.path}`)
+const isDraftPreview = computed(() => route.query.preview === 'draft')
+
+useHead(() => route.path.startsWith('/admin') ? {} : {
+  link: [{ rel: 'canonical', href: canonical.value }],
+})
+useSeoMeta({ ogUrl: () => canonical.value, twitterCard: 'summary_large_image' })
+
+const updateScrollProgress = () => {
+  scrollFrame = 0
+  const max = document.documentElement.scrollHeight - window.innerHeight
+  scrollProgress.value = max > 0 ? Math.min(1, window.scrollY / max) : 0
+}
+const requestProgressUpdate = () => {
+  if (!scrollFrame) scrollFrame = requestAnimationFrame(updateScrollProgress)
+}
+
+onMounted(() => {
+  updateScrollProgress()
+  window.addEventListener('scroll', requestProgressUpdate, { passive: true })
+  window.addEventListener('resize', requestProgressUpdate, { passive: true })
+})
+
+onBeforeUnmount(() => {
+  if (import.meta.client) {
+    window.removeEventListener('scroll', requestProgressUpdate)
+    window.removeEventListener('resize', requestProgressUpdate)
+  }
+  if (scrollFrame) cancelAnimationFrame(scrollFrame)
+})
+</script>
+
+<template>
+  <NuxtRouteAnnouncer />
+  <a class="skip-link" href="#main-content">跳到正文</a>
+  <div v-if="!route.path.startsWith('/admin')" class="page-progress" aria-hidden="true"><span :style="{ transform: `scaleX(${scrollProgress})` }" /></div>
+  <div v-if="isDraftPreview" class="draft-preview-ribbon"><strong>草稿预览</strong><span>此页面不会被搜索引擎收录</span><NuxtLink to="/admin">返回后台</NuxtLink></div>
+  <NuxtPage />
+</template>