更新配置，升级相关库

package.json

@@ -9,25 +9,26 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "naive-ui": "^2.33.5",
-    "pinia": "^2.0.18",
-    "vue": "^3.2.37",
-    "vue-router": "^4.1.3"
+    "naive-ui": "^2.35.0",
+    "pinia": "^2.1.7",
+    "pinia-plugin-persist": "^1.0.0",
+    "vue": "^3.3.11",
+    "vue-router": "^4.2.5"
   },
   "devDependencies": {
-    "@types/node": "^18.15.3",
-    "@typescript-eslint/parser": "^5.40.0",
-    "@vitejs/plugin-vue": "^3.1.2",
-    "eslint": "^8.25.0",
+    "@types/node": "^20.10.4",
+    "@typescript-eslint/parser": "^6.14.0",
+    "@vitejs/plugin-vue": "^4.5.2",
+    "eslint": "^8.55.0",
     "eslint-config-airbnb-base": "^15.0.0",
-    "eslint-plugin-import": "^2.26.0",
-    "eslint-plugin-vue": "^9.6.0",
+    "eslint-plugin-import": "^2.29.0",
+    "eslint-plugin-vue": "^9.19.2",
     "sass": "^1.69.3",
-    "typescript": "^4.8.4",
-    "vite": "^3.1.8",
+    "typescript": "^5.3.3",
+    "vite": "^5.0.8",
     "vite-plugin-compression": "^0.5.1",
     "vite-plugin-eslint": "^1.8.0",
     "vite-plugin-svg-icons": "^2.0.1",
-    "vue-tsc": "^1.0.8"
+    "vue-tsc": "^1.8.25"
   }
 }

src/assets/naive-theme.ts

@@ -41,145 +41,6 @@ const themeOverrides: GlobalThemeOverrides = {
   },
   Icon: {
     color: 'white'
-  },
-  Tree: {
-    nodeTextColor: '#fff',
-    nodeColorHover: 'transparent',
-    nodeColorPressed: 'transparent',
-    nodeColorActive: 'transparent'
-  },
-  Dropdown: {
-    optionTextColor: '#fff',
-    color: '#1AB99B',
-    optionTextColorHover: '#1AB99B',
-    optionColorHover: 'rgba(26,65,78,0.85)',
-    optionPrefixWidthHuge: '20px'
-
-  },
-  Input: {
-    textColor: '#fff',
-    placeholderColor: '#639694',
-    border: '1px solid #639694',
-    borderFocus: '1px solid #639694'
-
-  },
-  Tabs: {
-    tabTextColorLine: '#fff',
-    tabTextColorActiveLine: '#1AB99B',
-    tabTextColorHoverLine: '#1AB99B',
-    tabTextColorBar: '#000',
-    barColor: '#1AB99B',
-    tabBorderColor: ' rgba(243,243,243,0.1)',
-    paneTextColor: '#fff',
-    tabPaddingMediumLine: '10px 15px'
-  },
-  Button: {
-    textColor: '#fff',
-    border: '1px solid #1AB99B',
-    colorPrimary: '#1E867E',
-    colorHoverPrimary: '#1E867EFF',
-    colorPressedPrimary: '#0C7A43FF',
-    colorDisabledPrimary: '#18A058FF',
-    colorFocusPrimary: '#1E867EFF',
-    borderPrimary: '1px solid #1E867E',
-    borderHoverPrimary: '1px solid #1E867EFF',
-    borderPressedPrimary: '1px solid #0C7A43FF',
-    borderDisabledPrimary: '1px solid #18A058FF',
-    borderFocusPrimary: '1px solid #1E867EFF'
-  },
-  Collapse: {
-    itemMargin: '0px 0 0 0',
-    titlePadding: '0px 0 0 0',
-    dividerColor: 'transparent',
-    titleTextColor: '#FFFFFF',
-    arrowColor: '#FFFFFF',
-    textColor: '#FFFFFF'
-  },
-  Slider: {
-    fillColor: '#1AB99B',
-    fillColorHover: '#1AB99B'
-  },
-  Dialog: {
-    color: '#143A4D',
-    closeIconColor: '#B3B3B3',
-    titleTextColor: '#FFFFFF',
-    textColor: '#FFFFFF',
-    titleFontSize: '16px',
-    iconSize: '16px',
-    closeMargin: '10px 26px 0 0',
-    border: '1px solid #1AB99B'
-  },
-  Form: {
-    labelTextColor: '#ffffff'
-  },
-  DataTable: {
-    borderColor: 'rgba(99, 150, 148, 0.4)',
-    thColor: 'rgba(21,84,107,0.4)',
-    thColorHover: 'rgba(21,84,107,0.4)',
-    thTextColor: 'rgba(26, 185, 155, 1)',
-    tdColor: 'rgba(10, 29, 36, 0.6)',
-    tdColorHover: 'rgba(10, 29, 36, 0.6)',
-    tdTextColor: '#FFFFFF'
-  },
-  Pagination: {
-    buttonColor: 'rgba(21,84,107,0.4)',
-    buttonColorHover: 'rgba(21,84,107,0.4)',
-    buttonColorPressed: 'rgba(21,84,107,0.4)',
-    buttonBorder: '1px solid rgba(21,84,107,0.4)',
-    buttonBorderHover: '1px solid rgba(21,84,107,0.4)',
-    buttonBorderPressed: '1px solid rgba(21,84,107,0.4)',
-    buttonIconColor: '#fff',
-    buttonIconColorHover: '#fff',
-    buttonIconColorPressed: '#fff',
-    itemTextColor: '#fff',
-    itemTextColorHover: '#fff',
-    itemTextColorPressed: '#fff',
-    itemTextColorActive: '#fff',
-    itemColorDisabled: 'rgba(21,84,107,0.8)',
-    itemBorderActive: '1px solid rgba(21,84,107,1)',
-    itemBorderDisabled: '1px solid rgba(21,84,107,1)',
-    itemTextColorDisabled: 'rgba(26, 223, 180, 0.1)',
-    jumperTextColor: '#fff'
-  },
-  Scrollbar: {
-    color: '#1AB99B',
-    colorHover: '#1AB99B'
-  },
-  TreeSelect: {
-    menuColor: 'rgba(3, 20, 26, 0.95)',
-    menuBoxShadow: '0px 2px 6px 0px rgba(0,0,0,0.5), inset 0px 0px 8px 0px rgba(200,255,239,0.37);'
-  },
-  DatePicker: {
-    panelColor: 'rgba(3,20,26,0.95)',
-    panelTextColor: 'rgba(255,255,255,0.8)',
-    calendarDaysTextColor: 'rgba(255,255,255,0.8)',
-    calendarTitleTextColor: 'rgba(255,255,255,0.8)',
-    calendarTitleColorHover: '#183742',
-    panelHeaderDividerColor: '#164352',
-    calendarDaysDividerColor: '#164352',
-    panelActionDividerColor: '#164352',
-    itemColorActive: '#1AB99B',
-    itemColorHover: '#146371'
-  },
-  TimePicker: {
-    panelColor: 'rgba(3, 20, 26, 0.95)',
-    panelDividerColor: 'rgb(239, 239, 245)',
-    itemTextColor: 'rgba(255, 255, 255, 0.8)',
-    itemTextColorActive: '#1AB99B',
-    itemColorHover: '#146371'
-  },
-  Checkbox: {
-    colorChecked: '#1ab99bFF',
-    textColor: '#fff'
-  },
-  Notification: {
-    iconColorSuccess: '#1AB99BFF',
-    iconColorError: '#E8575AFF',
-    color: '#12363FFF',
-    textColor: 'rgba(255, 255, 255, 1)',
-    descriptionTextColor: 'rgba(255, 255, 255, 1)',
-    closeIconColor: 'rgba(255, 255, 255, 1)',
-    borderRadius: '0'
   }
 }
 export default themeOverrides

src/pages/main.ts

@@ -5,11 +5,15 @@ import naive from '@/assets/native-plugin'
 import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router'
 import Icon from '@/components/icon.vue'
 import 'virtual:svg-icons-register'
+import piniaPersist from 'pinia-plugin-persist'
+
+const store = createPinia()
+store.use(piniaPersist)
 
 // 动态路由
 const routes = Object.values(import.meta.glob('./views/*/route.ts', { eager: true, import: 'default' })) as unknown as RouteRecordRaw[]
 routes.push({ path: '/:path(.*)', redirect: '/' })
-const store = createPinia()
+
 const app = createApp(App)
 const router = createRouter({
   history: createWebHashHistory(),

src/pages/store/index.ts

@@ -1,12 +1,30 @@
 import { defineStore } from 'pinia'
-// id必填，且需要唯一
-import { ref } from 'vue'
-const useStore = defineStore('index', () => {
-  const loading = ref(false)
 
-  const setLoading = (data:boolean) => {
-    loading.value = data
+export interface UserInfo {
+  id: number,
+  name: string,
+  opmId: number,
+  satoken: string
+}
+
+// id必填，且需要唯一
+const useStore = defineStore('index', {
+  state: () => ({
+    userInfro: {} as UserInfo,
+    token: '',
+    isCheckPermission: false
+  }),
+  actions: {
+    setUserInfo(data: UserInfo) {
+      this.userInfro = data
+      this.token = data.satoken || ''
+    },
+    setCheckPermission(data: boolean) {
+      this.isCheckPermission = data
+    }
+  },
+  persist: {
+    enabled: true // true 表示开启持久化保存
   }
-  return { loading, setLoading }
 })
-export default useStore
+export default useStore

src/pages/views/home/index.vue

@@ -17,6 +17,9 @@ function sendAudio() {
     >
       我不是全局组件
     </n-button>
-    <icon name="add" :size="20"/>
+    <icon
+      name="add"
+      :size="20"
+    />
   </div>
 </template>