feat: add token show switch (#102)

README.md

@@ -56,7 +56,7 @@
 - **Windows**: Windows 7 - Windows 11
 - **Linux**: x64
 
-<img src='./images/theme.gif' alt='theme' />
+<img src='./images/theme.gif' />
 <img src='./images/home.png' />
 <img src='./images/settings.png' />
 <img src='./images/role-1.png' />

src-tauri/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "chat_gpt"
-version = "0.0.7"
+version = "1.0.0"
 description = "ChatGPT-Desktop"
 authors = ["orangelckc", "bilibili-ayang"]
 license = "MIT"

src/components/Avatar/index.vue

@@ -1,11 +1,16 @@
 <script setup lang="ts">
+import { getName } from '@tauri-apps/api/app'
 import multiAvatar from '@multiavatar/multiavatar'
 
 const props = defineProps<{ value?: string }>()
 
-const avatar = computed(() =>
-  multiAvatar(props.value || import.meta.env.VITE_APP_NAME)
-)
+const appName = ref('')
+
+const avatar = computed(() => multiAvatar(props.value || appName.value))
+
+onMounted(async () => {
+  appName.value = await getName()
+})
 </script>
 
 <template>

src/components/Session/index.vue

@@ -15,7 +15,7 @@ const marked = new MarkdownIt({
   .use(MarkdownItHighlight)
   .use(copyCode)
 
-const { uuid } = storeToRefs(useSettingsStore())
+const { uuid, isTokenUsage } = storeToRefs(useSettingsStore())
 const { sessionDataList, currentSession } = storeToRefs(useSessionStore())
 const { currentRole } = storeToRefs(useRoleStore())
 
@@ -128,7 +128,9 @@ watch([currentSession, sessionDataList], () => {
             class="w-12!"
             :value="item.is_ask ? uuid : currentRole?.name"
           />
-          <span class="text-gray text-xs">{{ calcToken(item) }}</span>
+          <span class="text-gray text-xs" v-if="isTokenUsage">
+            {{ calcToken(item) }}
+          </span>
         </div>
         <div
           class="relative flex w-[calc(100%-8rem)] flex-col gap-2"

src/components/Settings/components/About.vue

@@ -22,6 +22,14 @@ const copyInfo = async () => {
   }
 
   await writeText(JSON.stringify(info))
+
+  Message.success('复制成功')
+}
+
+const copyQQGroup = () => {
+  writeText('473033518')
+
+  Message.success('群号已复制，无法跳转则自行添加')
 }
 
 onMounted(async () => {
@@ -49,7 +57,7 @@ onMounted(async () => {
       </div>
       <span>{{ appInfo.appName }}</span>
       <span>v{{ appInfo.appVersion }}</span>
-      <a class="cursor-pointer" @click="copyInfo">复制电脑信息</a>
+      <a class="cursor-pointer" @click="copyInfo">复制信息</a>
       <a href="https://github.com/ChatGPT-Desktop/ChatGPT-Desktop/issues/new">
         BUG 反馈
       </a>
@@ -65,11 +73,19 @@ onMounted(async () => {
       </a>
 
       <span>官方社区</span>
-      <div>
+      <div class="flex gap-3">
         <a href="https://discord.gg/jg4waryfA6" class="flex items-center gap-2">
           <img src="@/assets/image/discord.svg" />
           Discord
         </a>
+        <a
+          href="https://qm.qq.com/cgi-bin/qm/qr?k=vhU6EACVQqfxoXlVKAWCBE_dXH_qpxn2&jump_from=webapi&authKey=YTGKMbApCUrmxHWV0te4NFBWbN7YQViDrTZPH8zIdIzZLgs4xLQhcKxgaCFwqSx2"
+          class="flex items-center gap-2"
+          @click="copyQQGroup"
+        >
+          <img src="@/assets/image/qq.png" width="32" />
+          QQ群
+        </a>
       </div>
 
       <div class="flex flex-col gap-3" v-if="contributors.length">

src/components/Settings/components/General.vue

@@ -3,6 +3,10 @@ const settingsStore = useSettingsStore()
 const { toggleTheme } = settingsStore
 const { themeMode, autoStart, isRememberPosition, proxy } =
   storeToRefs(settingsStore)
+
+const refresh = () => {
+  window.location.reload()
+}
 </script>
 
 <template>
@@ -45,6 +49,11 @@ const { themeMode, autoStart, isRememberPosition, proxy } =
     <li>
       <i>开启代理:</i>
       <a-switch v-model="proxy.bypass" type="round"></a-switch>
+      <span class="text-sm text-[var(--color-text-3)]" v-show="proxy.bypass">
+        填写代理地址后，请点击<span class="mark cursor-pointer" @click="refresh"
+          >重启</span
+        >
+      </span>
     </li>
 
     <li v-show="proxy.bypass">

src/components/Settings/components/Modal.vue

@@ -1,5 +1,7 @@
 <script setup lang="ts">
-const { apiKey, isMemory, modalParams } = storeToRefs(useSettingsStore())
+const { apiKey, isMemory, modalParams, isTokenUsage } = storeToRefs(
+  useSettingsStore()
+)
 
 const totalCredit = ref(0)
 const usedCredit = ref(0)
@@ -36,6 +38,14 @@ watch(
     <li>
       <i>记忆模式:</i>
       <a-switch v-model="isMemory" type="round" />
+      <span class="text-sm text-[var(--color-text-3)]"
+        >开启记忆模式会加倍消耗 token</span
+      >
+    </li>
+
+    <li>
+      <i>Token 用量:</i>
+      <a-switch v-model="isTokenUsage" type="round" />
     </li>
 
     <li>

src/sqls/index.ts

@@ -1,11 +1,9 @@
-import { configDir } from '@tauri-apps/api/path'
+import { appConfigDir } from '@tauri-apps/api/path'
 import Database from 'tauri-plugin-sql-api'
 import type { TableName, TablePayload, WherePayload } from '@/types'
 
 const dbFile = import.meta.env.DEV ? 'sql.dev.db' : 'sql.db'
-const db = await Database.load(
-  `sqlite:${await configDir()}/${import.meta.env.VITE_CONFIG_PATH}/${dbFile}`
-)
+const db = await Database.load(`sqlite:${await appConfigDir()}/${dbFile}`)
 
 /**
  * sql 的字符串参数需要在加一个冒号

src/stores/settings.ts

@@ -42,6 +42,9 @@ export const useSettingsStore = defineStore(
     // modal设置参数
     const modalParams = reactive({ temperature: 0.6, max_tokens: 2000 })
 
+    // token 用量
+    const isTokenUsage = ref(false)
+
     // 绑定快捷键
     const registerKey = async () => {
       await unregisterAll()
@@ -133,6 +136,7 @@ export const useSettingsStore = defineStore(
       isRememberPosition,
       proxy,
       modalParams,
+      isTokenUsage,
       toggleTheme
     }
   },
@@ -147,7 +151,8 @@ export const useSettingsStore = defineStore(
         'isMemory',
         'isRememberPosition',
         'proxy',
-        'modalParams'
+        'modalParams',
+        'isTokenUsage'
       ]
     }
   }

src/utils/openai.ts

@@ -1,5 +1,5 @@
-import type { MessageData, SessionData } from '@/types'
 import GPT3Tokenizer from 'gpt3-tokenizer'
+import type { MessageData, SessionData } from '@/types'
 
 const tokenizer = new GPT3Tokenizer({ type: 'gpt3' })
 
@@ -37,7 +37,7 @@ export const getOpenAIKey = () => {
   const { apiKey } = useSettingsStore()
 
   if (!apiKey) {
-    Message.warning('请先填写 OpenAi API Key')
+    Message.warning('请先填写 OpenAi API KEY')
     return false
   }
 

src/utils/tauri.ts

@@ -1,12 +1,15 @@
 import { message } from '@tauri-apps/api/dialog'
+import { getName } from '@tauri-apps/api/app'
 
 /**
  * 错误弹框
  * @param errorMessage 错误信息
  */
-export const dialogErrorMessage = (errorMessage: string) => {
+export const dialogErrorMessage = async (errorMessage: string) => {
+  const appName = await getName()
+
   message(errorMessage, {
-    title: import.meta.env.VITE_APP_NAME,
+    title: appName,
     type: 'error'
   })
 }