diff --git a/frontend/pages/dashboard/dashboard.vue b/frontend/pages/dashboard/dashboard.vue
index 50e93e8..1b5cf4a 100644
--- a/frontend/pages/dashboard/dashboard.vue
+++ b/frontend/pages/dashboard/dashboard.vue
@@ -23,40 +23,27 @@
   </view>
 </template>
 
-<script>
+<script setup>
 import { ref, onUnmounted } from 'vue'
 import DashboardHeader from './components/DashboardHeader.vue'
 import { useDashboardData } from '@/composables/useDashboardData'
 
-export default {
-  components: { DashboardHeader },
-  setup() {
-    const activeTab = ref('crystal')
-    const starId = ref(uni.getStorageSync('star_id') || null)
+const pageBg = 'linear-gradient(153deg, #FF9597 0%, #80DFFF 33%, #B8B8B8 74%, #D9D9D9 100%)'
 
-    const { loading, error, data, isReady, dispose } = useDashboardData({
-      starId: starId.value,
-    })
+const activeTab = ref('crystal')
+const starId = ref(uni.getStorageSync('star_id') || null)
 
-    function handleTabChange(tab) {
-      activeTab.value = tab
-    }
+const { loading, error, data, isReady, dispose } = useDashboardData({
+  starId: starId.value,
+})
 
-    onUnmounted(() => {
-      dispose()
-    })
-
-    return {
-      activeTab,
-      loading,
-      error,
-      data,
-      isReady,
-      handleTabChange,
-      pageBg: 'linear-gradient(153deg, #FF9597 0%, #80DFFF 33%, #B8B8B8 74%, #D9D9D9 100%)',
-    }
-  },
+function handleTabChange(tab) {
+  activeTab.value = tab
 }
+
+onUnmounted(() => {
+  dispose()
+})
 </script>
 
 <style lang="scss" scoped>