chore: 记忆功能样式优化

src/views/personal-space/personal-app-setting/components/agent-memory-setting.vue

@@ -144,7 +144,7 @@ function handleChangeMemoryFragmentState(value: boolean) {
                 </template>
                 {{ memoryVariableItem.key }}
               </n-popover>
-              <div v-else class="max-w-[105px] truncate text-[#151b26]">{{ memoryVariableItem.key }}</div>
+              <div v-else class="max-w-[105px] truncate px-[3px] text-[#151b26]">{{ memoryVariableItem.key }}</div>
 
               <n-popover placement="bottom" trigger="hover" :show-arrow="false" class="p-[4px]!">
                 <template #trigger>
@@ -152,7 +152,7 @@ function handleChangeMemoryFragmentState(value: boolean) {
                 </template>
                 <div class="text-[12px]">
                   <div
-                    class="flex h-[30px] w-[90px] cursor-pointer items-center justify-start px-[8px] py-[5px] hover:rounded-[4px] hover:bg-[#f2f5f9]"
+                    class="flex h-[30px] cursor-pointer items-center justify-start px-[8px] py-[5px] hover:rounded-[4px] hover:bg-[#f2f5f9]"
                     @click="handleShowMemoryVariableModal"
                   >
                     <Edit theme="outline" size="16" fill="#333" :stroke-width="3" /><span class="ml-[4px]">
@@ -164,7 +164,7 @@ function handleChangeMemoryFragmentState(value: boolean) {
                     </span>
                   </div>
                   <div
-                    class="flex h-[30px] w-[90px] cursor-pointer items-center justify-start px-[8px] py-[5px] hover:rounded-[4px] hover:bg-[#f2f5f9]"
+                    class="flex h-[30px] cursor-pointer items-center justify-start px-[8px] py-[5px] hover:rounded-[4px] hover:bg-[#f2f5f9]"
                     @click="handleCopyMemoryVariableName(memoryVariableItem)"
                   >
                     <Copy theme="outline" size="16" fill="#333" :stroke-width="3" />
@@ -176,9 +176,8 @@ function handleChangeMemoryFragmentState(value: boolean) {
                       }}
                     </span>
                   </div>
-                  <n-space>
                   <div
-                      class="flex h-[30px] w-[90px] cursor-pointer items-center justify-start px-[8px] py-[5px] hover:rounded-[4px] hover:bg-[#f2f5f9]"
+                    class="flex h-[30px] w-full cursor-pointer items-center justify-start px-[8px] py-[5px] hover:rounded-[4px] hover:bg-[#f2f5f9]"
                     @click="handleDeleteMemoryVariableItem(memoryVariableItem)"
                   >
                     <ReduceOne theme="outline" size="16" fill="#333" :stroke-width="3" />
@@ -186,7 +185,6 @@ function handleChangeMemoryFragmentState(value: boolean) {
                       {{ t('common_module.delete') }}
                     </span>
                   </div>
-                  </n-space>
                 </div>
               </n-popover>
             </div>

src/views/personal-space/personal-app-setting/components/app-preview.vue

@@ -92,7 +92,7 @@ function handleOpenMemoryPreviewModal(MemoryTabName: string) {
 
 <template>
   <div class="flex h-full min-w-[300px] flex-[2_2_0%] flex-col overflow-hidden bg-[#f2f5f9]">
-    <div class="flex justify-between">
+    <div class="flex items-center justify-between">
       <div class="mb-[18px] flex w-full items-center justify-between px-5 py-[18px]">
         <p class="text-base">
           {{ t('personal_space_module.agent_module.agent_setting_module.agent_config_module.preview') }}
@@ -118,11 +118,11 @@ function handleOpenMemoryPreviewModal(MemoryTabName: string) {
             <n-popover placement="bottom" trigger="hover" class="p-[4px]!" :show-arrow="false">
               <template #trigger>
                 <div class="flex items-center justify-center pl-5 text-[14px]">
-                  <Brain theme="outline" size="16" fill="#333" />
+                  <Brain theme="outline" size="15" fill="#333" />
                   <div class="mx-[4px]">
                     {{ t('personal_space_module.agent_module.agent_setting_module.agent_config_module.memory') }}
                   </div>
-                  <Down theme="outline" size="16" fill="#333" class="inline" />
+                  <Down theme="outline" size="15" fill="#333" class="mt-[2px] inline" />
                 </div>
               </template>
               <div>

src/views/personal-space/personal-app-setting/components/memory-preview-modal.vue

@@ -248,7 +248,7 @@ function handleModalOpenAfter() {
                         </div>
                       </div>
                     </div>
-                    <div v-show="longMemoryList.length === 0" class="mt-[60px] flex h-[250px] flex-col items-center">
+                    <div v-show="longMemoryList.length === 0" class="mt-[90px] flex h-[250px] flex-col items-center">
                       <img src="@/assets/images/empty.png" width="144px" height="100px" />
                       <div class="text-[14px]">{{ t('common_module.empty_data') }}</div>
                     </div>

src/views/personal-space/personal-app-setting/components/memory-variable-modal.vue

@@ -149,6 +149,7 @@ defineExpose({
     class="h-auto max-h-[720px]"
     :mask-closable="false"
     :auto-focus="false"
+    :on-after-leave="handleMemoryPreviewModalClose"
   >
     <div class="flex flex-col items-center justify-center">
       <div class="max-h-[720px] w-[820px] rounded-lg bg-white p-[24px]">
@@ -165,7 +166,7 @@ defineExpose({
             size="18"
             fill="#00000073"
             class="cursor-pointer"
-            @click="handleMemoryPreviewModalClose()"
+            @click="isShowMemoryVariableModal = false"
           />
         </div>
         <div
@@ -188,7 +189,7 @@ defineExpose({
           </div>
         </div>
         <div>
-          <n-scrollbar style="max-height: 490px; overflow: hidden">
+          <n-scrollbar style="max-height: 450px; overflow: hidden">
             <div class="flex justify-center">
               <table class="w-full">
                 <thead class="sticky top-[0px] z-20 text-[#5c5f66]">
@@ -381,7 +382,7 @@ defineExpose({
           <div class="mt-[24px] flex justify-end">
             <button
               class="hover:text-theme-color hover:border-theme-color !mr-[12px] box-content !h-[38px] !w-[74px] cursor-pointer rounded-[6px] border-[1px] border-solid border-[#dde3f0] px-[10px] outline-none transition-all duration-300 hover:border-[theme-color]"
-              @click="handleMemoryPreviewModalClose()"
+              @click="isShowMemoryVariableModal = false"
             >
               {{ t('common_module.cancel_btn_text') }}
             </button>