feat: added the ability to turn on self-start

package.json

@@ -22,6 +22,7 @@
     "@tauri-apps/api": "^1.2.0",
     "pinia": "^2.0.33",
     "pinia-plugin-persistedstate": "^3.1.0",
+    "tauri-plugin-autostart-api": "https://github.com/tauri-apps/tauri-plugin-autostart",
     "tauri-plugin-sql-api": "https://github.com/tauri-apps/tauri-plugin-sql",
     "tauri-plugin-store-api": "https://github.com/tauri-apps/tauri-plugin-store",
     "vue": "^3.2.45"
@@ -53,4 +54,4 @@
     "vite": "^4.0.0",
     "vue-tsc": "^1.0.11"
   }
-}
+}

src-tauri/Cargo.toml

@@ -14,6 +14,7 @@ tauri-build = { version = "1.2", features = [] }
 
 [dependencies]
 tauri = { version = "1.2", features = ["api-all", "macos-private-api", "system-tray"] }
+tauri-plugin-autostart = { git = "https://github.com/tauri-apps/plugins-workspace", branch = "dev" }
 serde = { version = "1.0", features = ["derive"] }
 serde_json = "1.0"
 

src-tauri/src/main.rs

@@ -1,6 +1,8 @@
 // Prevents additional console window on Windows in release, DO NOT REMOVE!!
 #![cfg_attr(not(debug_assertions), windows_subsystem = "windows")]
 
+use tauri_plugin_autostart::MacosLauncher;
+
 mod folder;
 mod tray;
 
@@ -10,6 +12,10 @@ fn main() {
     tauri::Builder::default()
         .system_tray(tray::main_menu())
         .plugin(tauri_plugin_sql::Builder::default().build())
+        .plugin(tauri_plugin_autostart::init(
+            MacosLauncher::LaunchAgent,
+            Some(vec!["--flag1", "--flag2"]), /* arbitrary number of args to pass to your app */
+        ))
         .on_system_tray_event(tray::handler)
         .run(tauri::generate_context!())
         .expect("error while running tauri application");

src/App.vue

@@ -1,15 +1,15 @@
 <script setup lang="ts">
 import { appWindow } from '@tauri-apps/api/window'
 import { initSQL } from '@/sqls'
-import { useSettingsStore, useSessionStore, useRoleStore } from '@/stores'
+import { useSettingsStore, useRoleStore } from '@/stores'
 
 // TODO: 首次加载有问题，获取不到初始化的角色列表
 initSQL()
 
-const { themeClass, isFix, shortcutKey, uuid } = storeToRefs(useSettingsStore())
-const { sessionDataList, currentSession } = storeToRefs(useSessionStore())
+const { themeClass, isFix } = storeToRefs(useSettingsStore())
 const { currentRole } = storeToRefs(useRoleStore())
 
+// 窗口获取焦点状态
 const windowFocused = ref(true)
 
 onMounted(async () => {
@@ -21,64 +21,33 @@ onMounted(async () => {
   })
 })
 </script>
-<!-- TODO:颜色与 ui 的调整 -->
+
 <template>
   <div
     class="frosted flex h-screen cursor-move flex-col overflow-hidden rounded-xl p-2"
     :class="[themeClass, windowFocused ? 'bordered' : 'bordered-transparent']"
     data-tauri-drag-region
   >
     <div class="text-7 fixed top-2 right-2 flex gap-2">
+      <!-- 主题切换 -->
       <Theme />
-
+      <!-- 固定窗口 -->
       <Fixed />
     </div>
 
-    <div class="flex-1 cursor-default overflow-auto">
-      <template v-if="sessionDataList.length">
-        <h3>当前session{{ currentSession?.id }}{{ currentSession?.title }}</h3>
-        <div
-          class="flex items-start p-2"
-          v-for="(item, index) in sessionDataList"
-          :key="item.time"
-        >
-          <Avatar class="w-14!" :value="index % 2 ? uuid : currentRole?.name" />
-          <div>
-            {{ item.messages }}
-          </div>
-        </div>
-      </template>
-
-      <!-- 无对话内容 -->
-      <div
-        class="text-5 flex h-full flex-col items-center justify-center gap-4"
-        v-else
-      >
-        <!-- TODO: 丰富此处信息 -->
-        <span>
-          <template v-for="(item, index) of shortcutKey" :key="index">
-            <a-typography-text code>{{ item }}</a-typography-text>
-            <template v-if="index < shortcutKey.length - 1"> + </template>
-          </template>
-          唤醒窗口
-        </span>
-        <span
-          ><a-typography-text code>Shift</a-typography-text> +
-          <a-typography-text code>Enter</a-typography-text> 换行
-        </span>
-        <span><a-typography-text code>Enter</a-typography-text> 发送消息</span>
-      </div>
-    </div>
+    <!-- 会话信息 -->
+    <Session />
 
     <div class="flex cursor-default flex-col gap-2 pt-2">
       <div class="text-6 relative flex justify-end gap-4">
+        <!-- 当前聊天角色对象 -->
         <div class="top-50% left-50% text-4 -translate-1/2 absolute">
           正在与 <span class="mark">{{ currentRole?.name }}</span> 对话
         </div>
-
+        <!-- 功能按钮 -->
         <Function />
       </div>
-
+      <!-- 输入框 -->
       <Input />
     </div>
   </div>

src/components/Function/components/SettingsModal.vue

@@ -1,8 +1,10 @@
 <script setup lang="ts">
 import { useSettingsStore } from '@/stores'
 import ShortcutKey from './ShortcutKey.vue'
-const { apiKey } = storeToRefs(useSettingsStore())
+
 defineProps<{ visible: boolean; setVisible: () => void }>()
+
+const { apiKey, autoStart } = storeToRefs(useSettingsStore())
 </script>
 
 <template>
@@ -20,10 +22,13 @@ defineProps<{ visible: boolean; setVisible: () => void }>()
   >
     <div class="flex flex-col gap-8">
       <div class="flex gap-2">
-        <a-checkbox>开机自启动</a-checkbox>
+        <a-checkbox v-model="autoStart" @change="autoStart = !autoStart">
+          开机自启动
+        </a-checkbox>
         <a-checkbox>隐藏菜单栏图标</a-checkbox>
       </div>
 
+      <!-- 热键绑定 -->
       <ShortcutKey />
 
       <a-input-password

src/components/Function/components/ShortcutKey.vue

@@ -8,15 +8,19 @@ const IconFont = Icon.addFromIconFontCn({
 })
 
 const { shortcutKey, isBinding } = storeToRefs(useSettingsStore())
+
 // 获取最后一位快捷键
 const lastShortcutKey = computed(() => shortcutKey.value.at(-1) || '')
+
 // 绑定快捷键的元素
 const bindingElement = ref<HTMLElement | null>(null)
+
 // 获取焦点事件
 const handleFocus = () => {
   shortcutKey.value = []
   isBinding.value = true
 }
+
 // 键盘按下事件
 const handleKeydown = (event: KeyboardEvent) => {
   // key 只用在四个热键，code 用于其他的键
@@ -55,6 +59,7 @@ const handleKeydown = (event: KeyboardEvent) => {
     }
   }
 }
+
 // 键盘弹起事件
 const handleKeyup = (event: KeyboardEvent) => {
   if (!isBinding.value) return
@@ -71,6 +76,7 @@ const handleKeyup = (event: KeyboardEvent) => {
 }
 </script>
 <!-- TODO:热键绑定高度会有跳动，更换整体图标 -->
+<!-- TODO: 失去焦点应该先判断有没有自定义过，没有就行把之前的再显示回来，而不是直接置为默认 -->
 <template>
   <div class="flex items-center gap-2">
     <span>唤醒窗口：</span>

src/components/Function/index.vue

@@ -7,7 +7,6 @@ import {
   IconSettings
 } from '@arco-design/web-vue/es/icon'
 import { useSessionStore } from '@/stores'
-import { getArrayLength } from '@/utils'
 
 const { currentSession, isThinking, sessionDataList } = storeToRefs(
   useSessionStore()
@@ -59,7 +58,7 @@ const functions = computed(() => [
       v-for="(item, index) in functions"
       :content="item.content"
       :key="index"
-      :position="index === getArrayLength(functions) - 1 ? 'tr' : 'top'"
+      :position="index === functions.length - 1 ? 'tr' : 'top'"
     >
       <a-button type="text" :disabled="item.disabled" @click="item.handleClick">
         <template #icon>

src/components/Input/index.vue

@@ -66,8 +66,6 @@ onMounted(() => {
 <style lang="scss" scoped>
 .app-input {
   .arco-textarea-wrapper {
-    // height: 32px;
-
     transition: all 0.3s;
 
     border-radius: 32px;
@@ -77,7 +75,6 @@ onMounted(() => {
     }
     &.arco-textarea-focus {
       max-height: 96px;
-      overflow-y: scroll;
 
       border-color: rgb(var(--arcoblue-6));
       border-radius: 0;

src/components/Session/components/NoSession.vue

@@ -0,0 +1,25 @@
+<script setup lang="ts">
+import { useSettingsStore } from '@/stores'
+
+const { shortcutKey } = storeToRefs(useSettingsStore())
+</script>
+
+<template>
+  <div class="text-5 flex h-full flex-col items-center justify-center gap-4">
+    <!-- 唤醒窗口 -->
+    <span>
+      <template v-for="(item, index) of shortcutKey" :key="index">
+        <a-typography-text code>{{ item }}</a-typography-text>
+        <template v-if="index < shortcutKey.length - 1"> + </template>
+      </template>
+      唤醒窗口
+    </span>
+    <!-- 换行 -->
+    <span>
+      <a-typography-text code>Shift</a-typography-text> +
+      <a-typography-text code>Enter</a-typography-text> 换行
+    </span>
+    <!-- 发送消息 -->
+    <span><a-typography-text code>Enter</a-typography-text> 发送消息</span>
+  </div>
+</template>

src/components/Session/index.vue

@@ -1,11 +1,30 @@
 <script setup lang="ts">
-import { useSessionStore } from '@/stores'
+import { useSettingsStore, useSessionStore, useRoleStore } from '@/stores'
 
-const { currentSession } = storeToRefs(useSessionStore())
+const { uuid } = storeToRefs(useSettingsStore())
+const { currentSession, sessionDataList } = storeToRefs(useSessionStore())
+const { currentRole } = storeToRefs(useRoleStore())
 </script>
 
 <template>
-  {{ currentSession }}
+  <div class="flex-1 cursor-default overflow-auto">
+    <template v-if="sessionDataList.length">
+      <h3>当前session{{ currentSession?.id }}{{ currentSession?.title }}</h3>
+      <div
+        class="flex items-start p-2"
+        v-for="(item, index) in sessionDataList"
+        :key="item.time"
+      >
+        <Avatar class="w-14!" :value="index % 2 ? uuid : currentRole?.name" />
+        <div>
+          {{ item.messages }}
+        </div>
+      </div>
+    </template>
+
+    <!-- 当前无会话 -->
+    <NoSession v-else />
+  </div>
 </template>
 
 <style scoped lang="scss"></style>