perf: support for modify role info during session, close #140 (#157)

Synaptrix · Mar 31, 2023 · fefbca7 · fefbca7
1 parent 3604806
commit fefbca7
Show file tree

Hide file tree

Showing 6 changed files with 83 additions and 29 deletions.
diff --git a/splashscreen.html → public/splashscreen.html b/splashscreen.html → public/splashscreen.html
@@ -6,14 +6,15 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Document</title>
     <style>
-        body{
-            margin: 0;
-            padding: 0;
-            background-color: #212121;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-        }
+      body {
+        margin: 0;
+        padding: 0;
+        background-color: #000;
+        height: 100vh;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+      }
       .loader {
         width: 130px;
         height: 170px;

diff --git a/src-tauri/tauri.conf.json b/src-tauri/tauri.conf.json
@@ -88,17 +88,18 @@
         "visible": false
       },
       {
-        "width": 400,
-        "height": 200,
+        "width": 300,
+        "height": 300,
         "center": true,
         "transparent": true,
         "decorations": false,
         "url": "splashscreen.html",
-        "label": "splashscreen"
+        "label": "splashscreen",
+        "alwaysOnTop": true
       }
     ],
     "systemTray": {
       "iconPath": "assets/tray.png"
     }
   }
-}
+}
diff --git a/src/App.vue b/src/App.vue
@@ -1,16 +1,11 @@
 <script setup lang="ts">
-import { invoke } from '@tauri-apps/api/tauri'
 const { isFix } = storeToRefs(useSettingsStore())
 
 const { windowClass } = useInit()
 
 const handleDoubleClick = () => {
   isFix.value = !isFix.value
 }
-
-onMounted(() => {
-  invoke('close_splashscreen')
-})
 </script>
 
 <template>

diff --git a/src/components/Session/components/SessionAvatar.vue b/src/components/Session/components/SessionAvatar.vue
@@ -1,14 +1,30 @@
 <script lang="ts" setup>
-import type { SessionData } from '@/types'
-import { estimateTokens } from '@/utils'
+import type { SessionData, RolePayload } from '@/types'
 
-defineProps<{
-  data: SessionData
-}>()
-const { currentRole } = storeToRefs(useRoleStore())
+defineProps<{ data: SessionData }>()
+const roleStore = useRoleStore()
+const { updateRole } = roleStore
+const { currentRole } = storeToRefs(roleStore)
 const { uuid, isTokenUsage } = storeToRefs(useSettingsStore())
 const { sessionDataList, currentSession } = storeToRefs(useSessionStore())
 
+const { modalMaskStyle } = useModalStyle()
+
+const visible = ref(false)
+const prevRoleInfo = ref<any>()
+
+const handleOK = () => {
+  visible.value = false
+  updateRole()
+}
+
+const handleCancel = () => {
+  visible.value = false
+
+  currentRole.value = prevRoleInfo.value
+  updateRole(prevRoleInfo.value)
+}
+
 /**
  * 计算单条消息消耗的token
  * @param data 单条消息
@@ -58,9 +74,49 @@ const calcToken = (data: SessionData) => {
 
 <template>
   <div class="flex flex-col items-center gap-1">
-    <Avatar class="w-12!" :value="data.is_ask ? uuid : currentRole?.name" />
+    <Avatar class="w-12!" :value="uuid" v-if="data.is_ask" />
+
+    <a-tooltip content="点我编辑角色信息" position="tl" v-else>
+      <Avatar
+        class="w-12! cursor-pointer"
+        :value="currentRole?.name"
+        @click="visible = true"
+      />
+    </a-tooltip>
+
     <span class="text-gray text-xs" v-if="isTokenUsage">
       {{ calcToken(data) }}
     </span>
+
+    <a-modal
+      :visible="visible"
+      simple
+      :width="500"
+      :mask-style="modalMaskStyle"
+      :mask-closable="false"
+      :esc-to-close="false"
+      unmount-on-close
+      @before-open="prevRoleInfo = { ...currentRole }"
+      @ok="handleOK"
+      @cancel="handleCancel"
+      v-if="currentRole"
+    >
+      <div class="flex flex-col gap-3">
+        <div class="flex gap-2">
+          <span class="min-w-fit leading-[32px]">角色名称：</span>
+          <a-input v-model="currentRole.name" />
+        </div>
+        <div class="flex gap-2">
+          <span class="min-w-fit leading-[32px]">角色描述：</span>
+          <a-textarea
+            v-model="currentRole.description"
+            :auto-size="{
+              minRows: 1,
+              maxRows: 5
+            }"
+          />
+        </div>
+      </div>
+    </a-modal>
   </div>
 </template>
diff --git a/src/hooks/useInit.ts b/src/hooks/useInit.ts
@@ -1,17 +1,16 @@
 import { appWindow } from '@tauri-apps/api/window'
 import { type } from '@tauri-apps/api/os'
+import { invoke } from '@tauri-apps/api/tauri'
 
 export const useInit = () => {
-  const isLoading = ref(true)
-
   const windowClass = ref('')
 
   const { isFix, windowFocused } = storeToRefs(useSettingsStore())
 
   onMounted(async () => {
     await initSQL()
 
-    isLoading.value = false
+    invoke('close_splashscreen')
 
     useObserverLink()
 
@@ -51,5 +50,5 @@ export const useInit = () => {
     { immediate: true }
   )
 
-  return { isLoading, windowClass }
+  return { windowClass }
 }
diff --git a/src/stores/role.ts b/src/stores/role.ts
@@ -63,7 +63,9 @@ export const useRoleStore = defineStore(
     }
 
     // 更新角色信息
-    const updateRole = async (payload: RolePayload) => {
+    const updateRole = async (payload?: RolePayload) => {
+      if (!payload) payload = currentRole.value!
+
       await updateSQL('role', payload)
 
       getRoleList()