参考mower的conf配置

ui/package-lock.json

@@ -8,6 +8,7 @@
       "name": "ui",
       "version": "0.0.0",
       "dependencies": {
+        "pinia": "^2.2.8",
         "vue": "^3.5.11"
       },
       "devDependencies": {
@@ -1131,6 +1132,11 @@
         "@vue/shared": "3.5.11"
       }
     },
+    "node_modules/@vue/devtools-api": {
+      "version": "6.6.4",
+      "resolved": "https://registry.npmmirror.com/@vue/devtools-api/-/devtools-api-6.6.4.tgz",
+      "integrity": "sha512-sGhTPMuXqZ1rVOk32RylztWkfXTRhuS7vgAKv0zjqk8gbsHkJ7xfFf+jbySxt7tWObEJwyKaHMikV/WGDiQm8g=="
+    },
     "node_modules/@vue/eslint-config-prettier": {
       "version": "10.0.0",
       "resolved": "https://registry.npmjs.org/@vue/eslint-config-prettier/-/eslint-config-prettier-10.0.0.tgz",
@@ -2534,6 +2540,56 @@
         "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
+    "node_modules/pinia": {
+      "version": "2.2.8",
+      "resolved": "https://registry.npmmirror.com/pinia/-/pinia-2.2.8.tgz",
+      "integrity": "sha512-NRTYy2g+kju5tBRe0oNlriZIbMNvma8ZJrpHsp3qudyiMEA8jMmPPKQ2QMHg0Oc4BkUyQYWagACabrwriCK9HQ==",
+      "dependencies": {
+        "@vue/devtools-api": "^6.6.3",
+        "vue-demi": "^0.14.10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/posva"
+      },
+      "peerDependencies": {
+        "@vue/composition-api": "^1.4.0",
+        "typescript": ">=4.4.4",
+        "vue": "^2.6.14 || ^3.5.11"
+      },
+      "peerDependenciesMeta": {
+        "@vue/composition-api": {
+          "optional": true
+        },
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/pinia/node_modules/vue-demi": {
+      "version": "0.14.10",
+      "resolved": "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.14.10.tgz",
+      "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
+      "hasInstallScript": true,
+      "bin": {
+        "vue-demi-fix": "bin/vue-demi-fix.js",
+        "vue-demi-switch": "bin/vue-demi-switch.js"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "@vue/composition-api": "^1.0.0-rc.1",
+        "vue": "^3.0.0-0 || ^2.6.0"
+      },
+      "peerDependenciesMeta": {
+        "@vue/composition-api": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/pkg-types": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/pkg-types/-/pkg-types-1.2.0.tgz",

ui/package.json

@@ -11,6 +11,7 @@
     "format": "prettier --write src/"
   },
   "dependencies": {
+    "pinia": "^2.2.8",
     "vue": "^3.5.11"
   },
   "devDependencies": {

ui/src/App.vue

@@ -5,16 +5,12 @@ import Update from '@/pages/Update.vue'
 import Fix from '@/pages/Fix.vue'
 import { dateZhCN, zhCN } from 'naive-ui'
 import Settings from '@/pages/Settings.vue'
+import { useConfigStore } from '@/stores/config.js'
 
+const configStore = useConfigStore()
 const loading = ref(true)
 const page = ref(null)
-
-function load_config() {
-  pywebview.api.get_page().then((value) => {
-    page.value = value
-    loading.value = false
-  })
-}
+let conf
 
 async function init_version() {
   version.value = await pywebview.api.get_version()
@@ -23,6 +19,12 @@ async function init_version() {
     update_able.value = true
   }
 }
+async function initialize_config() {
+  await configStore.load_config()
+  conf = configStore.config
+  await init_version()
+  loading.value = false
+}
 
 const log = ref('')
 provide('log', log)
@@ -36,12 +38,10 @@ watch(log, () => {
 
 onMounted(() => {
   if (window.pywebview && pywebview.api) {
-    load_config()
-    init_version()
+    initialize_config()
   } else {
     window.addEventListener('pywebviewready', () => {
-      load_config()
-      init_version()
+      initialize_config()
     })
   }
   window.addEventListener('log', (e) => {
@@ -51,7 +51,6 @@ onMounted(() => {
 
 function set_page(value) {
   log.value = ''
-  pywebview.api.set_page(value)
 }
 
 const running = ref(false)
@@ -80,7 +79,7 @@ provide('new_version', new_version)
         type="card"
         placement="left"
         class="container"
-        :default-value="page"
+        v-model:value="conf.page"
         @update:value="set_page"
       >
         <n-tab-pane :disabled="running" name="init" tab="初始化"><init /></n-tab-pane>

ui/src/main.js

@@ -2,6 +2,10 @@ import 'vfonts/Lato.css'
 import 'vfonts/FiraCode.css'
 
 import { createApp } from 'vue'
+import { createPinia } from 'pinia'
 import App from './App.vue'
+
 const app = createApp(App)
+const pinia = createPinia()
+app.use(pinia)
 app.mount('#app')

ui/src/pages/Update.vue

@@ -1,23 +1,10 @@
 <script setup>
+import { useConfigStore } from '@/stores/config.js'
+
+const conf = useConfigStore().config
 const branch = ref(null)
 const mirror = ref(null)
 
-onMounted(() => {
-  pywebview.api.get_branch().then((value) => {
-    branch.value = value
-  })
-  pywebview.api.get_mirror().then((value) => {
-    mirror.value = value
-  })
-})
-
-watch(branch, () => {
-  pywebview.api.set_branch(branch.value)
-})
-watch(mirror, () => {
-  pywebview.api.set_mirror(mirror.value)
-})
-
 const steps = computed(() => [
   {
     title: '更新源码',
@@ -41,7 +28,7 @@ provide('current_state', current_state)
   <n-flex vertical style="gap: 16px; height: 100%; padding: 16px; box-sizing: border-box">
     <n-form label-placement="left" :show-feedback="false" label-width="auto" label-align="left">
       <n-form-item label="mower-ng 代码分支">
-        <n-radio-group v-model:value="branch">
+        <n-radio-group v-model:value="conf.branch">
           <n-flex>
             <n-radio value="fast">测试版</n-radio>
             <n-radio value="slow">稳定版</n-radio>
@@ -49,7 +36,7 @@ provide('current_state', current_state)
         </n-radio-group>
       </n-form-item>
       <n-form-item label="PyPI 仓库镜像">
-        <n-radio-group v-model:value="mirror">
+        <n-radio-group v-model:value="conf.mirror">
           <n-flex>
             <n-radio value="pypi">PyPI</n-radio>
             <n-radio value="aliyun">阿里云镜像站</n-radio>

ui/src/stores/config.js

@@ -0,0 +1,32 @@
+import { defineStore } from 'pinia'
+
+export const useConfigStore = defineStore('config', () => {
+  class Config {
+    constructor(conf) {
+      this.page = conf.page
+      this.branch = conf.branch
+      this.mirror = conf.mirror
+    }
+  }
+
+  const config = ref({})
+
+  async function load_config() {
+    const conf = await pywebview.api.load_config()
+    config.value = new Config(conf)
+    console.log('config.value', config.value)
+  }
+
+  watch(
+    config,
+    () => {
+      pywebview.api.save_config(config.value)
+    },
+    { deep: true }
+  )
+
+  return {
+    load_config,
+    config
+  }
+})