vitesse-yitisheng-web/src/pages/major/[majorCode].vue

75 lines
1.4 KiB
Vue

<script setup lang="ts">
import { ref, onMounted, onUnmounted } from 'vue'
// --- 类型定义 ---
interface Ranking {
label: string
value: number
trend?: 'up' | 'down' | 'flat'
}
interface Major {
college: string
majors: string[]
}
// --- 状态数据 ---
const route = useRoute('/major/[majorCode]')
const majorCode = ref('')
onMounted(() => {
})
onUnmounted(() => {
})
watchEffect(() => {
majorCode.value = route.params.majorCode
})
useHead({
title: () => { return `${majorCode.value}|艺体志愿宝` },
})
</script>
<template>
<div class="mx-auto max-w-7xl min-h-screen bg-gray-50 px-4 transition-colors duration-300 dark:bg-slate-900 lg:px-8 sm:px-6">
<!-- 顶部导航 & Header sticky -->
<header class="top-0 z-50 shadow-sm">
</header>
<!-- 主要内容区域 -->
<!-- mx-auto max-w-7xl px-4 py-6 lg:px-8 sm:px-6 -->
<main class="mx-auto max-w-7xl">
</main>
</div>
</template>
<style scoped>
/* 隐藏滚动条但保留滚动功能 */
.scrollbar-hide::-webkit-scrollbar {
display: none;
}
.scrollbar-hide {
-ms-overflow-style: none;
scrollbar-width: none;
}
/* 自定义滚动条样式 */
.custom-scrollbar::-webkit-scrollbar {
width: 4px;
}
.custom-scrollbar::-webkit-scrollbar-track {
background: transparent;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
background: #cbd5e1;
border-radius: 2px;
}
.dark .custom-scrollbar::-webkit-scrollbar-thumb {
background: #475569;
}
</style>