updates

.eslintrc-auto-import.json

+{
+  "globals": {
+    "$": true,
+    "$$": true,
+    "$computed": true,
+    "$customRef": true,
+    "$ref": true,
+    "$shallowRef": true,
+    "$toRef": true,
+    "asyncComputed": true,
+    "autoResetRef": true,
+    "computed": true,
+    "computedAsync": true,
+    "computedEager": true,
+    "computedInject": true,
+    "computedWithControl": true,
+    "controlledComputed": true,
+    "controlledRef": true,
+    "createApp": true,
+    "createEventHook": true,
+    "createGlobalState": true,
+    "createInjectionState": true,
+    "createReactiveFn": true,
+    "createSharedComposable": true,
+    "createUnrefFn": true,
+    "customRef": true,
+    "debouncedRef": true,
+    "debouncedWatch": true,
+    "defineAsyncComponent": true,
+    "defineComponent": true,
+    "eagerComputed": true,
+    "effectScope": true,
+    "EffectScope": true,
+    "extendRef": true,
+    "getCurrentInstance": true,
+    "getCurrentScope": true,
+    "h": true,
+    "ignorableWatch": true,
+    "inject": true,
+    "isDefined": true,
+    "isReadonly": true,
+    "isRef": true,
+    "logicAnd": true,
+    "logicNot": true,
+    "logicOr": true,
+    "makeDestructurable": true,
+    "markRaw": true,
+    "nextTick": true,
+    "onActivated": true,
+    "onBeforeMount": true,
+    "onBeforeUnmount": true,
+    "onBeforeUpdate": true,
+    "onClickOutside": true,
+    "onDeactivated": true,
+    "onErrorCaptured": true,
+    "onKeyStroke": true,
+    "onLongPress": true,
+    "onMounted": true,
+    "onRenderTracked": true,
+    "onRenderTriggered": true,
+    "onScopeDispose": true,
+    "onServerPrefetch": true,
+    "onStartTyping": true,
+    "onUnmounted": true,
+    "onUpdated": true,
+    "pausableWatch": true,
+    "provide": true,
+    "reactify": true,
+    "reactifyObject": true,
+    "reactive": true,
+    "reactiveComputed": true,
+    "reactiveOmit": true,
+    "reactivePick": true,
+    "readonly": true,
+    "ref": true,
+    "refAutoReset": true,
+    "refDebounced": true,
+    "refDefault": true,
+    "refThrottled": true,
+    "refWithControl": true,
+    "resolveComponent": true,
+    "shallowReactive": true,
+    "shallowReadonly": true,
+    "shallowRef": true,
+    "syncRef": true,
+    "syncRefs": true,
+    "templateRef": true,
+    "throttledRef": true,
+    "throttledWatch": true,
+    "toRaw": true,
+    "toReactive": true,
+    "toRef": true,
+    "toRefs": true,
+    "triggerRef": true,
+    "tryOnBeforeMount": true,
+    "tryOnBeforeUnmount": true,
+    "tryOnMounted": true,
+    "tryOnScopeDispose": true,
+    "tryOnUnmounted": true,
+    "unref": true,
+    "unrefElement": true,
+    "until": true,
+    "useActiveElement": true,
+    "useAsyncQueue": true,
+    "useAsyncState": true,
+    "useAttrs": true,
+    "useBase64": true,
+    "useBattery": true,
+    "useBreakpoints": true,
+    "useBroadcastChannel": true,
+    "useBrowserLocation": true,
+    "useCached": true,
+    "useClamp": true,
+    "useClipboard": true,
+    "useColorMode": true,
+    "useConfirmDialog": true,
+    "useCounter": true,
+    "useCssModule": true,
+    "useCssVar": true,
+    "useCssVars": true,
+    "useCycleList": true,
+    "useDark": true,
+    "useDateFormat": true,
+    "useDebounce": true,
+    "useDebouncedRefHistory": true,
+    "useDebounceFn": true,
+    "useDeviceMotion": true,
+    "useDeviceOrientation": true,
+    "useDevicePixelRatio": true,
+    "useDevicesList": true,
+    "useDisplayMedia": true,
+    "useDocumentVisibility": true,
+    "useDraggable": true,
+    "useElementBounding": true,
+    "useElementByPoint": true,
+    "useElementHover": true,
+    "useElementSize": true,
+    "useElementVisibility": true,
+    "useEventBus": true,
+    "useEventListener": true,
+    "useEventSource": true,
+    "useEyeDropper": true,
+    "useFavicon": true,
+    "useFetch": true,
+    "useFileSystemAccess": true,
+    "useFocus": true,
+    "useFocusWithin": true,
+    "useFps": true,
+    "useFullscreen": true,
+    "useGamepad": true,
+    "useGeolocation": true,
+    "useIdle": true,
+    "useInfiniteScroll": true,
+    "useIntersectionObserver": true,
+    "useInterval": true,
+    "useIntervalFn": true,
+    "useKeyModifier": true,
+    "useLastChanged": true,
+    "useLocalStorage": true,
+    "useMagicKeys": true,
+    "useManualRefHistory": true,
+    "useMediaControls": true,
+    "useMediaQuery": true,
+    "useMemoize": true,
+    "useMemory": true,
+    "useMounted": true,
+    "useMouse": true,
+    "useMouseInElement": true,
+    "useMousePressed": true,
+    "useMutationObserver": true,
+    "useNavigatorLanguage": true,
+    "useNetwork": true,
+    "useNow": true,
+    "useOffsetPagination": true,
+    "useOnline": true,
+    "usePageLeave": true,
+    "useParallax": true,
+    "usePermission": true,
+    "usePointer": true,
+    "usePointerSwipe": true,
+    "usePreferredColorScheme": true,
+    "usePreferredDark": true,
+    "usePreferredLanguages": true,
+    "useRafFn": true,
+    "useRefHistory": true,
+    "useResizeObserver": true,
+    "useRoute": true,
+    "useRouter": true,
+    "useScreenSafeArea": true,
+    "useScriptTag": true,
+    "useScroll": true,
+    "useScrollLock": true,
+    "useSessionStorage": true,
+    "useShare": true,
+    "useSlots": true,
+    "useSpeechRecognition": true,
+    "useSpeechSynthesis": true,
+    "useStorage": true,
+    "useStorageAsync": true,
+    "useStyleTag": true,
+    "useSwipe": true,
+    "useTemplateRefsList": true,
+    "useTextSelection": true,
+    "useThrottle": true,
+    "useThrottledRefHistory": true,
+    "useThrottleFn": true,
+    "useTimeAgo": true,
+    "useTimeout": true,
+    "useTimeoutFn": true,
+    "useTimeoutPoll": true,
+    "useTimestamp": true,
+    "useTitle": true,
+    "useToggle": true,
+    "useTransition": true,
+    "useUrlSearchParams": true,
+    "useUserMedia": true,
+    "useVibrate": true,
+    "useVirtualList": true,
+    "useVModel": true,
+    "useVModels": true,
+    "useWakeLock": true,
+    "useWebNotification": true,
+    "useWebSocket": true,
+    "useWebWorker": true,
+    "useWebWorkerFn": true,
+    "useWindowFocus": true,
+    "useWindowScroll": true,
+    "useWindowSize": true,
+    "watch": true,
+    "watchAtMost": true,
+    "watchDebounced": true,
+    "watchEffect": true,
+    "watchIgnorable": true,
+    "watchOnce": true,
+    "watchPausable": true,
+    "watchThrottled": true,
+    "watchWithFilter": true,
+    "whenever": true
+  }
+}
\ No newline at end of file

.eslintrc.cjs

@@ -3,7 +3,12 @@ require('@rushstack/eslint-patch/modern-module-resolution')
 
 module.exports = {
   root: true,
-  extends: ['plugin:vue/vue3-essential', 'eslint:recommended', '@vue/eslint-config-typescript/recommended'],
+  extends: [
+    'plugin:vue/vue3-essential',
+    'eslint:recommended',
+    '@vue/eslint-config-typescript/recommended',
+    './.eslintrc-auto-import.json'
+  ],
   env: {
     'vue/setup-compiler-macros': true
   },

auto-imports.d.ts

+// Generated by 'unplugin-auto-import'
+// We suggest you to commit this file into source control
+declare global {
+  const $: typeof import('vue/macros')['$']
+  const $$: typeof import('vue/macros')['$$']
+  const $computed: typeof import('vue/macros')['$computed']
+  const $customRef: typeof import('vue/macros')['$customRef']
+  const $ref: typeof import('vue/macros')['$ref']
+  const $shallowRef: typeof import('vue/macros')['$shallowRef']
+  const $toRef: typeof import('vue/macros')['$toRef']
+  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 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 eagerComputed: typeof import('@vueuse/core')['eagerComputed']
+  const effectScope: typeof import('vue')['effectScope']
+  const EffectScope: typeof import('vue')['EffectScope']
+  const extendRef: typeof import('@vueuse/core')['extendRef']
+  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 isReadonly: typeof import('vue')['isReadonly']
+  const isRef: typeof import('vue')['isRef']
+  const logicAnd: typeof import('@vueuse/core')['logicAnd']
+  const logicNot: typeof import('@vueuse/core')['logicNot']
+  const logicOr: typeof import('@vueuse/core')['logicOr']
+  const makeDestructurable: typeof import('@vueuse/core')['makeDestructurable']
+  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 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 shallowReactive: typeof import('vue')['shallowReactive']
+  const shallowReadonly: typeof import('vue')['shallowReadonly']
+  const shallowRef: typeof import('vue')['shallowRef']
+  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 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 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 useClamp: typeof import('@vueuse/core')['useClamp']
+  const useClipboard: typeof import('@vueuse/core')['useClipboard']
+  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 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 useDebouncedRefHistory: typeof import('@vueuse/core')['useDebouncedRefHistory']
+  const useDebounceFn: typeof import('@vueuse/core')['useDebounceFn']
+  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 useDisplayMedia: typeof import('@vueuse/core')['useDisplayMedia']
+  const useDocumentVisibility: typeof import('@vueuse/core')['useDocumentVisibility']
+  const useDraggable: typeof import('@vueuse/core')['useDraggable']
+  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 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 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 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 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 useNow: typeof import('@vueuse/core')['useNow']
+  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 usePointerSwipe: typeof import('@vueuse/core')['usePointerSwipe']
+  const usePreferredColorScheme: typeof import('@vueuse/core')['usePreferredColorScheme']
+  const usePreferredDark: typeof import('@vueuse/core')['usePreferredDark']
+  const usePreferredLanguages: typeof import('@vueuse/core')['usePreferredLanguages']
+  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 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 useSpeechRecognition: typeof import('@vueuse/core')['useSpeechRecognition']
+  const useSpeechSynthesis: typeof import('@vueuse/core')['useSpeechSynthesis']
+  const useStorage: typeof import('@vueuse/core')['useStorage']
+  const useStorageAsync: typeof import('@vueuse/core')['useStorageAsync']
+  const useStyleTag: typeof import('@vueuse/core')['useStyleTag']
+  const useSwipe: typeof import('@vueuse/core')['useSwipe']
+  const useTemplateRefsList: typeof import('@vueuse/core')['useTemplateRefsList']
+  const useTextSelection: typeof import('@vueuse/core')['useTextSelection']
+  const useThrottle: typeof import('@vueuse/core')['useThrottle']
+  const useThrottledRefHistory: typeof import('@vueuse/core')['useThrottledRefHistory']
+  const useThrottleFn: typeof import('@vueuse/core')['useThrottleFn']
+  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 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 useVibrate: typeof import('@vueuse/core')['useVibrate']
+  const useVirtualList: typeof import('@vueuse/core')['useVirtualList']
+  const useVModel: typeof import('@vueuse/core')['useVModel']
+  const useVModels: typeof import('@vueuse/core')['useVModels']
+  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 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 watchThrottled: typeof import('@vueuse/core')['watchThrottled']
+  const watchWithFilter: typeof import('@vueuse/core')['watchWithFilter']
+  const whenever: typeof import('@vueuse/core')['whenever']
+}
+export {}

components.d.ts

+import '@vue/runtime-core'
+
+declare module '@vue/runtime-core' {
+  export interface GlobalComponents {
+    RouterLink: typeof import('vue-router')['RouterLink']
+    RouterView: typeof import('vue-router')['RouterView']
+    AppCard: typeof import('./src/components/base/AppCard.vue')['default']
+    AppList: typeof import('./src/components/base/AppList.vue')['default']
+  }
+}
+
+export {}

package.json

@@ -15,12 +15,12 @@
   "dependencies": {
     "@element-plus/icons-vue": "^1.1.4",
     "@tinymce/tinymce-vue": "^5.0.0",
-    "axios": "^0.26.1",
+    "axios": "^0.27.1",
     "blueimp-md5": "^2.19.0",
-    "element-plus": "^2.1.10",
+    "element-plus": "^2.1.11",
     "pinia": "^2.0.13",
     "qs": "^6.10.3",
-    "sass": "^1.50.1",
+    "sass": "^1.51.0",
     "vue": "^3.2.33",
     "vue-router": "^4.0.14"
   },
@@ -37,6 +37,7 @@
     "eslint": "^8.13.0",
     "eslint-plugin-vue": "^8.7.1",
     "typescript": "~4.6.3",
+    "unplugin-auto-import": "^0.7.1",
     "vite": "^2.9.5",
     "vite-plugin-checker": "^0.4.6",
     "vue-tsc": "^0.34.10"

pnpm-lock.yaml

@@ -11,16 +11,17 @@ specifiers:
   '@vue/eslint-config-typescript': ^10.0.0
   '@vue/tsconfig': ^0.1.3
   ali-oss: ^6.17.1
-  axios: ^0.26.1
+  axios: ^0.27.1
   blueimp-md5: ^2.19.0
   chalk: ^5.0.1
-  element-plus: ^2.1.10
+  element-plus: ^2.1.11
   eslint: ^8.13.0
   eslint-plugin-vue: ^8.7.1
   pinia: ^2.0.13
   qs: ^6.10.3
-  sass: ^1.50.1
+  sass: ^1.51.0
   typescript: ~4.6.3
+  unplugin-auto-import: ^0.7.1
   vite: ^2.9.5
   vite-plugin-checker: ^0.4.6
   vue: ^3.2.33
@@ -30,12 +31,12 @@ specifiers:
 dependencies:
   '@element-plus/icons-vue': 1.1.4_vue@3.2.33
   '@tinymce/tinymce-vue': 5.0.0_vue@3.2.33
-  axios: 0.26.1
+  axios: 0.27.1
   blueimp-md5: 2.19.0
-  element-plus: 2.1.10_vue@3.2.33
+  element-plus: 2.1.11_vue@3.2.33
   pinia: 2.0.13_typescript@4.6.3+vue@3.2.33
   qs: 6.10.3
-  sass: 1.50.1
+  sass: 1.51.0
   vue: 3.2.33
   vue-router: 4.0.14_vue@3.2.33
 
@@ -52,12 +53,17 @@ devDependencies:
   eslint: 8.13.0
   eslint-plugin-vue: 8.7.1_eslint@8.13.0
   typescript: 4.6.3
-  vite: 2.9.5_sass@1.50.1
+  unplugin-auto-import: 0.7.1_vite@2.9.5
+  vite: 2.9.5_sass@1.51.0
   vite-plugin-checker: 0.4.6_vite@2.9.5
   vue-tsc: 0.34.10_typescript@4.6.3
 
 packages:
 
+  /@antfu/utils/0.5.1:
+    resolution: {integrity: sha512-8Afo0+xvYe1K8Wm4xHTymfTkpzy36aaqDvhXIayUwl+mecMG9Xzl3XjXa6swG6Bk8FBeQ646RyvmsYt6+2Be9g==}
+    dev: true
+
   /@babel/code-frame/7.16.7:
     resolution: {integrity: sha512-iAXqUn8IIeBTNd72xsFlgaXHkMBMt6y4HJp1tIaK465CWLT/fG1aqB7ykr95gHHmlBdGbFeWWfyB4NJJ0nmeIg==}
     engines: {node: '>=6.9.0'}
@@ -114,14 +120,14 @@ packages:
       - supports-color
     dev: true
 
-  /@floating-ui/core/0.6.1:
-    resolution: {integrity: sha512-Y30eVMcZva8o84c0HcXAtDO4BEzPJMvF6+B7x7urL2xbAqVsGJhojOyHLaoQHQYjb6OkqRq5kO+zeySycQwKqg==}
+  /@floating-ui/core/0.6.2:
+    resolution: {integrity: sha512-jktYRmZwmau63adUG3GKOAVCofBXkk55S/zQ94XOorAHhwqFIOFAy1rSp2N0Wp6/tGbe9V3u/ExlGZypyY17rg==}
     dev: false
 
-  /@floating-ui/dom/0.4.4:
-    resolution: {integrity: sha512-0Ulu3B/dqQplUUSqnTx0foSrlYuMN+GTtlJWvNJwt6Fr7/PqmlR/Y08o6/+bxDWr6p3roBJRaQ51MDZsNmEhhw==}
+  /@floating-ui/dom/0.4.5:
+    resolution: {integrity: sha512-b+prvQgJt8pieaKYMSJBXHxX/DYwdLsAWxKYqnO5dO2V4oo/TYBZJAUQCVNjTWWsrs6o4VDrNcP9+E70HAhJdw==}
     dependencies:
-      '@floating-ui/core': 0.6.1
+      '@floating-ui/core': 0.6.2
     dev: false
 
   /@humanwhocodes/config-array/0.9.5:
@@ -160,14 +166,22 @@ packages:
       fastq: 1.13.0
     dev: true
 
-  /@popperjs/core/2.11.5:
-    resolution: {integrity: sha512-9X2obfABZuDVLCgPK9aX0a/x4jaOEweTTWE2+9sr0Qqqevj2Uv5XorvusThmc9XGYpS9yI+fhh8RTafBtGposw==}
-    dev: false
+  /@rollup/pluginutils/4.2.1:
+    resolution: {integrity: sha512-iKnFXr7NkdZAIHiIWE+BX5ULi/ucVFYWD6TbAV+rZctiRTY2PL6tsIKhoIOaoskiWAkgu+VsbXgUVDNLHf+InQ==}
+    engines: {node: '>= 8.0.0'}
+    dependencies:
+      estree-walker: 2.0.2
+      picomatch: 2.3.1
+    dev: true
 
   /@rushstack/eslint-patch/1.1.3:
     resolution: {integrity: sha512-WiBSI6JBIhC6LRIsB2Kwh8DsGTlbBU+mLRxJmAe3LjHTdkDpwIbEOZgoXBbZilk/vlfjK8i6nKRAvIRn1XaIMw==}
     dev: true
 
+  /@sxzz/popperjs-es/2.11.6:
+    resolution: {integrity: sha512-V8W+eJiInGq8roHR8xYR+lxojL022LyUI9E4FRav4+1Ih+875ONcLNK3XIs809fyxk1lNzrZO5OAy6xpvEafNw==}
+    dev: false
+
   /@tinymce/tinymce-vue/5.0.0_vue@3.2.33:
     resolution: {integrity: sha512-1HRCNa2eGdztOKShYAiHIry50LTU6YJG//qSP9AJElrXhb3BIBN0Bef6E56nZObVgwCgSmI4cnX35VU9D49aow==}
     peerDependencies:
@@ -193,11 +207,11 @@ packages:
   /@types/lodash-es/4.17.6:
     resolution: {integrity: sha512-R+zTeVUKDdfoRxpAryaQNRKk3105Rrgx2CFRClIgRGaqDTdjsm8h6IYA8ir584W3ePzkZfst5xIgDwYrlh9HLg==}
     dependencies:
-      '@types/lodash': 4.14.181
+      '@types/lodash': 4.14.182
     dev: false
 
-  /@types/lodash/4.14.181:
-    resolution: {integrity: sha512-n3tyKthHJbkiWhDZs3DkhkCzt2MexYHXlX0td5iMplyfwketaOeKboEVBqzceH7juqvEg3q5oUoBFxSLu7zFag==}
+  /@types/lodash/4.14.182:
+    resolution: {integrity: sha512-/THyiqyQAP9AfARo4pF+aCGcyiQ94tX/Is2I7HofNRqoYLgN1PBoOWu2/zTA5zMxzP5EFutMtWtGAFRKUe961Q==}
     dev: false
 
   /@types/node/17.0.25:
@@ -341,7 +355,7 @@ packages:
       vite: ^2.5.10
       vue: ^3.2.25
     dependencies:
-      vite: 2.9.5_sass@1.50.1
+      vite: 2.9.5_sass@1.51.0
       vue: 3.2.33
     dev: true
 
@@ -657,10 +671,15 @@ packages:
     resolution: {integrity: sha512-Pj2IR7u8hmUEDOwB++su6baaRi+QvsgajuFB9j95foM1N2gy5HM4z60hfusIO0fBPG5uLAEl6yCJr1jNSVugEQ==}
     dev: false
 
-  /axios/0.26.1:
-    resolution: {integrity: sha512-fPwcX4EvnSHuInCMItEhAGnaSEXRBjtzh9fOtsE6E1G6p7vl7edEeZe11QHf18+6+9gR5PbKV/sGKNaD8YaMeA==}
+  /asynckit/0.4.0:
+    resolution: {integrity: sha1-x57Zf380y48robyXkLzDZkdLS3k=}
+    dev: false
+
+  /axios/0.27.1:
+    resolution: {integrity: sha512-ePNMai55xo5GsXajb/k756AqZqpqeDaGwGcdvbZLSSELbbYwsIn2jNmGfUPEwd8j/yu4OoMstLLIVa4t0MneEA==}
     dependencies:
       follow-redirects: 1.14.9
+      form-data: 4.0.0
     transitivePeerDependencies:
       - debug
     dev: false
@@ -775,6 +794,13 @@ packages:
     resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==}
     dev: true
 
+  /combined-stream/1.0.8:
+    resolution: {integrity: sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==}
+    engines: {node: '>= 0.8'}
+    dependencies:
+      delayed-stream: 1.0.0
+    dev: false
+
   /commander/8.3.0:
     resolution: {integrity: sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==}
     engines: {node: '>= 12'}
@@ -868,6 +894,11 @@ packages:
       vm2: 3.9.9
     dev: true
 
+  /delayed-stream/1.0.0:
+    resolution: {integrity: sha1-3zrhmayt+31ECqrgsp4icrJOxhk=}
+    engines: {node: '>=0.4.0'}
+    dev: false
+
   /depd/2.0.0:
     resolution: {integrity: sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==}
     engines: {node: '>= 0.8'}
@@ -903,16 +934,16 @@ packages:
     resolution: {integrity: sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0=}
     dev: true
 
-  /element-plus/2.1.10_vue@3.2.33:
-    resolution: {integrity: sha512-sS9OMgP20dlYipmzHlEEgCJU+ID7+03YpRpoJWNQEH736C6ArmDMLnGFe8DUjPvwbUEXRA2d0Eo5d0apFgkSqg==}
+  /element-plus/2.1.11_vue@3.2.33:
+    resolution: {integrity: sha512-s4X0I8s787tv+9UdekBC1g7v42Fj4bucPAmu03EjbgrGrV7BJvkoBGuK52lNfu4yC76bl6Uyjesd5Fu8CMakSw==}
     peerDependencies:
       vue: ^3.2.0
     dependencies:
       '@ctrl/tinycolor': 3.4.1
       '@element-plus/icons-vue': 1.1.4_vue@3.2.33
-      '@floating-ui/dom': 0.4.4
-      '@popperjs/core': 2.11.5
-      '@types/lodash': 4.14.181
+      '@floating-ui/dom': 0.4.5
+      '@popperjs/core': /@sxzz/popperjs-es/2.11.6
+      '@types/lodash': 4.14.182
       '@types/lodash-es': 4.17.6
       '@vueuse/core': 8.2.6_vue@3.2.33
       async-validator: 4.0.7
@@ -1393,6 +1424,15 @@ packages:
         optional: true
     dev: false
 
+  /form-data/4.0.0:
+    resolution: {integrity: sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==}
+    engines: {node: '>= 6'}
+    dependencies:
+      asynckit: 0.4.0
+      combined-stream: 1.0.8
+      mime-types: 2.1.35
+    dev: false
+
   /formstream/1.1.1:
     resolution: {integrity: sha512-yHRxt3qLFnhsKAfhReM4w17jP+U1OlhUjnKPPtonwKbIJO7oBP0MvoxkRUwb8AU9n0MIkYy5X5dK6pQnbj+R2Q==}
     dependencies:
@@ -1724,6 +1764,11 @@ packages:
       type-check: 0.4.0
     dev: true
 
+  /local-pkg/0.4.1:
+    resolution: {integrity: sha512-lL87ytIGP2FU5PWwNDo0w3WhIo2gopIAxPg9RxDYF7m4rr5ahuZxP22xnJHIvaLTe4Z9P6uKKY2UHiwyB4pcrw==}
+    engines: {node: '>=14'}
+    dev: true
+
   /lodash-es/4.17.21:
     resolution: {integrity: sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==}
     dev: false
@@ -1773,6 +1818,13 @@ packages:
     dependencies:
       sourcemap-codec: 1.4.8
 
+  /magic-string/0.26.1:
+    resolution: {integrity: sha512-ndThHmvgtieXe8J/VGPjG+Apu7v7ItcD5mhEIvOscWjPF/ccOiLxHaSuCAS2G+3x4GKsAbT8u7zdyamupui8Tg==}
+    engines: {node: '>=12'}
+    dependencies:
+      sourcemap-codec: 1.4.8
+    dev: true
+
   /memoize-one/6.0.0:
     resolution: {integrity: sha512-rkpe71W0N0c0Xz6QD0eJETuWAJGnJ9afsl1srmwPrI+yBCkge5EycXXbYRyvL29zZVUWQCY7InPRCv3GDXuZNw==}
     dev: false
@@ -1794,6 +1846,18 @@ packages:
       picomatch: 2.3.1
     dev: true
 
+  /mime-db/1.52.0:
+    resolution: {integrity: sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==}
+    engines: {node: '>= 0.6'}
+    dev: false
+
+  /mime-types/2.1.35:
+    resolution: {integrity: sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==}
+    engines: {node: '>= 0.6'}
+    dependencies:
+      mime-db: 1.52.0
+    dev: false
+
   /mime/2.6.0:
     resolution: {integrity: sha512-USPkMeET31rOMiarsBNIHZKLGgvKc/LrjofAnBlOttf5ajRvqiRA8QsenbcooctK6d6Ts6aqZXBA+XbkKthiQg==}
     engines: {node: '>=4.0.0'}
@@ -2190,8 +2254,8 @@ packages:
     resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==}
     dev: true
 
-  /sass/1.50.1:
-    resolution: {integrity: sha512-noTnY41KnlW2A9P8sdwESpDmo+KBNkukI1i8+hOK3footBUcohNHtdOJbckp46XO95nuvcHDDZ+4tmOnpK3hjw==}
+  /sass/1.51.0:
+    resolution: {integrity: sha512-haGdpTgywJTvHC2b91GSq+clTKGbtkkZmVAb82jZQN/wTy6qs8DdFm2lhEQbEwrY0QDRgSQ3xDurqM977C3noA==}
     engines: {node: '>=12.0.0'}
     hasBin: true
     dependencies:
@@ -2461,6 +2525,51 @@ packages:
     engines: {node: '>= 0.8'}
     dev: true
 
+  /unplugin-auto-import/0.7.1_vite@2.9.5:
+    resolution: {integrity: sha512-9865OV9eP99PNxHR2mtTDExeN01m4M9boT5U2BtIwsU1wDRsaFIYWLwcCBEjvXzXfTTC2NNMskhHGVAMfL2WgA==}
+    engines: {node: '>=14'}
+    peerDependencies:
+      '@vueuse/core': '*'
+    peerDependenciesMeta:
+      '@vueuse/core':
+        optional: true
+    dependencies:
+      '@antfu/utils': 0.5.1
+      '@rollup/pluginutils': 4.2.1
+      local-pkg: 0.4.1
+      magic-string: 0.26.1
+      resolve: 1.22.0
+      unplugin: 0.6.2_vite@2.9.5
+    transitivePeerDependencies:
+      - esbuild
+      - rollup
+      - vite
+      - webpack
+    dev: true
+
+  /unplugin/0.6.2_vite@2.9.5:
+    resolution: {integrity: sha512-+QONc2uBFQbeo4x5mlJHjTKjR6pmuchMpGVrWhwdGFFMb4ttFZ4E9KqhOOrNcm3Q8NNyB1vJ4s5e36IZC7UWYw==}
+    peerDependencies:
+      esbuild: '>=0.13'
+      rollup: ^2.50.0
+      vite: ^2.3.0
+      webpack: 4 || 5
+    peerDependenciesMeta:
+      esbuild:
+        optional: true
+      rollup:
+        optional: true
+      vite:
+        optional: true
+      webpack:
+        optional: true
+    dependencies:
+      chokidar: 3.5.3
+      vite: 2.9.5_sass@1.51.0
+      webpack-sources: 3.2.3
+      webpack-virtual-modules: 0.4.3
+    dev: true
+
   /uri-js/4.4.1:
     resolution: {integrity: sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==}
     dependencies:
@@ -2533,14 +2642,14 @@ packages:
       npm-run-path: 4.0.1
       strip-ansi: 6.0.1
       tiny-invariant: 1.2.0
-      vite: 2.9.5_sass@1.50.1
+      vite: 2.9.5_sass@1.51.0
       vscode-languageclient: 7.0.0
       vscode-languageserver: 7.0.0
       vscode-languageserver-textdocument: 1.0.4
       vscode-uri: 3.0.3
     dev: true
 
-  /vite/2.9.5_sass@1.50.1:
+  /vite/2.9.5_sass@1.51.0:
     resolution: {integrity: sha512-dvMN64X2YEQgSXF1lYabKXw3BbN6e+BL67+P3Vy4MacnY+UzT1AfkHiioFSi9+uiDUiaDy7Ax/LQqivk6orilg==}
     engines: {node: '>=12.2.0'}
     hasBin: true
@@ -2560,7 +2669,7 @@ packages:
       postcss: 8.4.12
       resolve: 1.22.0
       rollup: 2.70.2
-      sass: 1.50.1
+      sass: 1.51.0
     optionalDependencies:
       fsevents: 2.3.2
     dev: true
@@ -2676,6 +2785,15 @@ packages:
       '@vue/shared': 3.2.33
     dev: false
 
+  /webpack-sources/3.2.3:
+    resolution: {integrity: sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==}
+    engines: {node: '>=10.13.0'}
+    dev: true
+
+  /webpack-virtual-modules/0.4.3:
+    resolution: {integrity: sha512-5NUqC2JquIL2pBAAo/VfBP6KuGkHIZQXW/lNKupLPfhViwh8wNsu0BObtl09yuKZszeEUfbXz8xhrHvSG16Nqw==}
+    dev: true
+
   /which/2.0.2:
     resolution: {integrity: sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==}
     engines: {node: '>= 8'}

src/App.vue

-<script setup lang="ts">
-import { RouterView } from 'vue-router'
-</script>
-
 <template>
   <RouterView />
 </template>
 
 <style>
-@import '@/assets/base.css';
+@import '@/assets/styles/base.css';
 </style>

src/assets/styles/element/index.scss

+// styles/element/index.scss
+/* 只需要重写你需要的即可 */
+@forward 'element-plus/theme-chalk/src/common/var.scss' with (
+  $colors: (
+    'primary': (
+      'base': #3276fc
+    )
+  )
+);
+
+// 如果只是按需导入，则可以忽略以下内容。
+// 如果你想导入所有样式:
+@use 'element-plus/theme-chalk/src/index.scss' as *;

src/components/base/AppList.vue

-<script lang="ts">
-export default { name: 'AppList' }
-</script>
-
 <script setup lang="ts">
 import { withDefaults, ref, reactive, onMounted } from 'vue'
 import { Search, RefreshLeft } from '@element-plus/icons-vue'

src/components/base/AppUpload.vue

 <script lang="ts" setup>
-import { ref, withDefaults, computed, watch } from 'vue'
 import { ElMessage } from 'element-plus'
 import { Plus } from '@element-plus/icons-vue'
 import type { UploadProps, UploadUserFile } from 'element-plus'

src/components/layout/Aside.vue

@@ -101,9 +101,6 @@ const defaultActive = computed(() => {
     margin: 0 16px;
     font-size: 16px;
     border-radius: 8px;
-    &:hover {
-      background-color: rgba(86, 100, 210, 0.04);
-    }
   }
 }
 </style>

src/main.ts

@@ -6,6 +6,7 @@ import router from './router'
 
 import ElementPlus from 'element-plus'
 import 'element-plus/dist/index.css'
+import '@/assets/styles/element/index.scss'
 import zhCn from 'element-plus/es/locale/lang/zh-cn'
 
 import AppCard from '@/components/base/AppCard.vue'

src/modules/audit/views/List.vue

 <script setup lang="ts">
-import { ref, computed } from 'vue'
 import { ElMessage } from 'element-plus'
 import { ArrowDown } from '@element-plus/icons-vue'
 import { getAuditList, submitAudit } from '../api'
@@ -57,7 +56,7 @@ const typeList = [
   { label: '导师申请审核', value: 'teacher' }
 ]
 
-const onChangeType = (value: string) => {
+const onChangeType = (value: any) => {
   tabActive.value = value
   appList.value?.refetch()
 }
@@ -73,11 +72,6 @@ const onAudit = (row: any, status: number) => {
 <template>
   <AppCard>
     <AppList v-bind="listOptions" ref="appList">
-      <template #header-aside>
-        <router-link to="/banner/create">
-          <el-button type="primary">创建</el-button>
-        </router-link>
-      </template>
       <template #filter-type="{ params }">
         <el-radio-group v-model="params.tab" @change="onChangeType">
           <el-radio-button :label="item.value" v-for="item in typeList" :key="item.value">

src/modules/banner/views/List.vue

 <script setup lang="ts">
-import { ref } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { getBannerList, deleteBanner } from '../api'
 

src/modules/banner/views/Update.vue

 <script setup lang="ts">
-import { ref, reactive, onMounted } from 'vue'
-import { useRouter } from 'vue-router'
 import { ElMessage } from 'element-plus'
 import type { FormInstance } from 'element-plus'
 import AppEditor from '@/components/tinymce/Index.vue'

src/modules/course/api.ts

@@ -6,6 +6,11 @@ export function getCourseList(params?: { name?: string; page?: number; page_size
 }
 
 // 更新课程信息
-export function updateCourse(data: { id: string; weight?: string; status?: string }) {
+export function updateCourse(data: { id?: string; weight?: string; status?: string }) {
   return httpRequest.post('/api/psp/backend/course/update', data)
 }
+
+// 同步课程
+export function syncCourse() {
+  return httpRequest.get('/api/psp/backend/course/sync')
+}

src/modules/course/components/DialogForm.vue

+<script setup lang="ts">
+import { ElMessage } from 'element-plus'
+import type { FormInstance } from 'element-plus'
+import { updateCourse } from '../api'
+
+const props = defineProps<{ data: Record<string, any>; modelValue: boolean }>()
+
+const emit = defineEmits(['update:modelValue', 'success'])
+
+const formRef = ref<FormInstance>()
+const form = reactive<{ weight: string; status: string }>({ weight: '0', status: '2' })
+
+watchEffect(() => {
+  Object.assign(form, props.data)
+})
+
+const rules = {
+  weight: { required: true, message: '请输入权重', trigger: 'change' }
+}
+
+// 提交
+function onSubmit() {
+  if (!formRef.value) return
+  formRef.value.validate().then(update)
+}
+// 更新课程
+function update() {
+  updateCourse(form).then(res => {
+    ElMessage.success('更新成功')
+    emit('update:modelValue', false)
+    emit('success', res.data)
+  })
+}
+</script>
+
+<template>
+  <el-dialog :model-value="modelValue" title="更新课程" :close-on-click-modal="false" v-bind="$attrs" width="400px">
+    <el-form :model="form" :rules="rules" ref="formRef">
+      <el-form-item label="权重" prop="weight">
+        <el-input type="number" v-model="form.weight" placeholder="请输入内容" />
+      </el-form-item>
+      <el-form-item prop="status">
+        <el-switch
+          v-model="form.status"
+          active-text="显示"
+          active-value="2"
+          inactive-text="不显示"
+          inactive-value="1"
+        />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <el-button type="text" @click="$emit('update:modelValue', false)">取消</el-button>&nbsp;&nbsp;
+      <el-button type="primary" @click="onSubmit">保存</el-button>
+    </template>
+  </el-dialog>
+</template>

src/modules/course/components/Editform.vue

-<template>
-  <el-dialog :title="title" :close-on-click-modal="false" v-bind="$attrs" width="400px">
-    <el-form ref="form" :model="form" :rules="rules">
-      <el-form-item label="权重" prop="sort">
-        <el-input-number v-model="form.sort" placeholder="请输入内容" size="small" :step-strictly="true" />
-      </el-form-item>
-    </el-form>
-    <template #footer>
-      <el-button type="text" @click="onCancel">取消</el-button>&nbsp;&nbsp;
-      <el-button type="primary" size="medium" @click="onPrimary">保存</el-button>
-    </template>
-  </el-dialog>
-</template>
-
-<script>
-// lodash
-import { updateCourse } from '../api.js'
-import { pick } from 'lodash'
-
-export default {
-  props: {
-    isEdit: { type: Boolean, default: false },
-    data: { type: Object, default: () => ({}) }
-  },
-  data() {
-    return {
-      form: { sort: '0' },
-      rules: {
-        sort: { required: true, message: '请输入权重', trigger: 'change' }
-      }
-    }
-  },
-  watch: {
-    data: {
-      immediate: true,
-      handler(data) {
-        this.form = Object.assign({}, this.form, data)
-      }
-    }
-  },
-  computed: {
-    title() {
-      return this.isEdit ? '更新课程' : '创建课程'
-    }
-  },
-  methods: {
-    // 取消
-    onCancel() {
-      this.$emit('update:visible', false)
-    },
-    // 确定
-    onPrimary() {
-      this.$refs.form.validate().then(() => {
-        const params = pick(this.form, ['id', 'sort'])
-        this.isEdit ? this.edit(params) : this.create(params)
-      })
-    },
-    // 创建课程
-    create(params) {
-      updateCourse(params).then(res => {
-        this.$message.success('创建成功')
-        this.$emit('update:visible', false)
-        this.$emit('success', res.data)
-      })
-    },
-    // 编辑权限
-    edit(params) {
-      updateCourse(params).then(res => {
-        this.$message.success('修改成功')
-        this.$emit('update:visible', false)
-        this.$emit('success', res.data)
-      })
-    }
-  }
-}
-</script>
-
-<style></style>

src/modules/course/views/List.vue

 <script setup lang="ts">
-import { ref } from 'vue'
 import { ElMessage } from 'element-plus'
-
-import { getCourseList, updateCourse } from '../api'
+import DialogForm from '../components/DialogForm.vue'
+import { getCourseList, syncCourse, updateCourse } from '../api'
 
 const appList = ref()
 
@@ -31,11 +30,32 @@ const onChangeStatus = (row: Record<string, any>) => {
     appList.value?.refetch()
   })
 }
+
+// 同步
+const onSyncCourse = () => {
+  syncCourse().then(() => {
+    ElMessage.success('同步成功')
+  })
+}
+
+// 更新
+const dialogVisible = ref<boolean>(false)
+const editData = ref<Record<string, any>>({})
+const onEdit = (row: any) => {
+  editData.value = row
+  dialogVisible.value = true
+}
+const onUpdateSuccess = () => {
+  appList.value?.refetch()
+}
 </script>
 
 <template>
   <AppCard>
     <AppList v-bind="listOptions" ref="appList">
+      <template #header-aside>
+        <el-button type="primary" @click="onSyncCourse">同步</el-button>
+      </template>
       <template #table-picture="{ row }">
         <el-image
           :src="row.course_picture + '?x-oss-process=image/resize,m_fill,h_100,w_200'"
@@ -59,9 +79,10 @@ const onChangeStatus = (row: Record<string, any>) => {
           @change="onChangeStatus(row)"
         />
       </template>
-      <template #table-operate>
-        <el-button>更新</el-button>
+      <template #table-operate="{ row }">
+        <el-button @click="onEdit(row)">更新</el-button>
       </template>
     </AppList>
   </AppCard>
+  <DialogForm v-model="dialogVisible" :data="editData" @success="onUpdateSuccess"></DialogForm>
 </template>

src/modules/doc/views/List.vue

 <script setup lang="ts">
-import { ref } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { getDocList, deleteDoc } from '../api'
 

src/modules/doc/views/Update.vue

 <script setup lang="ts">
-import { ref, reactive, onMounted } from 'vue'
-import { useRouter } from 'vue-router'
 import { ElMessage } from 'element-plus'
 import type { FormInstance } from 'element-plus'
 import AppEditor from '@/components/tinymce/Index.vue'
@@ -31,6 +29,10 @@ const onSubmit = () => {
     props.id ? update() : create()
   })
 }
+// 取消
+const onCancel = () => {
+  router.replace('/doc')
+}
 // 创建
 const create = () => {
   const params = { ...form, file: JSON.stringify(form.file) }
@@ -93,6 +95,7 @@ onMounted(() => {
       </el-form-item>
       <el-form-item>
         <el-button type="primary" auto-insert-space @click="onSubmit">保存</el-button>
+        <el-button auto-insert-space @click="onCancel">取消</el-button>
       </el-form-item>
     </el-form>
   </AppCard>

src/modules/qa/views/List.vue

 <script setup lang="ts">
-import { ref } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { getQuestionList, deleteQuestion } from '../api'
 

src/modules/student/views/List.vue

 <script setup lang="ts">
+import { ElMessage } from 'element-plus'
 import { getUserList, syncUser } from '../api'
 
+// 列表配置
 const listOptions = {
   remote: {
     httpRequest: getUserList,
@@ -20,8 +22,11 @@ const listOptions = {
     { label: '操作', slots: 'table-operate', width: 160, align: 'right' }
   ]
 }
-const onSyncUser = async () => {
-  await syncUser()
+// 同步
+const onSyncUser = () => {
+  syncUser().then(() => {
+    ElMessage.success('同步成功')
+  })
 }
 </script>
 

src/modules/student/views/Update.vue

 <script setup lang="ts">
-import { ref, reactive, onMounted } from 'vue'
-import { useRouter } from 'vue-router'
 import { ElMessage } from 'element-plus'
 import type { FormInstance } from 'element-plus'
 import { updateUser, getUser } from '../api'
@@ -29,6 +27,10 @@ const onSubmit = () => {
   if (!formRef.value) return
   formRef.value.validate().then(update)
 }
+// 取消
+const onCancel = () => {
+  router.replace('/student')
+}
 // 修改
 const update = () => {
   const params = { ...form, id: props.id, label: form.label.join(',') }
@@ -69,16 +71,17 @@ onMounted(() => {
         <el-input v-model="form.star" disabled />
       </el-form-item>
       <el-form-item label="入学通知书" prop="notice_url">
-        <el-image :src="form.notice_url" style="width: 100px; height: 100px"></el-image>
+        <el-image :src="form.notice_url" style="width: 200px"></el-image>
       </el-form-item>
       <el-form-item label="证书图片" prop="certificate_url">
-        <el-image :src="form.certificate_url" style="width: 100px; height: 100px"></el-image>
+        <el-image :src="form.certificate_url" style="width: 200px"></el-image>
       </el-form-item>
       <el-form-item label="持证人头像" prop="avatar">
-        <el-image :src="form.avatar" style="width: 100px; height: 100px"></el-image>
+        <el-image :src="form.avatar" style="width: 200px"></el-image>
       </el-form-item>
       <el-form-item>
         <el-button type="primary" auto-insert-space @click="onSubmit">保存</el-button>
+        <el-button auto-insert-space @click="onCancel">取消</el-button>
       </el-form-item>
     </el-form>
   </AppCard>

src/modules/student/views/View.vue

 <script setup lang="ts">
-import { ref, onMounted } from 'vue'
 import StarRecord from '../components/StarRecord.vue'
 import SignInRecord from '../components/SignInRecord.vue'
 import { getUser } from '../api'
@@ -36,13 +35,13 @@ onMounted(() => {
         <el-tag v-for="item in data.label" :key="item" round> {{ item }} </el-tag>
       </el-descriptions-item>
       <el-descriptions-item label="入学通知书" :span="3">
-        <el-image :src="data.notice_url" style="width: 100px; height: 100px"></el-image>
+        <el-image :src="data.notice_url" style="width: 200px"></el-image>
       </el-descriptions-item>
       <el-descriptions-item label="证书图片" :span="3">
-        <el-image :src="data.certificate_url" style="width: 100px; height: 100px"></el-image>
+        <el-image :src="data.certificate_url" style="width: 200px"></el-image>
       </el-descriptions-item>
       <el-descriptions-item label="持证人头像" :span="3">
-        <el-image :src="data.avatar" style="width: 100px; height: 100px"></el-image>
+        <el-image :src="data.avatar" style="width: 200px"></el-image>
       </el-descriptions-item>
     </el-descriptions>
   </AppCard>

src/modules/video/views/List.vue

 <script setup lang="ts">
-import { ref } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import { getVideoList, deleteVideo } from '../api'
 

src/modules/video/views/Update.vue

 <script setup lang="ts">
-import { ref, reactive, onMounted } from 'vue'
-import { useRouter } from 'vue-router'
 import { ElMessage } from 'element-plus'
 import type { FormInstance } from 'element-plus'
 import { createVideo, updateVideo, getVideo } from '../api'
@@ -29,6 +27,10 @@ const onSubmit = () => {
     props.id ? update() : create()
   })
 }
+// 取消
+const onCancel = () => {
+  router.replace('/video')
+}
 // 创建
 const create = () => {
   createVideo(form).then(() => {
@@ -75,6 +77,7 @@ onMounted(() => {
       </el-form-item>
       <el-form-item>
         <el-button type="primary" auto-insert-space @click="onSubmit">保存</el-button>
+        <el-button auto-insert-space @click="onCancel">取消</el-button>
       </el-form-item>
     </el-form>
   </AppCard>

src/router/index.ts

@@ -9,10 +9,15 @@ const router = createRouter({
 router.beforeEach(async (to, from, next) => {
   const user = useUserStore()
   if (!user.isLogin) {
-    await user.getUser()
+    try {
+      await user.getUser()
+    } catch (e) {
+      console.error(e)
+    }
     user.isLogin
       ? next()
       : (location.href = `${import.meta.env.VITE_LOGIN_URL}?rd=${encodeURIComponent(location.href)}`)
+    return
   }
   next()
 })

tsconfig.json

 {
   "extends": "@vue/tsconfig/tsconfig.web.json",
-  "include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
+  "include": ["env.d.ts", "auto-imports.d.ts", "src/**/*", "src/**/*.vue"],
   "compilerOptions": {
     "allowJs": true,
     "baseUrl": ".",
     "paths": {
       "@/*": ["./src/*"]
     },
-    "lib": ["DOM", "ESNext"]
+    "lib": ["DOM", "ESNext"],
+    "types": ["element-plus/global"]
   },
 
   "references": [

vite.config.ts

@@ -5,11 +5,20 @@ import { fileURLToPath, URL } from 'url'
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 import checker from 'vite-plugin-checker'
+import AutoImport from 'unplugin-auto-import/vite'
 
 export default defineConfig(({ mode }) => {
   return {
     base: mode === 'prod' ? 'https://webapp-pub.ezijing.com/website/prod/admin-prp/' : '/',
-    plugins: [checker({ eslint: { lintCommand: 'eslint "./src/**/*.{vue,js,jsx,ts,tsx}"' } }), vue()],
+    plugins: [
+      checker({ vueTsc: true, eslint: { lintCommand: 'eslint "./src/**/*.{vue,js,jsx,ts,tsx}"' } }),
+      vue(),
+      AutoImport({
+        imports: ['vue', 'vue/macros', 'vue-router', '@vueuse/core'],
+        dts: true,
+        eslintrc: { enabled: true }
+      })
+    ],
     server: {
       open: true,
       host: 'dev.ezijing.com',
@@ -25,10 +34,6 @@ export default defineConfig(({ mode }) => {
       alias: {
         '@': fileURLToPath(new URL('./src', import.meta.url))
       }
-    },
-    css: {
-      // 禁用SASS警告提醒
-      preprocessorOptions: { scss: { charset: false } }
     }
   }
 })