chore: add configuration files for code quality and testing

- Introduced .editorconfig for consistent coding styles across editors.
- Added .eslintignore to exclude specific files and directories from ESLint checks.
- Created .eslintrc-auto-import.json and .eslintrc.cjs for ESLint configuration, including auto-import settings.
- Added .prettierrc.cjs for Prettier configuration to enforce code formatting.
- Included commitlint.config.cjs for commit message linting.
- Set up Husky hooks for pre-commit and pre-push to enforce linting and formatting checks.
- Added Playwright configuration for end-to-end testing and Vitest configuration for unit testing.
- Updated package.json with new scripts for linting, formatting, and testing.

.husky/.gitignore

@@ -0,0 +1 @@
+_

.husky/commit-msg

@@ -1 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
 npx --no -- commitlint --edit $1

.husky/pre-commit

@@ -1,2 +1,5 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
 pnpm run format-staged
 pnpm run lint-staged

.husky/pre-push

@@ -1 +1,4 @@
-pnpm run test --run
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+pnpm run test:run

package.json

@@ -10,7 +10,8 @@
     "lint": "eslint . --ext .vue,.js,.jsx,.ts,.tsx",
     "lint:fix": "eslint . --ext .vue,.js,.jsx,.ts,.tsx --fix",
     "prettier": "prettier --write .",
-    "format-staged": "pretty-quick --staged",
+    "format": "prettier --write ./src",
+    "format-staged": "git diff --name-only --cached --diff-filter=ACMRT | grep -E '\\.(js|ts|jsx|tsx|css|scss|json|md|vue)$' | xargs npx prettier --write",
     "lint-staged": "lint-staged",
     "test": "vitest",
     "test:run": "vitest run",
@@ -18,55 +19,52 @@
     "test:coverage": "vitest run --coverage",
     "test:e2e": "playwright test",
     "test:e2e:ui": "playwright test --ui",
-    "type-check": "vue-tsc --noEmit",
-    "prepare": "husky"
+    "type-check": "vue-tsc --noEmit -p tsconfig.app.json --composite false",
+    "prepare": "husky install"
   },
   "lint-staged": {
-    "*.{js,jsx,ts,tsx,vue}": [
-      "eslint --fix",
-      "prettier --write"
-    ],
-    "*.{css,scss,less,html,md,json}": [
+    "*.{vue,js,ts}": [
       "prettier --write"
     ]
   },
   "dependencies": {
-    "@element-plus/icons-vue": "^2.3.2",
-    "axios": "^1.13.2",
-    "element-plus": "^2.13.0",
-    "hls.js": "^1.6.15",
-    "pinia": "^3.0.4",
-    "sass": "^1.97.1",
-    "vue": "^3.5.24",
-    "vue-router": "^4.6.4"
+    "@element-plus/icons-vue": "^2.1.0",
+    "axios": "^1.4.0",
+    "element-plus": "2.7.5",
+    "hls.js": "^1.4.10",
+    "pinia": "^2.0.36",
+    "sass": "^1.62.1",
+    "vue": "^3.5.13",
+    "vue-router": "^4.2.0"
   },
   "devDependencies": {
-    "@commitlint/cli": "^20.3.0",
-    "@commitlint/config-conventional": "^20.3.0",
+    "@commitlint/cli": "^12.1.1",
+    "@commitlint/config-conventional": "^12.1.1",
     "@playwright/test": "^1.57.0",
-    "@types/node": "^20.17.0",
-    "@typescript-eslint/eslint-plugin": "^8.52.0",
-    "@typescript-eslint/parser": "^8.52.0",
-    "@vitejs/plugin-vue": "^5.2.0",
+    "@types/node": "^18.16.8",
+    "@typescript-eslint/eslint-plugin": "^8.20.0",
+    "@typescript-eslint/parser": "^8.20.0",
+    "@vitejs/plugin-vue": "5.0.5",
     "@vitest/coverage-v8": "^4.0.16",
-    "@vue/test-utils": "^2.4.6",
-    "@vue/tsconfig": "^0.7.0",
+    "@vitest/ui": "^4.0.16",
+    "@vue/test-utils": "^2.0.0-rc.4",
+    "@vue/tsconfig": "^0.4.0",
     "eslint": "^8.57.1",
-    "eslint-config-airbnb-base": "^15.0.0",
-    "eslint-config-prettier": "^10.1.8",
-    "eslint-plugin-import": "^2.32.0",
-    "eslint-plugin-prettier": "^5.5.4",
-    "eslint-plugin-vue": "^9.33.0",
-    "happy-dom": "^20.1.0",
-    "husky": "^9.1.7",
-    "lint-staged": "^16.2.7",
-    "prettier": "^3.7.4",
-    "pretty-quick": "^4.2.2",
-    "typescript": "~5.6.3",
-    "unplugin-auto-import": "^20.3.0",
-    "unplugin-vue-components": "^30.0.0",
-    "vite": "^5.4.0",
+    "eslint-config-airbnb-base": "^14.2.1",
+    "eslint-config-prettier": "^8.1.0",
+    "eslint-plugin-import": "^2.22.1",
+    "eslint-plugin-prettier": "^3.3.1",
+    "eslint-plugin-vue": "^9.11.0",
+    "happy-dom": "^20.0.11",
+    "husky": "^6.0.0",
+    "lint-staged": "^10.5.4",
+    "prettier": "^2.8.8",
+    "typescript": "~5.0.4",
+    "unplugin-auto-import": "^0.19.0",
+    "unplugin-vue-components": "^0.28.0",
+    "vite": "5.3.1",
+    "vite-plugin-vue-devtools": "^7.7.0",
     "vitest": "^4.0.16",
-    "vue-tsc": "^2.2.0"
+    "vue-tsc": "2.0.21"
   }
 }

src/auto-imports.d.ts

@@ -6,103 +6,85 @@
 // biome-ignore lint: disable
 export {}
 declare global {
-  const EffectScope: typeof import('vue').EffectScope
-  const acceptHMRUpdate: typeof import('pinia').acceptHMRUpdate
-  const computed: typeof import('vue').computed
-  const createApp: typeof import('vue').createApp
-  const createPinia: typeof import('pinia').createPinia
-  const customRef: typeof import('vue').customRef
-  const defineAsyncComponent: typeof import('vue').defineAsyncComponent
-  const defineComponent: typeof import('vue').defineComponent
-  const defineStore: typeof import('pinia').defineStore
-  const effectScope: typeof import('vue').effectScope
-  const getActivePinia: typeof import('pinia').getActivePinia
-  const getCurrentInstance: typeof import('vue').getCurrentInstance
-  const getCurrentScope: typeof import('vue').getCurrentScope
+  const EffectScope: typeof import('vue')['EffectScope']
+  const acceptHMRUpdate: typeof import('pinia')['acceptHMRUpdate']
+  const computed: typeof import('vue')['computed']
+  const createApp: typeof import('vue')['createApp']
+  const createPinia: typeof import('pinia')['createPinia']
+  const customRef: typeof import('vue')['customRef']
+  const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
+  const defineComponent: typeof import('vue')['defineComponent']
+  const defineStore: typeof import('pinia')['defineStore']
+  const effectScope: typeof import('vue')['effectScope']
+  const getActivePinia: typeof import('pinia')['getActivePinia']
+  const getCurrentInstance: typeof import('vue')['getCurrentInstance']
+  const getCurrentScope: typeof import('vue')['getCurrentScope']
   const getCurrentWatcher: typeof import('vue').getCurrentWatcher
-  const h: typeof import('vue').h
-  const inject: typeof import('vue').inject
-  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 h: typeof import('vue')['h']
+  const inject: typeof import('vue')['inject']
+  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 isShallow: typeof import('vue').isShallow
-  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 onDeactivated: typeof import('vue').onDeactivated
-  const onErrorCaptured: typeof import('vue').onErrorCaptured
-  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 onUnmounted: typeof import('vue').onUnmounted
-  const onUpdated: typeof import('vue').onUpdated
-  const onWatcherCleanup: typeof import('vue').onWatcherCleanup
-  const provide: typeof import('vue').provide
-  const reactive: typeof import('vue').reactive
-  const readonly: typeof import('vue').readonly
-  const ref: typeof import('vue').ref
-  const resolveComponent: typeof import('vue').resolveComponent
-  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 toRaw: typeof import('vue').toRaw
-  const toRef: typeof import('vue').toRef
-  const toRefs: typeof import('vue').toRefs
-  const toValue: typeof import('vue').toValue
-  const triggerRef: typeof import('vue').triggerRef
-  const unref: typeof import('vue').unref
-  const useAttrs: typeof import('vue').useAttrs
-  const useCssModule: typeof import('vue').useCssModule
-  const useCssVars: typeof import('vue').useCssVars
-  const useId: typeof import('vue').useId
-  const useLink: typeof import('vue-router').useLink
-  const useModel: typeof import('vue').useModel
-  const useRoute: typeof import('vue-router').useRoute
-  const useRouter: typeof import('vue-router').useRouter
-  const useSlots: typeof import('vue').useSlots
-  const useTemplateRef: typeof import('vue').useTemplateRef
-  const watch: typeof import('vue').watch
-  const watchEffect: typeof import('vue').watchEffect
-  const watchPostEffect: typeof import('vue').watchPostEffect
-  const watchSyncEffect: typeof import('vue').watchSyncEffect
+  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 onDeactivated: typeof import('vue')['onDeactivated']
+  const onErrorCaptured: typeof import('vue')['onErrorCaptured']
+  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 onUnmounted: typeof import('vue')['onUnmounted']
+  const onUpdated: typeof import('vue')['onUpdated']
+  const onWatcherCleanup: typeof import('vue')['onWatcherCleanup']
+  const provide: typeof import('vue')['provide']
+  const reactive: typeof import('vue')['reactive']
+  const readonly: typeof import('vue')['readonly']
+  const ref: typeof import('vue')['ref']
+  const resolveComponent: typeof import('vue')['resolveComponent']
+  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 toRaw: typeof import('vue')['toRaw']
+  const toRef: typeof import('vue')['toRef']
+  const toRefs: typeof import('vue')['toRefs']
+  const toValue: typeof import('vue')['toValue']
+  const triggerRef: typeof import('vue')['triggerRef']
+  const unref: typeof import('vue')['unref']
+  const useAttrs: typeof import('vue')['useAttrs']
+  const useCssModule: typeof import('vue')['useCssModule']
+  const useCssVars: typeof import('vue')['useCssVars']
+  const useId: typeof import('vue')['useId']
+  const useLink: typeof import('vue-router')['useLink']
+  const useModel: typeof import('vue')['useModel']
+  const useRoute: typeof import('vue-router')['useRoute']
+  const useRouter: typeof import('vue-router')['useRouter']
+  const useSlots: typeof import('vue')['useSlots']
+  const useTemplateRef: typeof import('vue')['useTemplateRef']
+  const watch: typeof import('vue')['watch']
+  const watchEffect: typeof import('vue')['watchEffect']
+  const watchPostEffect: typeof import('vue')['watchPostEffect']
+  const watchSyncEffect: typeof import('vue')['watchSyncEffect']
 }
 // for type re-export
 declare global {
   // @ts-ignore
-  export type {
-    Component,
-    Slot,
-    Slots,
-    ComponentPublicInstance,
-    ComputedRef,
-    DirectiveBinding,
-    ExtractDefaultPropTypes,
-    ExtractPropTypes,
-    ExtractPublicPropTypes,
-    InjectionKey,
-    PropType,
-    Ref,
-    ShallowRef,
-    MaybeRef,
-    MaybeRefOrGetter,
-    VNode,
-    WritableComputedRef
-  } from 'vue'
+  export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
   import('vue')
 }

src/components.d.ts

@@ -1,11 +1,7 @@
 /* eslint-disable */
 // @ts-nocheck
-// biome-ignore lint: disable
-// oxlint-disable
-// ------
 // Generated by unplugin-vue-components
 // Read more: https://github.com/vuejs/core/pull/3399
-
 export {}
 
 /* prettier-ignore */
@@ -63,7 +59,7 @@ declare module 'vue' {
     RouterView: typeof import('vue-router')['RouterView']
     VideoPlayer: typeof import('./components/VideoPlayer.vue')['default']
   }
-  export interface GlobalDirectives {
+  export interface ComponentCustomProperties {
     vLoading: typeof import('element-plus/es')['ElLoadingDirective']
   }
 }

src/views/audit/index.vue

@@ -196,12 +196,12 @@ function getActionLabel(action: string): string {
   return map[action] || action
 }
 
-function getActionTagType(action: string): '' | 'success' | 'warning' | 'danger' | 'info' {
-  const map: Record<string, '' | 'success' | 'warning' | 'danger' | 'info'> = {
+function getActionTagType(action: string): 'primary' | 'success' | 'warning' | 'danger' | 'info' {
+  const map: Record<string, 'primary' | 'success' | 'warning' | 'danger' | 'info'> = {
     create: 'success',
     update: 'warning',
     delete: 'danger',
-    login: '',
+    login: 'primary',
     logout: 'info',
     view: 'info'
   }

src/views/stream/video-list.vue

@@ -292,8 +292,8 @@ function formatTime(time: string): string {
   return new Date(time).toLocaleString('zh-CN')
 }
 
-function getStatusType(state: string): string {
-  const map: Record<string, string> = {
+function getStatusType(state: string): 'primary' | 'success' | 'warning' | 'danger' | 'info' {
+  const map: Record<string, 'primary' | 'success' | 'warning' | 'danger' | 'info'> = {
     ready: 'success',
     inprogress: 'warning',
     queued: 'info',

vite.config.ts

@@ -1,5 +1,6 @@
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
+import vueDevTools from 'vite-plugin-vue-devtools'
 import { resolve } from 'path'
 import AutoImport from 'unplugin-auto-import/vite'
 import Components from 'unplugin-vue-components/vite'
@@ -8,6 +9,7 @@ import pkg from './package.json'
 
 export default defineConfig({
   plugins: [
+    process.env.NODE_ENV === 'development' && vueDevTools(),
     vue(),
     AutoImport({
       imports: ['vue', 'vue-router', 'pinia'],
@@ -48,7 +50,8 @@ export default defineConfig({
   css: {
     preprocessorOptions: {
       scss: {
-        additionalData: `@use "@/assets/styles/variables.scss" as *;`
+        additionalData: `@use "@/assets/styles/variables.scss" as *;`,
+        silenceDeprecations: ['legacy-js-api']
       }
     }
   },