代码重构：使用统一消息组件封装替代原始调用

ui/src/App.vue

@@ -89,35 +89,34 @@ provide('new_version', new_version)
     <n-spin v-if="loading" class="container">
       <template #description>加载中</template>
     </n-spin>
-    <n-notification-provider v-else>
-      <n-tabs
-        type="card"
-        placement="left"
-        class="container"
-        v-model:value="conf.page"
-        @update:value="set_page"
-        justify-content="center"
-      >
-        <n-tab-pane :disabled="running" name="init" tab="初始化"><init /></n-tab-pane>
-        <n-tab-pane :disabled="running" name="update" tab="更新代码"><update /></n-tab-pane>
-        <n-tab-pane :disabled="running" name="launch" tab="启动程序"><launch /></n-tab-pane>
-        <n-tab-pane :disabled="running" name="fix" tab="依赖修复"><fix /></n-tab-pane>
-        <n-tab-pane :disabled="running" name="settings">
-          <template #tab>
-            <div class="tab-content">
-              <span>设置</span>
-              <n-tag v-if="update_able" class="tag" round type="success">新</n-tag>
-            </div>
-          </template>
-          <settings />
-        </n-tab-pane>
-        <template #suffix>
-          <div class="suffix-container">
-            <n-button type="primary" secondary size="small" @click="show_doc">帮助文档</n-button>
+    <n-tabs
+      type="card"
+      placement="left"
+      class="container"
+      v-model:value="conf.page"
+      @update:value="set_page"
+      justify-content="center"
+      v-else
+    >
+      <n-tab-pane :disabled="running" name="init" tab="初始化"><init /></n-tab-pane>
+      <n-tab-pane :disabled="running" name="update" tab="更新代码"><update /></n-tab-pane>
+      <n-tab-pane :disabled="running" name="launch" tab="启动程序"><launch /></n-tab-pane>
+      <n-tab-pane :disabled="running" name="fix" tab="依赖修复"><fix /></n-tab-pane>
+      <n-tab-pane :disabled="running" name="settings">
+        <template #tab>
+          <div class="tab-content">
+            <span>设置</span>
+            <n-tag v-if="update_able" class="tag" round type="success">新</n-tag>
           </div>
         </template>
-      </n-tabs>
-    </n-notification-provider>
+        <settings />
+      </n-tab-pane>
+      <template #suffix>
+        <div class="suffix-container">
+          <n-button type="primary" secondary size="small" @click="show_doc">帮助文档</n-button>
+        </div>
+      </template>
+    </n-tabs>
     <n-global-style />
   </n-config-provider>
 </template>

ui/src/components/FloatButton.vue

@@ -1,6 +1,7 @@
 <script setup>
 import PlayIcon from '@vicons/ionicons5/Play'
 import { inject } from 'vue'
+import { notify } from '@/utils/naiveDiscrete.js'
 
 const running = inject('running')
 const log = inject('log')
@@ -8,8 +9,6 @@ const steps = inject('steps')
 const current_step = inject('current_step')
 const current_state = inject('current_state')
 
-const notification = useNotification()
-
 async function start() {
   log.value = []
   running.value = true
@@ -20,22 +19,14 @@ async function start() {
       if ((await pywebview.api.run(cmd, step.cwd)) == 'failed') {
         current_state.value = 'error'
         running.value = false
-        notification['error']({
-          content: '错误',
-          meta: '命令运行失败',
-          duration: 3000
-        })
+        notify.error('命令运行失败')
         return
       }
     }
   }
   current_state.value = 'finish'
   running.value = false
-  notification['info']({
-    content: '提示',
-    meta: '命令运行完成',
-    duration: 3000
-  })
+  notify.info('命令运行完成')
 }
 </script>
 

ui/src/pages/Fix.vue

@@ -1,26 +1,15 @@
 <script setup>
+import { notify } from '@/utils/naiveDiscrete.js'
+
 const running = inject('running')
-const notification = useNotification()
 
 async function rm_site_packages_and_python_scripts() {
   running.value = true
-  notification['info']({
-    content: '提示',
-    meta: '开始移除site-packages和python/Script目录',
-    duration: 3000
-  })
+  notify.info('开始移除site-packages和python/Script目录')
   const response = await pywebview.api.rm_site_packages()
-  notification['info']({
-    content: '提示',
-    meta: response,
-    duration: 3000
-  })
+  notify.info(response)
   const response2 = await pywebview.api.rm_python_scripts()
-  notification['info']({
-    content: '提示',
-    meta: response2,
-    duration: 3000
-  })
+  notify.info(response2)
   running.value = false
 }
 </script>

ui/src/pages/Launch.vue

@@ -12,8 +12,7 @@ import {
   Stop,
   Search
 } from '@vicons/ionicons5'
-
-const notification = useNotification()
+import { notify } from '@/utils/naiveDiscrete.js'
 
 const config_store = useConfigStore()
 const conf = config_store.config
@@ -90,17 +89,9 @@ async function handle_migrate(key) {
         name: '默认实例',
         path: response.data
       })
-      notification['success']({
-        content: '信息',
-        meta: response.message,
-        duration: 3000
-      })
+      notify.success(response.message)
     } else {
-      notification['error']({
-        content: '错误',
-        meta: response.message,
-        duration: 3000
-      })
+      notify.error(response.message)
     }
   } else {
     const response = await pywebview.api.migrate_instances_config()
@@ -110,17 +101,9 @@ async function handle_migrate(key) {
       conf.instances = [...config_store.config.instances]
     }
     if (response.status) {
-      notification['info']({
-        title: '信息',
-        content: response.message,
-        duration: 3000
-      })
+      notify.info(response.message)
     } else {
-      notification['error']({
-        title: '错误',
-        content: response.message,
-        duration: 3000
-      })
+      notify.error(response.message)
     }
   }
 }

ui/src/pages/Settings.vue

@@ -2,8 +2,7 @@
 import { Sync } from '@vicons/ionicons5'
 import { form_item_label_style } from '@/styles/styles.js'
 import BaseMirrorOption from '@/components/BaseMirrorOption.vue'
-
-const notification = useNotification()
+import { notify } from '@/utils/naiveDiscrete.js'
 
 const update_able = inject('update_able')
 const running = inject('running')
@@ -19,11 +18,7 @@ async function update_self() {
   const response = await pywebview.api.update_self(
     new_version.value['assets'][0]['browser_download_url']
   )
-  notification['error']({
-    content: '错误',
-    meta: response,
-    duration: 3000
-  })
+  notify.error(response)
   update_self_running.value = false
   running.value = false
 }
@@ -38,18 +33,10 @@ async function check_update() {
   new_version.value = await pywebview.api.get_new_version()
   if (new_version.value.tag_name > version.value) {
     update_able.value = true
-    notification['info']({
-      content: '提示',
-      meta: '有新版本可更新',
-      duration: 3000
-    })
+    notify.info('有新版本可更新')
   } else {
     update_able.value = false
-    notification['info']({
-      content: '提示',
-      meta: '当前已是最新版本',
-      duration: 3000
-    })
+    notify.info('当前已是最新版本')
   }
   check_running.value = false
   running.value = false

ui/src/pages/Update.vue

@@ -23,23 +23,23 @@ const steps = computed(() => [
 const mirror_options = [
   {
     label: 'PyPI',
-    value: 'pypi',
+    value: 'pypi'
   },
   {
     label: '阿里云镜像源',
-    value: 'aliyun',
+    value: 'aliyun'
   },
   {
     label: '上海交通大学镜像源',
-    value: 'sjtu',
+    value: 'sjtu'
   },
   {
     label: '清华大学镜像源',
-    value: 'tuna',
+    value: 'tuna'
   },
   {
     label: '中国科学技术大学镜像源',
-    value: 'ustc',
+    value: 'ustc'
   }
 ]
 provide('steps', steps)

ui/src/utils/naiveDiscrete.js

@@ -0,0 +1,63 @@
+import { createDiscreteApi, darkTheme, lightTheme } from 'naive-ui'
+
+// 创建全局单例
+const { message, dialog, notification, loadingBar } = createDiscreteApi(
+  ['message', 'dialog', 'notification', 'loadingBar'],
+  {
+    configProviderProps: {
+      // 全局主题配置（示例使用系统主题）
+      theme: window.matchMedia('(prefers-color-scheme: dark)').matches ? darkTheme : lightTheme
+    }
+  }
+)
+
+// 创建统一的工厂函数
+const createMessager =
+  (handler, defaults) =>
+  (content, options = {}) => {
+    const mergedOptions =
+      typeof content === 'string'
+        ? { content, ...defaults, ...options }
+        : { ...defaults, ...content, ...options }
+
+    return handler(mergedOptions)
+  }
+
+// 消息提示封装
+export const toast = {
+  info: createMessager((opts) => message.info(opts.content, opts), { duration: 3000 }),
+
+  success: createMessager((opts) => message.success(opts.content, opts), { duration: 3000 }),
+
+  warning: createMessager((opts) => message.warning(opts.content, opts), { duration: 5000 }),
+
+  error: createMessager((opts) => message.error(opts.content, opts), { duration: 7000 })
+}
+
+// 通知封装
+export const notify = {
+  info: createMessager(notification.info, { title: '提示', duration: 3000 }),
+
+  success: createMessager(notification.success, { title: '成功', duration: 3000 }),
+
+  warning: createMessager(notification.warning, { title: '警告', duration: 5000 }),
+
+  error: createMessager(notification.error, { title: '错误', duration: 7000 })
+}
+
+// 对话框封装
+export const modal = {
+  info: (options) => dialog.info(options),
+  success: (options) => dialog.success(options),
+  warning: (options) => dialog.warning(options),
+  error: (options) => dialog.error(options),
+  confirm: (options) => dialog.confirm(options)
+}
+
+// 加载条控制器
+export const loader = {
+  start: () => loadingBar.start(),
+  finish: () => loadingBar.finish(),
+  error: () => loadingBar.error(),
+  setProgress: (progress) => loadingBar.setProgress(progress)
+}