diff --git a/src/auto-imports.d.ts b/src/auto-imports.d.ts
index 418d169..19ed092 100644
--- a/src/auto-imports.d.ts
+++ b/src/auto-imports.d.ts
@@ -4,298 +4,290 @@
 // Generated by unplugin-auto-import
 export {}
 declare global {
-  const EffectScope: typeof import("vue")["EffectScope"]
-  const acceptHMRUpdate: typeof import("pinia")["acceptHMRUpdate"]
-  const asyncComputed: typeof import("@vueuse/core")["asyncComputed"]
-  const autoResetRef: typeof import("@vueuse/core")["autoResetRef"]
-  const computed: typeof import("vue")["computed"]
-  const computedAsync: typeof import("@vueuse/core")["computedAsync"]
-  const computedEager: typeof import("@vueuse/core")["computedEager"]
-  const computedInject: typeof import("@vueuse/core")["computedInject"]
-  const computedWithControl: typeof import("@vueuse/core")["computedWithControl"]
-  const controlledComputed: typeof import("@vueuse/core")["controlledComputed"]
-  const controlledRef: typeof import("@vueuse/core")["controlledRef"]
-  const createApp: typeof import("vue")["createApp"]
-  const createEventHook: typeof import("@vueuse/core")["createEventHook"]
-  const createGlobalState: typeof import("@vueuse/core")["createGlobalState"]
-  const createInjectionState: typeof import("@vueuse/core")["createInjectionState"]
-  const createPinia: typeof import("pinia")["createPinia"]
-  const createReactiveFn: typeof import("@vueuse/core")["createReactiveFn"]
-  const createSharedComposable: typeof import("@vueuse/core")["createSharedComposable"]
-  const createUnrefFn: typeof import("@vueuse/core")["createUnrefFn"]
-  const customRef: typeof import("vue")["customRef"]
-  const debouncedRef: typeof import("@vueuse/core")["debouncedRef"]
-  const debouncedWatch: typeof import("@vueuse/core")["debouncedWatch"]
-  const defineAsyncComponent: typeof import("vue")["defineAsyncComponent"]
-  const defineComponent: typeof import("vue")["defineComponent"]
-  const defineStore: typeof import("pinia")["defineStore"]
-  const eagerComputed: typeof import("@vueuse/core")["eagerComputed"]
-  const effectScope: typeof import("vue")["effectScope"]
-  const extendRef: typeof import("@vueuse/core")["extendRef"]
-  const getActivePinia: typeof import("pinia")["getActivePinia"]
-  const getCurrentInstance: typeof import("vue")["getCurrentInstance"]
-  const getCurrentScope: typeof import("vue")["getCurrentScope"]
-  const h: typeof import("vue")["h"]
-  const ignorableWatch: typeof import("@vueuse/core")["ignorableWatch"]
-  const inject: typeof import("vue")["inject"]
-  const isDefined: typeof import("@vueuse/core")["isDefined"]
-  const isProxy: typeof import("vue")["isProxy"]
-  const isReactive: typeof import("vue")["isReactive"]
-  const isReadonly: typeof import("vue")["isReadonly"]
-  const isRef: typeof import("vue")["isRef"]
-  const makeDestructurable: typeof import("@vueuse/core")["makeDestructurable"]
-  const mapActions: typeof import("pinia")["mapActions"]
-  const mapGetters: typeof import("pinia")["mapGetters"]
-  const mapState: typeof import("pinia")["mapState"]
-  const mapStores: typeof import("pinia")["mapStores"]
-  const mapWritableState: typeof import("pinia")["mapWritableState"]
-  const markRaw: typeof import("vue")["markRaw"]
-  const nextTick: typeof import("vue")["nextTick"]
-  const onActivated: typeof import("vue")["onActivated"]
-  const onBeforeMount: typeof import("vue")["onBeforeMount"]
-  const onBeforeRouteLeave: typeof import("vue-router")["onBeforeRouteLeave"]
-  const onBeforeRouteUpdate: typeof import("vue-router")["onBeforeRouteUpdate"]
-  const onBeforeUnmount: typeof import("vue")["onBeforeUnmount"]
-  const onBeforeUpdate: typeof import("vue")["onBeforeUpdate"]
-  const onClickOutside: typeof import("@vueuse/core")["onClickOutside"]
-  const onDeactivated: typeof import("vue")["onDeactivated"]
-  const onErrorCaptured: typeof import("vue")["onErrorCaptured"]
-  const onKeyStroke: typeof import("@vueuse/core")["onKeyStroke"]
-  const onLongPress: typeof import("@vueuse/core")["onLongPress"]
-  const onMounted: typeof import("vue")["onMounted"]
-  const onRenderTracked: typeof import("vue")["onRenderTracked"]
-  const onRenderTriggered: typeof import("vue")["onRenderTriggered"]
-  const onScopeDispose: typeof import("vue")["onScopeDispose"]
-  const onServerPrefetch: typeof import("vue")["onServerPrefetch"]
-  const onStartTyping: typeof import("@vueuse/core")["onStartTyping"]
-  const onUnmounted: typeof import("vue")["onUnmounted"]
-  const onUpdated: typeof import("vue")["onUpdated"]
-  const pausableWatch: typeof import("@vueuse/core")["pausableWatch"]
-  const provide: typeof import("vue")["provide"]
-  const reactify: typeof import("@vueuse/core")["reactify"]
-  const reactifyObject: typeof import("@vueuse/core")["reactifyObject"]
-  const reactive: typeof import("vue")["reactive"]
-  const reactiveComputed: typeof import("@vueuse/core")["reactiveComputed"]
-  const reactiveOmit: typeof import("@vueuse/core")["reactiveOmit"]
-  const reactivePick: typeof import("@vueuse/core")["reactivePick"]
-  const readonly: typeof import("vue")["readonly"]
-  const ref: typeof import("vue")["ref"]
-  const refAutoReset: typeof import("@vueuse/core")["refAutoReset"]
-  const refDebounced: typeof import("@vueuse/core")["refDebounced"]
-  const refDefault: typeof import("@vueuse/core")["refDefault"]
-  const refThrottled: typeof import("@vueuse/core")["refThrottled"]
-  const refWithControl: typeof import("@vueuse/core")["refWithControl"]
-  const resolveComponent: typeof import("vue")["resolveComponent"]
-  const resolveRef: typeof import("@vueuse/core")["resolveRef"]
-  const resolveUnref: typeof import("@vueuse/core")["resolveUnref"]
-  const setActivePinia: typeof import("pinia")["setActivePinia"]
-  const setMapStoreSuffix: typeof import("pinia")["setMapStoreSuffix"]
-  const shallowReactive: typeof import("vue")["shallowReactive"]
-  const shallowReadonly: typeof import("vue")["shallowReadonly"]
-  const shallowRef: typeof import("vue")["shallowRef"]
-  const storeToRefs: typeof import("pinia")["storeToRefs"]
-  const syncRef: typeof import("@vueuse/core")["syncRef"]
-  const syncRefs: typeof import("@vueuse/core")["syncRefs"]
-  const templateRef: typeof import("@vueuse/core")["templateRef"]
-  const throttledRef: typeof import("@vueuse/core")["throttledRef"]
-  const throttledWatch: typeof import("@vueuse/core")["throttledWatch"]
-  const toRaw: typeof import("vue")["toRaw"]
-  const toReactive: typeof import("@vueuse/core")["toReactive"]
-  const toRef: typeof import("vue")["toRef"]
-  const toRefs: typeof import("vue")["toRefs"]
-  const triggerRef: typeof import("vue")["triggerRef"]
-  const tryOnBeforeMount: typeof import("@vueuse/core")["tryOnBeforeMount"]
-  const tryOnBeforeUnmount: typeof import("@vueuse/core")["tryOnBeforeUnmount"]
-  const tryOnMounted: typeof import("@vueuse/core")["tryOnMounted"]
-  const tryOnScopeDispose: typeof import("@vueuse/core")["tryOnScopeDispose"]
-  const tryOnUnmounted: typeof import("@vueuse/core")["tryOnUnmounted"]
-  const unref: typeof import("vue")["unref"]
-  const unrefElement: typeof import("@vueuse/core")["unrefElement"]
-  const until: typeof import("@vueuse/core")["until"]
-  const useActiveElement: typeof import("@vueuse/core")["useActiveElement"]
-  const useArrayEvery: typeof import("@vueuse/core")["useArrayEvery"]
-  const useArrayFilter: typeof import("@vueuse/core")["useArrayFilter"]
-  const useArrayFind: typeof import("@vueuse/core")["useArrayFind"]
-  const useArrayFindIndex: typeof import("@vueuse/core")["useArrayFindIndex"]
-  const useArrayFindLast: typeof import("@vueuse/core")["useArrayFindLast"]
-  const useArrayJoin: typeof import("@vueuse/core")["useArrayJoin"]
-  const useArrayMap: typeof import("@vueuse/core")["useArrayMap"]
-  const useArrayReduce: typeof import("@vueuse/core")["useArrayReduce"]
-  const useArraySome: typeof import("@vueuse/core")["useArraySome"]
-  const useArrayUnique: typeof import("@vueuse/core")["useArrayUnique"]
-  const useAsyncQueue: typeof import("@vueuse/core")["useAsyncQueue"]
-  const useAsyncState: typeof import("@vueuse/core")["useAsyncState"]
-  const useAttrs: typeof import("vue")["useAttrs"]
-  const useBase64: typeof import("@vueuse/core")["useBase64"]
-  const useBattery: typeof import("@vueuse/core")["useBattery"]
-  const useBluetooth: typeof import("@vueuse/core")["useBluetooth"]
-  const useBreakpoints: typeof import("@vueuse/core")["useBreakpoints"]
-  const useBroadcastChannel: typeof import("@vueuse/core")["useBroadcastChannel"]
-  const useBrowserLocation: typeof import("@vueuse/core")["useBrowserLocation"]
-  const useCached: typeof import("@vueuse/core")["useCached"]
-  const useClipboard: typeof import("@vueuse/core")["useClipboard"]
-  const useCloned: typeof import("@vueuse/core")["useCloned"]
-  const useColorMode: typeof import("@vueuse/core")["useColorMode"]
-  const useConfirmDialog: typeof import("@vueuse/core")["useConfirmDialog"]
-  const useCounter: typeof import("@vueuse/core")["useCounter"]
-  const useCssModule: typeof import("vue")["useCssModule"]
-  const useCssVar: typeof import("@vueuse/core")["useCssVar"]
-  const useCssVars: typeof import("vue")["useCssVars"]
-  const useCurrentElement: typeof import("@vueuse/core")["useCurrentElement"]
-  const useCycleList: typeof import("@vueuse/core")["useCycleList"]
-  const useDark: typeof import("@vueuse/core")["useDark"]
-  const useDateFormat: typeof import("@vueuse/core")["useDateFormat"]
-  const useDebounce: typeof import("@vueuse/core")["useDebounce"]
-  const useDebounceFn: typeof import("@vueuse/core")["useDebounceFn"]
-  const useDebouncedRefHistory: typeof import("@vueuse/core")["useDebouncedRefHistory"]
-  const useDeviceMotion: typeof import("@vueuse/core")["useDeviceMotion"]
-  const useDeviceOrientation: typeof import("@vueuse/core")["useDeviceOrientation"]
-  const useDevicePixelRatio: typeof import("@vueuse/core")["useDevicePixelRatio"]
-  const useDevicesList: typeof import("@vueuse/core")["useDevicesList"]
-  const useDialog: typeof import("naive-ui")["useDialog"]
-  const useDisplayMedia: typeof import("@vueuse/core")["useDisplayMedia"]
-  const useDocumentVisibility: typeof import("@vueuse/core")["useDocumentVisibility"]
-  const useDraggable: typeof import("@vueuse/core")["useDraggable"]
-  const useDropZone: typeof import("@vueuse/core")["useDropZone"]
-  const useElementBounding: typeof import("@vueuse/core")["useElementBounding"]
-  const useElementByPoint: typeof import("@vueuse/core")["useElementByPoint"]
-  const useElementHover: typeof import("@vueuse/core")["useElementHover"]
-  const useElementSize: typeof import("@vueuse/core")["useElementSize"]
-  const useElementVisibility: typeof import("@vueuse/core")["useElementVisibility"]
-  const useEventBus: typeof import("@vueuse/core")["useEventBus"]
-  const useEventListener: typeof import("@vueuse/core")["useEventListener"]
-  const useEventSource: typeof import("@vueuse/core")["useEventSource"]
-  const useEyeDropper: typeof import("@vueuse/core")["useEyeDropper"]
-  const useFavicon: typeof import("@vueuse/core")["useFavicon"]
-  const useFetch: typeof import("@vueuse/core")["useFetch"]
-  const useFileDialog: typeof import("@vueuse/core")["useFileDialog"]
-  const useFileSystemAccess: typeof import("@vueuse/core")["useFileSystemAccess"]
-  const useFocus: typeof import("@vueuse/core")["useFocus"]
-  const useFocusWithin: typeof import("@vueuse/core")["useFocusWithin"]
-  const useFps: typeof import("@vueuse/core")["useFps"]
-  const useFullscreen: typeof import("@vueuse/core")["useFullscreen"]
-  const useGamepad: typeof import("@vueuse/core")["useGamepad"]
-  const useGeolocation: typeof import("@vueuse/core")["useGeolocation"]
-  const useIdle: typeof import("@vueuse/core")["useIdle"]
-  const useImage: typeof import("@vueuse/core")["useImage"]
-  const useInfiniteScroll: typeof import("@vueuse/core")["useInfiniteScroll"]
-  const useIntersectionObserver: typeof import("@vueuse/core")["useIntersectionObserver"]
-  const useInterval: typeof import("@vueuse/core")["useInterval"]
-  const useIntervalFn: typeof import("@vueuse/core")["useIntervalFn"]
-  const useKeyModifier: typeof import("@vueuse/core")["useKeyModifier"]
-  const useLastChanged: typeof import("@vueuse/core")["useLastChanged"]
-  const useLink: typeof import("vue-router")["useLink"]
-  const useLoadingBar: typeof import("naive-ui")["useLoadingBar"]
-  const useLocalStorage: typeof import("@vueuse/core")["useLocalStorage"]
-  const useMagicKeys: typeof import("@vueuse/core")["useMagicKeys"]
-  const useManualRefHistory: typeof import("@vueuse/core")["useManualRefHistory"]
-  const useMediaControls: typeof import("@vueuse/core")["useMediaControls"]
-  const useMediaQuery: typeof import("@vueuse/core")["useMediaQuery"]
-  const useMemoize: typeof import("@vueuse/core")["useMemoize"]
-  const useMemory: typeof import("@vueuse/core")["useMemory"]
-  const useMessage: typeof import("naive-ui")["useMessage"]
-  const useMounted: typeof import("@vueuse/core")["useMounted"]
-  const useMouse: typeof import("@vueuse/core")["useMouse"]
-  const useMouseInElement: typeof import("@vueuse/core")["useMouseInElement"]
-  const useMousePressed: typeof import("@vueuse/core")["useMousePressed"]
-  const useMutationObserver: typeof import("@vueuse/core")["useMutationObserver"]
-  const useNavigatorLanguage: typeof import("@vueuse/core")["useNavigatorLanguage"]
-  const useNetwork: typeof import("@vueuse/core")["useNetwork"]
-  const useNotification: typeof import("naive-ui")["useNotification"]
-  const useNow: typeof import("@vueuse/core")["useNow"]
-  const useObjectUrl: typeof import("@vueuse/core")["useObjectUrl"]
-  const useOffsetPagination: typeof import("@vueuse/core")["useOffsetPagination"]
-  const useOnline: typeof import("@vueuse/core")["useOnline"]
-  const usePageLeave: typeof import("@vueuse/core")["usePageLeave"]
-  const useParallax: typeof import("@vueuse/core")["useParallax"]
-  const usePermission: typeof import("@vueuse/core")["usePermission"]
-  const usePointer: typeof import("@vueuse/core")["usePointer"]
-  const usePointerLock: typeof import("@vueuse/core")["usePointerLock"]
-  const usePointerSwipe: typeof import("@vueuse/core")["usePointerSwipe"]
-  const usePreferredColorScheme: typeof import("@vueuse/core")["usePreferredColorScheme"]
-  const usePreferredContrast: typeof import("@vueuse/core")["usePreferredContrast"]
-  const usePreferredDark: typeof import("@vueuse/core")["usePreferredDark"]
-  const usePreferredLanguages: typeof import("@vueuse/core")["usePreferredLanguages"]
-  const usePreferredReducedMotion: typeof import("@vueuse/core")["usePreferredReducedMotion"]
-  const usePrevious: typeof import("@vueuse/core")["usePrevious"]
-  const useRafFn: typeof import("@vueuse/core")["useRafFn"]
-  const useRefHistory: typeof import("@vueuse/core")["useRefHistory"]
-  const useResizeObserver: typeof import("@vueuse/core")["useResizeObserver"]
-  const useRoute: typeof import("vue-router")["useRoute"]
-  const useRouter: typeof import("vue-router")["useRouter"]
-  const useScreenOrientation: typeof import("@vueuse/core")["useScreenOrientation"]
-  const useScreenSafeArea: typeof import("@vueuse/core")["useScreenSafeArea"]
-  const useScriptTag: typeof import("@vueuse/core")["useScriptTag"]
-  const useScroll: typeof import("@vueuse/core")["useScroll"]
-  const useScrollLock: typeof import("@vueuse/core")["useScrollLock"]
-  const useSessionStorage: typeof import("@vueuse/core")["useSessionStorage"]
-  const useShare: typeof import("@vueuse/core")["useShare"]
-  const useSlots: typeof import("vue")["useSlots"]
-  const useSorted: typeof import("@vueuse/core")["useSorted"]
-  const useSpeechRecognition: typeof import("@vueuse/core")["useSpeechRecognition"]
-  const useSpeechSynthesis: typeof import("@vueuse/core")["useSpeechSynthesis"]
-  const useStepper: typeof import("@vueuse/core")["useStepper"]
-  const useStorage: typeof import("@vueuse/core")["useStorage"]
-  const useStorageAsync: typeof import("@vueuse/core")["useStorageAsync"]
-  const useStyleTag: typeof import("@vueuse/core")["useStyleTag"]
-  const useSupported: typeof import("@vueuse/core")["useSupported"]
-  const useSwipe: typeof import("@vueuse/core")["useSwipe"]
-  const useTemplateRefsList: typeof import("@vueuse/core")["useTemplateRefsList"]
-  const useTextDirection: typeof import("@vueuse/core")["useTextDirection"]
-  const useTextSelection: typeof import("@vueuse/core")["useTextSelection"]
-  const useTextareaAutosize: typeof import("@vueuse/core")["useTextareaAutosize"]
-  const useThrottle: typeof import("@vueuse/core")["useThrottle"]
-  const useThrottleFn: typeof import("@vueuse/core")["useThrottleFn"]
-  const useThrottledRefHistory: typeof import("@vueuse/core")["useThrottledRefHistory"]
-  const useTimeAgo: typeof import("@vueuse/core")["useTimeAgo"]
-  const useTimeout: typeof import("@vueuse/core")["useTimeout"]
-  const useTimeoutFn: typeof import("@vueuse/core")["useTimeoutFn"]
-  const useTimeoutPoll: typeof import("@vueuse/core")["useTimeoutPoll"]
-  const useTimestamp: typeof import("@vueuse/core")["useTimestamp"]
-  const useTitle: typeof import("@vueuse/core")["useTitle"]
-  const useToNumber: typeof import("@vueuse/core")["useToNumber"]
-  const useToString: typeof import("@vueuse/core")["useToString"]
-  const useToggle: typeof import("@vueuse/core")["useToggle"]
-  const useTransition: typeof import("@vueuse/core")["useTransition"]
-  const useUrlSearchParams: typeof import("@vueuse/core")["useUrlSearchParams"]
-  const useUserMedia: typeof import("@vueuse/core")["useUserMedia"]
-  const useVModel: typeof import("@vueuse/core")["useVModel"]
-  const useVModels: typeof import("@vueuse/core")["useVModels"]
-  const useVibrate: typeof import("@vueuse/core")["useVibrate"]
-  const useVirtualList: typeof import("@vueuse/core")["useVirtualList"]
-  const useWakeLock: typeof import("@vueuse/core")["useWakeLock"]
-  const useWebNotification: typeof import("@vueuse/core")["useWebNotification"]
-  const useWebSocket: typeof import("@vueuse/core")["useWebSocket"]
-  const useWebWorker: typeof import("@vueuse/core")["useWebWorker"]
-  const useWebWorkerFn: typeof import("@vueuse/core")["useWebWorkerFn"]
-  const useWindowFocus: typeof import("@vueuse/core")["useWindowFocus"]
-  const useWindowScroll: typeof import("@vueuse/core")["useWindowScroll"]
-  const useWindowSize: typeof import("@vueuse/core")["useWindowSize"]
-  const watch: typeof import("vue")["watch"]
-  const watchArray: typeof import("@vueuse/core")["watchArray"]
-  const watchAtMost: typeof import("@vueuse/core")["watchAtMost"]
-  const watchDebounced: typeof import("@vueuse/core")["watchDebounced"]
-  const watchEffect: typeof import("vue")["watchEffect"]
-  const watchIgnorable: typeof import("@vueuse/core")["watchIgnorable"]
-  const watchOnce: typeof import("@vueuse/core")["watchOnce"]
-  const watchPausable: typeof import("@vueuse/core")["watchPausable"]
-  const watchPostEffect: typeof import("vue")["watchPostEffect"]
-  const watchSyncEffect: typeof import("vue")["watchSyncEffect"]
-  const watchThrottled: typeof import("@vueuse/core")["watchThrottled"]
-  const watchTriggerable: typeof import("@vueuse/core")["watchTriggerable"]
-  const watchWithFilter: typeof import("@vueuse/core")["watchWithFilter"]
-  const whenever: typeof import("@vueuse/core")["whenever"]
+  const EffectScope: typeof import('vue')['EffectScope']
+  const acceptHMRUpdate: typeof import('pinia')['acceptHMRUpdate']
+  const asyncComputed: typeof import('@vueuse/core')['asyncComputed']
+  const autoResetRef: typeof import('@vueuse/core')['autoResetRef']
+  const computed: typeof import('vue')['computed']
+  const computedAsync: typeof import('@vueuse/core')['computedAsync']
+  const computedEager: typeof import('@vueuse/core')['computedEager']
+  const computedInject: typeof import('@vueuse/core')['computedInject']
+  const computedWithControl: typeof import('@vueuse/core')['computedWithControl']
+  const controlledComputed: typeof import('@vueuse/core')['controlledComputed']
+  const controlledRef: typeof import('@vueuse/core')['controlledRef']
+  const createApp: typeof import('vue')['createApp']
+  const createEventHook: typeof import('@vueuse/core')['createEventHook']
+  const createGlobalState: typeof import('@vueuse/core')['createGlobalState']
+  const createInjectionState: typeof import('@vueuse/core')['createInjectionState']
+  const createPinia: typeof import('pinia')['createPinia']
+  const createReactiveFn: typeof import('@vueuse/core')['createReactiveFn']
+  const createSharedComposable: typeof import('@vueuse/core')['createSharedComposable']
+  const createUnrefFn: typeof import('@vueuse/core')['createUnrefFn']
+  const customRef: typeof import('vue')['customRef']
+  const debouncedRef: typeof import('@vueuse/core')['debouncedRef']
+  const debouncedWatch: typeof import('@vueuse/core')['debouncedWatch']
+  const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
+  const defineComponent: typeof import('vue')['defineComponent']
+  const defineStore: typeof import('pinia')['defineStore']
+  const eagerComputed: typeof import('@vueuse/core')['eagerComputed']
+  const effectScope: typeof import('vue')['effectScope']
+  const extendRef: typeof import('@vueuse/core')['extendRef']
+  const getActivePinia: typeof import('pinia')['getActivePinia']
+  const getCurrentInstance: typeof import('vue')['getCurrentInstance']
+  const getCurrentScope: typeof import('vue')['getCurrentScope']
+  const h: typeof import('vue')['h']
+  const ignorableWatch: typeof import('@vueuse/core')['ignorableWatch']
+  const inject: typeof import('vue')['inject']
+  const isDefined: typeof import('@vueuse/core')['isDefined']
+  const isProxy: typeof import('vue')['isProxy']
+  const isReactive: typeof import('vue')['isReactive']
+  const isReadonly: typeof import('vue')['isReadonly']
+  const isRef: typeof import('vue')['isRef']
+  const makeDestructurable: typeof import('@vueuse/core')['makeDestructurable']
+  const mapActions: typeof import('pinia')['mapActions']
+  const mapGetters: typeof import('pinia')['mapGetters']
+  const mapState: typeof import('pinia')['mapState']
+  const mapStores: typeof import('pinia')['mapStores']
+  const mapWritableState: typeof import('pinia')['mapWritableState']
+  const markRaw: typeof import('vue')['markRaw']
+  const nextTick: typeof import('vue')['nextTick']
+  const onActivated: typeof import('vue')['onActivated']
+  const onBeforeMount: typeof import('vue')['onBeforeMount']
+  const onBeforeRouteLeave: typeof import('vue-router')['onBeforeRouteLeave']
+  const onBeforeRouteUpdate: typeof import('vue-router')['onBeforeRouteUpdate']
+  const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
+  const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
+  const onClickOutside: typeof import('@vueuse/core')['onClickOutside']
+  const onDeactivated: typeof import('vue')['onDeactivated']
+  const onErrorCaptured: typeof import('vue')['onErrorCaptured']
+  const onKeyStroke: typeof import('@vueuse/core')['onKeyStroke']
+  const onLongPress: typeof import('@vueuse/core')['onLongPress']
+  const onMounted: typeof import('vue')['onMounted']
+  const onRenderTracked: typeof import('vue')['onRenderTracked']
+  const onRenderTriggered: typeof import('vue')['onRenderTriggered']
+  const onScopeDispose: typeof import('vue')['onScopeDispose']
+  const onServerPrefetch: typeof import('vue')['onServerPrefetch']
+  const onStartTyping: typeof import('@vueuse/core')['onStartTyping']
+  const onUnmounted: typeof import('vue')['onUnmounted']
+  const onUpdated: typeof import('vue')['onUpdated']
+  const pausableWatch: typeof import('@vueuse/core')['pausableWatch']
+  const provide: typeof import('vue')['provide']
+  const reactify: typeof import('@vueuse/core')['reactify']
+  const reactifyObject: typeof import('@vueuse/core')['reactifyObject']
+  const reactive: typeof import('vue')['reactive']
+  const reactiveComputed: typeof import('@vueuse/core')['reactiveComputed']
+  const reactiveOmit: typeof import('@vueuse/core')['reactiveOmit']
+  const reactivePick: typeof import('@vueuse/core')['reactivePick']
+  const readonly: typeof import('vue')['readonly']
+  const ref: typeof import('vue')['ref']
+  const refAutoReset: typeof import('@vueuse/core')['refAutoReset']
+  const refDebounced: typeof import('@vueuse/core')['refDebounced']
+  const refDefault: typeof import('@vueuse/core')['refDefault']
+  const refThrottled: typeof import('@vueuse/core')['refThrottled']
+  const refWithControl: typeof import('@vueuse/core')['refWithControl']
+  const resolveComponent: typeof import('vue')['resolveComponent']
+  const resolveRef: typeof import('@vueuse/core')['resolveRef']
+  const resolveUnref: typeof import('@vueuse/core')['resolveUnref']
+  const setActivePinia: typeof import('pinia')['setActivePinia']
+  const setMapStoreSuffix: typeof import('pinia')['setMapStoreSuffix']
+  const shallowReactive: typeof import('vue')['shallowReactive']
+  const shallowReadonly: typeof import('vue')['shallowReadonly']
+  const shallowRef: typeof import('vue')['shallowRef']
+  const storeToRefs: typeof import('pinia')['storeToRefs']
+  const syncRef: typeof import('@vueuse/core')['syncRef']
+  const syncRefs: typeof import('@vueuse/core')['syncRefs']
+  const templateRef: typeof import('@vueuse/core')['templateRef']
+  const throttledRef: typeof import('@vueuse/core')['throttledRef']
+  const throttledWatch: typeof import('@vueuse/core')['throttledWatch']
+  const toRaw: typeof import('vue')['toRaw']
+  const toReactive: typeof import('@vueuse/core')['toReactive']
+  const toRef: typeof import('vue')['toRef']
+  const toRefs: typeof import('vue')['toRefs']
+  const triggerRef: typeof import('vue')['triggerRef']
+  const tryOnBeforeMount: typeof import('@vueuse/core')['tryOnBeforeMount']
+  const tryOnBeforeUnmount: typeof import('@vueuse/core')['tryOnBeforeUnmount']
+  const tryOnMounted: typeof import('@vueuse/core')['tryOnMounted']
+  const tryOnScopeDispose: typeof import('@vueuse/core')['tryOnScopeDispose']
+  const tryOnUnmounted: typeof import('@vueuse/core')['tryOnUnmounted']
+  const unref: typeof import('vue')['unref']
+  const unrefElement: typeof import('@vueuse/core')['unrefElement']
+  const until: typeof import('@vueuse/core')['until']
+  const useActiveElement: typeof import('@vueuse/core')['useActiveElement']
+  const useArrayEvery: typeof import('@vueuse/core')['useArrayEvery']
+  const useArrayFilter: typeof import('@vueuse/core')['useArrayFilter']
+  const useArrayFind: typeof import('@vueuse/core')['useArrayFind']
+  const useArrayFindIndex: typeof import('@vueuse/core')['useArrayFindIndex']
+  const useArrayFindLast: typeof import('@vueuse/core')['useArrayFindLast']
+  const useArrayJoin: typeof import('@vueuse/core')['useArrayJoin']
+  const useArrayMap: typeof import('@vueuse/core')['useArrayMap']
+  const useArrayReduce: typeof import('@vueuse/core')['useArrayReduce']
+  const useArraySome: typeof import('@vueuse/core')['useArraySome']
+  const useArrayUnique: typeof import('@vueuse/core')['useArrayUnique']
+  const useAsyncQueue: typeof import('@vueuse/core')['useAsyncQueue']
+  const useAsyncState: typeof import('@vueuse/core')['useAsyncState']
+  const useAttrs: typeof import('vue')['useAttrs']
+  const useBase64: typeof import('@vueuse/core')['useBase64']
+  const useBattery: typeof import('@vueuse/core')['useBattery']
+  const useBluetooth: typeof import('@vueuse/core')['useBluetooth']
+  const useBreakpoints: typeof import('@vueuse/core')['useBreakpoints']
+  const useBroadcastChannel: typeof import('@vueuse/core')['useBroadcastChannel']
+  const useBrowserLocation: typeof import('@vueuse/core')['useBrowserLocation']
+  const useCached: typeof import('@vueuse/core')['useCached']
+  const useClipboard: typeof import('@vueuse/core')['useClipboard']
+  const useCloned: typeof import('@vueuse/core')['useCloned']
+  const useColorMode: typeof import('@vueuse/core')['useColorMode']
+  const useConfirmDialog: typeof import('@vueuse/core')['useConfirmDialog']
+  const useCounter: typeof import('@vueuse/core')['useCounter']
+  const useCssModule: typeof import('vue')['useCssModule']
+  const useCssVar: typeof import('@vueuse/core')['useCssVar']
+  const useCssVars: typeof import('vue')['useCssVars']
+  const useCurrentElement: typeof import('@vueuse/core')['useCurrentElement']
+  const useCycleList: typeof import('@vueuse/core')['useCycleList']
+  const useDark: typeof import('@vueuse/core')['useDark']
+  const useDateFormat: typeof import('@vueuse/core')['useDateFormat']
+  const useDebounce: typeof import('@vueuse/core')['useDebounce']
+  const useDebounceFn: typeof import('@vueuse/core')['useDebounceFn']
+  const useDebouncedRefHistory: typeof import('@vueuse/core')['useDebouncedRefHistory']
+  const useDeviceMotion: typeof import('@vueuse/core')['useDeviceMotion']
+  const useDeviceOrientation: typeof import('@vueuse/core')['useDeviceOrientation']
+  const useDevicePixelRatio: typeof import('@vueuse/core')['useDevicePixelRatio']
+  const useDevicesList: typeof import('@vueuse/core')['useDevicesList']
+  const useDialog: typeof import('naive-ui')['useDialog']
+  const useDisplayMedia: typeof import('@vueuse/core')['useDisplayMedia']
+  const useDocumentVisibility: typeof import('@vueuse/core')['useDocumentVisibility']
+  const useDraggable: typeof import('@vueuse/core')['useDraggable']
+  const useDropZone: typeof import('@vueuse/core')['useDropZone']
+  const useElementBounding: typeof import('@vueuse/core')['useElementBounding']
+  const useElementByPoint: typeof import('@vueuse/core')['useElementByPoint']
+  const useElementHover: typeof import('@vueuse/core')['useElementHover']
+  const useElementSize: typeof import('@vueuse/core')['useElementSize']
+  const useElementVisibility: typeof import('@vueuse/core')['useElementVisibility']
+  const useEventBus: typeof import('@vueuse/core')['useEventBus']
+  const useEventListener: typeof import('@vueuse/core')['useEventListener']
+  const useEventSource: typeof import('@vueuse/core')['useEventSource']
+  const useEyeDropper: typeof import('@vueuse/core')['useEyeDropper']
+  const useFavicon: typeof import('@vueuse/core')['useFavicon']
+  const useFetch: typeof import('@vueuse/core')['useFetch']
+  const useFileDialog: typeof import('@vueuse/core')['useFileDialog']
+  const useFileSystemAccess: typeof import('@vueuse/core')['useFileSystemAccess']
+  const useFocus: typeof import('@vueuse/core')['useFocus']
+  const useFocusWithin: typeof import('@vueuse/core')['useFocusWithin']
+  const useFps: typeof import('@vueuse/core')['useFps']
+  const useFullscreen: typeof import('@vueuse/core')['useFullscreen']
+  const useGamepad: typeof import('@vueuse/core')['useGamepad']
+  const useGeolocation: typeof import('@vueuse/core')['useGeolocation']
+  const useIdle: typeof import('@vueuse/core')['useIdle']
+  const useImage: typeof import('@vueuse/core')['useImage']
+  const useInfiniteScroll: typeof import('@vueuse/core')['useInfiniteScroll']
+  const useIntersectionObserver: typeof import('@vueuse/core')['useIntersectionObserver']
+  const useInterval: typeof import('@vueuse/core')['useInterval']
+  const useIntervalFn: typeof import('@vueuse/core')['useIntervalFn']
+  const useKeyModifier: typeof import('@vueuse/core')['useKeyModifier']
+  const useLastChanged: typeof import('@vueuse/core')['useLastChanged']
+  const useLink: typeof import('vue-router')['useLink']
+  const useLoadingBar: typeof import('naive-ui')['useLoadingBar']
+  const useLocalStorage: typeof import('@vueuse/core')['useLocalStorage']
+  const useMagicKeys: typeof import('@vueuse/core')['useMagicKeys']
+  const useManualRefHistory: typeof import('@vueuse/core')['useManualRefHistory']
+  const useMediaControls: typeof import('@vueuse/core')['useMediaControls']
+  const useMediaQuery: typeof import('@vueuse/core')['useMediaQuery']
+  const useMemoize: typeof import('@vueuse/core')['useMemoize']
+  const useMemory: typeof import('@vueuse/core')['useMemory']
+  const useMessage: typeof import('naive-ui')['useMessage']
+  const useMounted: typeof import('@vueuse/core')['useMounted']
+  const useMouse: typeof import('@vueuse/core')['useMouse']
+  const useMouseInElement: typeof import('@vueuse/core')['useMouseInElement']
+  const useMousePressed: typeof import('@vueuse/core')['useMousePressed']
+  const useMutationObserver: typeof import('@vueuse/core')['useMutationObserver']
+  const useNavigatorLanguage: typeof import('@vueuse/core')['useNavigatorLanguage']
+  const useNetwork: typeof import('@vueuse/core')['useNetwork']
+  const useNotification: typeof import('naive-ui')['useNotification']
+  const useNow: typeof import('@vueuse/core')['useNow']
+  const useObjectUrl: typeof import('@vueuse/core')['useObjectUrl']
+  const useOffsetPagination: typeof import('@vueuse/core')['useOffsetPagination']
+  const useOnline: typeof import('@vueuse/core')['useOnline']
+  const usePageLeave: typeof import('@vueuse/core')['usePageLeave']
+  const useParallax: typeof import('@vueuse/core')['useParallax']
+  const usePermission: typeof import('@vueuse/core')['usePermission']
+  const usePointer: typeof import('@vueuse/core')['usePointer']
+  const usePointerLock: typeof import('@vueuse/core')['usePointerLock']
+  const usePointerSwipe: typeof import('@vueuse/core')['usePointerSwipe']
+  const usePreferredColorScheme: typeof import('@vueuse/core')['usePreferredColorScheme']
+  const usePreferredContrast: typeof import('@vueuse/core')['usePreferredContrast']
+  const usePreferredDark: typeof import('@vueuse/core')['usePreferredDark']
+  const usePreferredLanguages: typeof import('@vueuse/core')['usePreferredLanguages']
+  const usePreferredReducedMotion: typeof import('@vueuse/core')['usePreferredReducedMotion']
+  const usePrevious: typeof import('@vueuse/core')['usePrevious']
+  const useRafFn: typeof import('@vueuse/core')['useRafFn']
+  const useRefHistory: typeof import('@vueuse/core')['useRefHistory']
+  const useResizeObserver: typeof import('@vueuse/core')['useResizeObserver']
+  const useRoute: typeof import('vue-router')['useRoute']
+  const useRouter: typeof import('vue-router')['useRouter']
+  const useScreenOrientation: typeof import('@vueuse/core')['useScreenOrientation']
+  const useScreenSafeArea: typeof import('@vueuse/core')['useScreenSafeArea']
+  const useScriptTag: typeof import('@vueuse/core')['useScriptTag']
+  const useScroll: typeof import('@vueuse/core')['useScroll']
+  const useScrollLock: typeof import('@vueuse/core')['useScrollLock']
+  const useSessionStorage: typeof import('@vueuse/core')['useSessionStorage']
+  const useShare: typeof import('@vueuse/core')['useShare']
+  const useSlots: typeof import('vue')['useSlots']
+  const useSorted: typeof import('@vueuse/core')['useSorted']
+  const useSpeechRecognition: typeof import('@vueuse/core')['useSpeechRecognition']
+  const useSpeechSynthesis: typeof import('@vueuse/core')['useSpeechSynthesis']
+  const useStepper: typeof import('@vueuse/core')['useStepper']
+  const useStorage: typeof import('@vueuse/core')['useStorage']
+  const useStorageAsync: typeof import('@vueuse/core')['useStorageAsync']
+  const useStyleTag: typeof import('@vueuse/core')['useStyleTag']
+  const useSupported: typeof import('@vueuse/core')['useSupported']
+  const useSwipe: typeof import('@vueuse/core')['useSwipe']
+  const useTemplateRefsList: typeof import('@vueuse/core')['useTemplateRefsList']
+  const useTextDirection: typeof import('@vueuse/core')['useTextDirection']
+  const useTextSelection: typeof import('@vueuse/core')['useTextSelection']
+  const useTextareaAutosize: typeof import('@vueuse/core')['useTextareaAutosize']
+  const useThrottle: typeof import('@vueuse/core')['useThrottle']
+  const useThrottleFn: typeof import('@vueuse/core')['useThrottleFn']
+  const useThrottledRefHistory: typeof import('@vueuse/core')['useThrottledRefHistory']
+  const useTimeAgo: typeof import('@vueuse/core')['useTimeAgo']
+  const useTimeout: typeof import('@vueuse/core')['useTimeout']
+  const useTimeoutFn: typeof import('@vueuse/core')['useTimeoutFn']
+  const useTimeoutPoll: typeof import('@vueuse/core')['useTimeoutPoll']
+  const useTimestamp: typeof import('@vueuse/core')['useTimestamp']
+  const useTitle: typeof import('@vueuse/core')['useTitle']
+  const useToNumber: typeof import('@vueuse/core')['useToNumber']
+  const useToString: typeof import('@vueuse/core')['useToString']
+  const useToggle: typeof import('@vueuse/core')['useToggle']
+  const useTransition: typeof import('@vueuse/core')['useTransition']
+  const useUrlSearchParams: typeof import('@vueuse/core')['useUrlSearchParams']
+  const useUserMedia: typeof import('@vueuse/core')['useUserMedia']
+  const useVModel: typeof import('@vueuse/core')['useVModel']
+  const useVModels: typeof import('@vueuse/core')['useVModels']
+  const useVibrate: typeof import('@vueuse/core')['useVibrate']
+  const useVirtualList: typeof import('@vueuse/core')['useVirtualList']
+  const useWakeLock: typeof import('@vueuse/core')['useWakeLock']
+  const useWebNotification: typeof import('@vueuse/core')['useWebNotification']
+  const useWebSocket: typeof import('@vueuse/core')['useWebSocket']
+  const useWebWorker: typeof import('@vueuse/core')['useWebWorker']
+  const useWebWorkerFn: typeof import('@vueuse/core')['useWebWorkerFn']
+  const useWindowFocus: typeof import('@vueuse/core')['useWindowFocus']
+  const useWindowScroll: typeof import('@vueuse/core')['useWindowScroll']
+  const useWindowSize: typeof import('@vueuse/core')['useWindowSize']
+  const watch: typeof import('vue')['watch']
+  const watchArray: typeof import('@vueuse/core')['watchArray']
+  const watchAtMost: typeof import('@vueuse/core')['watchAtMost']
+  const watchDebounced: typeof import('@vueuse/core')['watchDebounced']
+  const watchEffect: typeof import('vue')['watchEffect']
+  const watchIgnorable: typeof import('@vueuse/core')['watchIgnorable']
+  const watchOnce: typeof import('@vueuse/core')['watchOnce']
+  const watchPausable: typeof import('@vueuse/core')['watchPausable']
+  const watchPostEffect: typeof import('vue')['watchPostEffect']
+  const watchSyncEffect: typeof import('vue')['watchSyncEffect']
+  const watchThrottled: typeof import('@vueuse/core')['watchThrottled']
+  const watchTriggerable: typeof import('@vueuse/core')['watchTriggerable']
+  const watchWithFilter: typeof import('@vueuse/core')['watchWithFilter']
+  const whenever: typeof import('@vueuse/core')['whenever']
 }
 // for type re-export
 declare global {
   // @ts-ignore
-  export type {
-    Component,
-    ComponentPublicInstance,
-    ComputedRef,
-    InjectionKey,
-    PropType,
-    Ref,
-    VNode,
-  } from "vue"
+  export type { Component,ComponentPublicInstance,ComputedRef,InjectionKey,PropType,Ref,VNode } from 'vue'
 }
diff --git a/src/components.d.ts b/src/components.d.ts
index e1d1e4b..2658adf 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -7,53 +7,51 @@ import '@vue/runtime-core'
 
 export {}
 
-declare module "@vue/runtime-core" {
+declare module '@vue/runtime-core' {
   export interface GlobalComponents {
-    IEpBell: typeof import("~icons/ep/bell")["default"]
-    IEpCaretRight: typeof import("~icons/ep/caret-right")["default"]
-    IEpLoading: typeof import("~icons/ep/loading")["default"]
-    IEpLock: typeof import("~icons/ep/lock")["default"]
-    IEpMenu: typeof import("~icons/ep/menu")["default"]
-    IEpMoon: typeof import("~icons/ep/moon")["default"]
-    IEpMoreFilled: typeof import("~icons/ep/more-filled")["default"]
-    IEpSunny: typeof import("~icons/ep/sunny")["default"]
-    NAlert: typeof import("naive-ui")["NAlert"]
-    NAvatar: typeof import("naive-ui")["NAvatar"]
-    NButton: typeof import("naive-ui")["NButton"]
-    NCard: typeof import("naive-ui")["NCard"]
-    NCode: typeof import("naive-ui")["NCode"]
-    NConfigProvider: typeof import("naive-ui")["NConfigProvider"]
-    NCountdown: typeof import("naive-ui")["NCountdown"]
-    NDataTable: typeof import("naive-ui")["NDataTable"]
-    NDescriptions: typeof import("naive-ui")["NDescriptions"]
-    NDescriptionsItem: typeof import("naive-ui")["NDescriptionsItem"]
-    NDropdown: typeof import("naive-ui")["NDropdown"]
-    NEmpty: typeof import("naive-ui")["NEmpty"]
-    NForm: typeof import("naive-ui")["NForm"]
-    NFormItem: typeof import("naive-ui")["NFormItem"]
-    NGi: typeof import("naive-ui")["NGi"]
-    NGrid: typeof import("naive-ui")["NGrid"]
-    NIcon: typeof import("naive-ui")["NIcon"]
-    NImage: typeof import("naive-ui")["NImage"]
-    NInput: typeof import("naive-ui")["NInput"]
-    NLayout: typeof import("naive-ui")["NLayout"]
-    NLayoutContent: typeof import("naive-ui")["NLayoutContent"]
-    NLayoutHeader: typeof import("naive-ui")["NLayoutHeader"]
-    NMenu: typeof import("naive-ui")["NMenu"]
-    NMessageProvider: typeof import("naive-ui")["NMessageProvider"]
-    NModal: typeof import("naive-ui")["NModal"]
-    NPagination: typeof import("naive-ui")["NPagination"]
-    NPopover: typeof import("naive-ui")["NPopover"]
-    NScrollbar: typeof import("naive-ui")["NScrollbar"]
-    NSelect: typeof import("naive-ui")["NSelect"]
-    NSpace: typeof import("naive-ui")["NSpace"]
-    NSwitch: typeof import("naive-ui")["NSwitch"]
-    NTabPane: typeof import("naive-ui")["NTabPane"]
-    NTabs: typeof import("naive-ui")["NTabs"]
-    NTag: typeof import("naive-ui")["NTag"]
-    NTooltip: typeof import("naive-ui")["NTooltip"]
-    NUpload: typeof import("naive-ui")["NUpload"]
-    RouterLink: typeof import("vue-router")["RouterLink"]
-    RouterView: typeof import("vue-router")["RouterView"]
+    IEpBell: typeof import('~icons/ep/bell')['default']
+    IEpCaretRight: typeof import('~icons/ep/caret-right')['default']
+    IEpLoading: typeof import('~icons/ep/loading')['default']
+    IEpLock: typeof import('~icons/ep/lock')['default']
+    IEpMenu: typeof import('~icons/ep/menu')['default']
+    IEpMoon: typeof import('~icons/ep/moon')['default']
+    IEpMoreFilled: typeof import('~icons/ep/more-filled')['default']
+    IEpSunny: typeof import('~icons/ep/sunny')['default']
+    NAlert: typeof import('naive-ui')['NAlert']
+    NAvatar: typeof import('naive-ui')['NAvatar']
+    NButton: typeof import('naive-ui')['NButton']
+    NCard: typeof import('naive-ui')['NCard']
+    NCode: typeof import('naive-ui')['NCode']
+    NConfigProvider: typeof import('naive-ui')['NConfigProvider']
+    NDataTable: typeof import('naive-ui')['NDataTable']
+    NDescriptions: typeof import('naive-ui')['NDescriptions']
+    NDescriptionsItem: typeof import('naive-ui')['NDescriptionsItem']
+    NDropdown: typeof import('naive-ui')['NDropdown']
+    NEmpty: typeof import('naive-ui')['NEmpty']
+    NForm: typeof import('naive-ui')['NForm']
+    NFormItem: typeof import('naive-ui')['NFormItem']
+    NGi: typeof import('naive-ui')['NGi']
+    NGrid: typeof import('naive-ui')['NGrid']
+    NIcon: typeof import('naive-ui')['NIcon']
+    NInput: typeof import('naive-ui')['NInput']
+    NLayout: typeof import('naive-ui')['NLayout']
+    NLayoutContent: typeof import('naive-ui')['NLayoutContent']
+    NLayoutHeader: typeof import('naive-ui')['NLayoutHeader']
+    NMenu: typeof import('naive-ui')['NMenu']
+    NMessageProvider: typeof import('naive-ui')['NMessageProvider']
+    NModal: typeof import('naive-ui')['NModal']
+    NPagination: typeof import('naive-ui')['NPagination']
+    NPopover: typeof import('naive-ui')['NPopover']
+    NScrollbar: typeof import('naive-ui')['NScrollbar']
+    NSelect: typeof import('naive-ui')['NSelect']
+    NSpace: typeof import('naive-ui')['NSpace']
+    NSwitch: typeof import('naive-ui')['NSwitch']
+    NTabPane: typeof import('naive-ui')['NTabPane']
+    NTabs: typeof import('naive-ui')['NTabs']
+    NTag: typeof import('naive-ui')['NTag']
+    NTooltip: typeof import('naive-ui')['NTooltip']
+    NUpload: typeof import('naive-ui')['NUpload']
+    RouterLink: typeof import('vue-router')['RouterLink']
+    RouterView: typeof import('vue-router')['RouterView']
   }
 }
diff --git a/src/oj/contest/components/ContestMenu.vue b/src/oj/contest/components/ContestMenu.vue
index f955072..24ba779 100644
--- a/src/oj/contest/components/ContestMenu.vue
+++ b/src/oj/contest/components/ContestMenu.vue
@@ -2,6 +2,7 @@
 import { DropdownOption } from "naive-ui"
 import { useContestStore } from "oj/store/contest"
 import { isDesktop } from "~/shared/composables/breakpoints"
+import { ContestStatus } from "~/utils/constants"
 
 const route = useRoute()
 const router = useRouter()
@@ -10,7 +11,7 @@ const contestStore = useContestStore()
 const contestMenuVisible = computed(() => {
   if (contestStore.isContestAdmin) return true
   if (!contestStore.isPrivate) {
-    // TODO:这里没有完成
+    return contestStore.contestStatus !== ContestStatus.not_started
   }
   return contestStore.access
 })
diff --git a/src/oj/contest/components/ContestTitle.vue b/src/oj/contest/components/ContestTitle.vue
index 7272355..57182b2 100644
--- a/src/oj/contest/components/ContestTitle.vue
+++ b/src/oj/contest/components/ContestTitle.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import { Contest } from "~/utils/types"
-import { ContestType } from "~/utils/constants"
+import { Contest } from "utils/types"
+import { ContestType } from "utils/constants"
 
 defineProps<{ contest: Contest }>()
 </script>
@@ -8,6 +8,7 @@ defineProps<{ contest: Contest }>()
   <n-space>
     <span>{{ contest.title }}</span>
     <n-icon
+      size="medium"
       class="lockIcon"
       v-if="contest.contest_type === ContestType.private"
     >
diff --git a/src/oj/contest/detail.vue b/src/oj/contest/detail.vue
index 64a1181..0ae4f02 100644
--- a/src/oj/contest/detail.vue
+++ b/src/oj/contest/detail.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { CONTEST_STATUS } from "utils/constants"
+import { CONTEST_STATUS, ContestStatus } from "utils/constants"
 import { isDesktop } from "~/shared/composables/breakpoints"
 import { useContestStore } from "../store/contest"
 import ContestInfo from "./components/ContestInfo.vue"
@@ -12,7 +12,13 @@ const contestStore = useContestStore()
 
 const password = ref("")
 
-onMounted(() => contestStore.init(props.contestID))
+onMounted(() => {
+  contestStore.init(props.contestID)
+})
+
+onBeforeUnmount(() => {
+  contestStore.clear()
+})
 
 const passwordFormVisible = computed(
   () =>
@@ -26,15 +32,15 @@ const passwordFormVisible = computed(
   <div v-if="contestStore.contest">
     <n-space class="title" align="center" justify="space-between">
       <n-space align="center">
-        <n-tag :type="CONTEST_STATUS[contestStore.contest.status]['type']">
-          {{ CONTEST_STATUS[contestStore.contest.status]["name"] }}
-        </n-tag>
         <h2 class="contestTitle">{{ contestStore.contest.title }}</h2>
-        <n-icon v-if="contestStore.isPrivate" class="lockIcon">
+        <n-icon size="large" v-if="contestStore.isPrivate" class="lockIcon">
           <i-ep-lock />
         </n-icon>
+        <n-tag :type="CONTEST_STATUS[contestStore.contestStatus]['type']">
+          {{ contestStore.countdown }}
+        </n-tag>
       </n-space>
-      <n-space>
+      <n-space align="center">
         <ContestInfo />
         <ContestMenu />
       </n-space>
diff --git a/src/oj/contest/pages/problems.vue b/src/oj/contest/pages/problems.vue
index de0745a..9fadc94 100644
--- a/src/oj/contest/pages/problems.vue
+++ b/src/oj/contest/pages/problems.vue
@@ -35,11 +35,9 @@ function rowProps(row: ProblemFiltered) {
   <n-data-table
     striped
     size="small"
-    class="problems"
     :data="contestStore.problems"
     :columns="problemsColumns"
     :row-props="rowProps"
-    v-if="contestStore.problems?.length"
   />
 </template>
 
diff --git a/src/oj/store/contest.ts b/src/oj/store/contest.ts
index 042367b..6b975d0 100644
--- a/src/oj/store/contest.ts
+++ b/src/oj/store/contest.ts
@@ -1,5 +1,7 @@
+import { formatISO, getTime, intervalToDuration, parseISO } from "date-fns"
 import { useUserStore } from "~/shared/store/user"
-import { ContestType } from "~/utils/constants"
+import { ContestStatus, ContestType } from "~/utils/constants"
+import { duration } from "~/utils/functions"
 import { Contest, Problem } from "~/utils/types"
 import {
   getContest,
@@ -11,27 +13,58 @@ import {
 export const useContestStore = defineStore("contest", () => {
   const userStore = useUserStore()
   const message = useMessage()
-  const [access, toggleAccess] = useToggle()
-  const contest = ref<Contest>()
+  const [access, toggleAccess] = useToggle(false)
+  const contest = ref<Contest | null>(null)
   const problems = ref<Problem[]>([])
+  const now = ref(0)
 
-  const contestStatus = computed(() => {
-    return false
+  let timer = 0
+
+  const contestStatus = computed<ContestStatus>(() => {
+    const start = getTime(parseISO(contest.value!.start_time.toString()))
+    const end = getTime(parseISO(contest.value!.end_time.toString()))
+    if (start > now.value) {
+      return ContestStatus.not_started
+    } else if (end < now.value) {
+      return ContestStatus.finished
+    } else {
+      return ContestStatus.underway
+    }
+  })
+
+  const countdown = computed(() => {
+    if (contestStatus.value === ContestStatus.finished) {
+      return "已结束"
+    } else if (contestStatus.value === ContestStatus.not_started) {
+      const d = duration(formatISO(now.value), contest.value!.start_time, true)
+      return "距离比赛开始 " + d
+    } else {
+      const d = duration(formatISO(now.value), contest.value!.end_time, true)
+      return "距离比赛结束 " + d
+    }
   })
 
   const isContestAdmin = computed(
     () =>
       userStore.isSuperAdmin ||
-      (userStore.isAuthed && contest.value?.created_by.id === userStore.user.id)
+      (userStore.isAuthed &&
+        contest.value?.created_by.id === userStore.user!.id)
   )
 
   const isPrivate = computed(
-    () => contest.value?.contest_type === ContestType.private
+    () => contest.value!.contest_type === ContestType.private
   )
 
   async function init(contestID: string) {
+    problems.value = []
     const res = await getContest(contestID)
     contest.value = res.data
+    now.value = getTime(parseISO(res.data.now))
+    if (contestStatus.value !== ContestStatus.finished) {
+      timer = setInterval(() => {
+        now.value = now.value + 1000
+      }, 1000)
+    }
     if (contest.value?.contest_type === ContestType.private) {
       const res = await getContestAccess(contestID)
       toggleAccess(res.data.access)
@@ -39,6 +72,14 @@ export const useContestStore = defineStore("contest", () => {
     _getProblems(contestID)
   }
 
+  function clear() {
+    contest.value = null
+    problems.value = []
+    toggleAccess(false)
+    now.value = 0
+    if (timer) clearInterval(timer)
+  }
+
   async function checkPassword(contestID: string, password: string) {
     try {
       const res = await checkContestPassword(contestID, password)
@@ -53,7 +94,6 @@ export const useContestStore = defineStore("contest", () => {
   }
 
   async function _getProblems(contestID: string) {
-    problems.value = []
     try {
       problems.value = await getContestProblems(contestID)
     } catch (err) {
@@ -69,7 +109,9 @@ export const useContestStore = defineStore("contest", () => {
     access,
     problems,
     isPrivate,
+    countdown,
     init,
+    clear,
     checkPassword,
   }
 })
diff --git a/src/shared/Header.vue b/src/shared/Header.vue
index d37a59a..0fc0b3d 100644
--- a/src/shared/Header.vue
+++ b/src/shared/Header.vue
@@ -98,7 +98,7 @@ function run() {
           :options="options"
           trigger="click"
         >
-          <n-button>{{ userStore.user.username }}</n-button>
+          <n-button>{{ userStore.user!.username }}</n-button>
         </n-dropdown>
         <n-space v-else>
           <n-button @click="toggleLogin(true)">登录</n-button>
@@ -118,7 +118,7 @@ function run() {
       运行
     </n-button>
     <n-dropdown v-if="userStore.isAuthed" :options="options" trigger="click">
-      <n-button>{{ userStore.user.username }}</n-button>
+      <n-button>{{ userStore.user!.username }}</n-button>
     </n-dropdown>
     <n-space v-else>
       <n-button @click="toggleLogin(true)">登录</n-button>
diff --git a/src/utils/functions.ts b/src/utils/functions.ts
index f0f54bb..612d9e9 100644
--- a/src/utils/functions.ts
+++ b/src/utils/functions.ts
@@ -1,4 +1,4 @@
-import { intervalToDuration } from "date-fns"
+import { getTime, intervalToDuration, parseISO } from "date-fns"
 import { STORAGE_KEY } from "./constants"
 
 export function getACRate(acCount: number, totalCount: number) {
@@ -36,15 +36,19 @@ export function getTagColor(
   }[tag]
 }
 
-export function parseTime(utc: Date, format = "YYYY年M月D日") {
+export function parseTime(utc: Date | string, format = "YYYY年M月D日") {
   const time = useDateFormat(utc, format, { locales: "zh-CN" })
   return time.value
 }
 
-export function duration(start: Date, end: Date): string {
+export function duration(
+  start: Date | string,
+  end: Date | string,
+  showSeconds = false
+): string {
   const duration = intervalToDuration({
-    start: Date.parse(start.toString()),
-    end: Date.parse(end.toString()),
+    start: getTime(parseISO(start.toString())),
+    end: getTime(parseISO(end.toString())),
   })
   let result = ""
   if (duration.years) {
@@ -62,6 +66,9 @@ export function duration(start: Date, end: Date): string {
   if (duration.minutes) {
     result += duration.minutes + "分钟"
   }
+  if (showSeconds) {
+    result += duration.seconds + "秒"
+  }
   return result
 }
 
diff --git a/src/utils/types.ts b/src/utils/types.ts
index 8c44943..8e6e6a7 100644
--- a/src/utils/types.ts
+++ b/src/utils/types.ts
@@ -220,10 +220,11 @@ export interface Contest {
   description: string
   real_time_rank: boolean
   rule_type: "ACM"
-  start_time: Date
-  end_time: Date
-  create_time: Date
-  last_update_time: Date
+  start_time: string
+  end_time: string
+  create_time: string
+  now: string
+  last_update_time: string
 }
 
 interface SubmissionInfo {