feat: language use radio selection

Synaptrix · Apr 9, 2023 · 540d9da · 540d9da
1 parent bb7adcf
commit 540d9da
Show file tree

Hide file tree

Showing 5 changed files with 40 additions and 19 deletions.
diff --git a/src/components/Session/components/SessionAvatar.vue b/src/components/Session/components/SessionAvatar.vue
@@ -86,7 +86,10 @@ const calcToken = (data: SessionData) => {
       />
     </a-tooltip>
 
-    <span class="text-gray text-xs" v-if="isTokenUsage">
+    <span
+      class="text-gray w-13! whitespace-nowrap text-center text-xs"
+      v-if="isTokenUsage"
+    >
       {{ calcToken(data) }}
     </span>
 

diff --git a/src/components/Session/index.vue b/src/components/Session/index.vue
@@ -79,7 +79,11 @@ watch([currentSession, sessionDataList], () => {
             {{ getLocalTime(item.time!) }}
           </span>
 
-          <div class="blink-block" v-if="!item.message.content" />
+          <div
+            class="blink-block"
+            :class="[showTime ? 'p0' : 'py-4']"
+            v-if="!item.message.content"
+          />
 
           <SessionContent :data="item" v-else />
         </div>

diff --git a/src/components/Settings/components/General.vue b/src/components/Settings/components/General.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 const settingsStore = useSettingsStore()
 const { toggleTheme, setLanguage } = settingsStore
-const { themeMode, autoStart, isRememberPosition, proxy, showTime } =
+const { themeMode, autoStart, isRememberPosition, proxy, currentLang } =
   storeToRefs(settingsStore)
 
 const relaunch = () => {
@@ -11,11 +11,21 @@ const relaunch = () => {
 
 <template>
   <ul class="general flex flex-col gap-4">
-    <button @click="setLanguage('zh')">zh</button>
-    <button @click="setLanguage('en')">en</button>
     <li>
-      <i>唤醒窗口:</i>
-      <ShortcutKey />
+      <i>语言:</i>
+      <a-radio-group
+        v-model="currentLang"
+        type="button"
+        size="large"
+        @change="(value: any) => setLanguage(value)"
+      >
+        <a-radio value="zh">
+          <icon-chinese-fill />
+        </a-radio>
+        <a-radio value="en">
+          <icon-english-fill />
+        </a-radio>
+      </a-radio-group>
     </li>
 
     <li>
@@ -38,6 +48,11 @@ const relaunch = () => {
       </a-radio-group>
     </li>
 
+    <li>
+      <i>唤醒窗口:</i>
+      <ShortcutKey />
+    </li>
+
     <li>
       <i>开机自启动:</i>
       <a-switch v-model="autoStart" type="round" size="medium" />
@@ -48,11 +63,6 @@ const relaunch = () => {
       <a-switch v-model="isRememberPosition" type="round" />
     </li>
 
-    <li>
-      <i>显示对话时间:</i>
-      <a-switch v-model="showTime" type="round" />
-    </li>
-
     <li>
       <i>开启代理:</i>
       <a-switch v-model="proxy.bypass" type="round"></a-switch>

diff --git a/src/components/Settings/components/Modal.vue b/src/components/Settings/components/Modal.vue
@@ -1,7 +1,6 @@
 <script setup lang="ts">
-const { apiKey, isMemory, modalParams, isTokenUsage, tokenUnit } = storeToRefs(
-  useSettingsStore()
-)
+const { apiKey, isMemory, modalParams, isTokenUsage, tokenUnit, showTime } =
+  storeToRefs(useSettingsStore())
 
 const totalCredit = ref(0)
 const usedCredit = ref(0)
@@ -35,6 +34,11 @@ watch(
       <a-input-password v-model="apiKey" placeholder="OpenAI API KEY" />
     </li>
 
+    <li>
+      <i>显示对话时间:</i>
+      <a-switch v-model="showTime" type="round" />
+    </li>
+
     <li>
       <i>记忆模式:</i>
       <a-switch v-model="isMemory" type="round" />

diff --git a/src/stores/settings.ts b/src/stores/settings.ts
@@ -52,6 +52,10 @@ export const useSettingsStore = defineStore(
     // 显示对话时间
     const showTime = ref(false)
 
+    // 当前显示语言
+    const currentLang = ref<string | undefined>()
+    const { locale } = useI18n({ useScope: 'global' })
+
     // 绑定快捷键
     const registerKey = async () => {
       await unregisterAll()
@@ -80,10 +84,6 @@ export const useSettingsStore = defineStore(
       document.body.setAttribute('arco-theme', theme)
     }
 
-    // 当前显示语言
-    const currentLang = ref<string | undefined>()
-    const { locale } = useI18n({ useScope: 'global' })
-
     // 语言切换
     const setLanguage = async (lang?: Locales) => {
       const systemLang = ((await invoke('get_user_language')) as string).split(