From c550a34418ed1dcb34645caba30f3283f2e116e9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=BB=84=E5=AD=9F?= <3111696955@qq.com>
Date: Fri, 8 Aug 2025 16:53:02 +0800
Subject: [PATCH] =?UTF-8?q?refactor(biji-qianduan):=20=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E7=AC=94=E8=AE=B0=E9=A2=84=E8=A7=88=E6=A0=87=E9=A2=98=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F=E5=B9=B6=E9=80=82=E9=85=8D=E7=A7=BB=E5=8A=A8=E7=AB=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 在笔记预览标题中添加省略号效果，防止过长标题溢出
- 为移动端优化按钮样式，增加圆形按钮和调整按钮大小
- 根据屏幕大小条件
---
 biji-qianduan/src/components/HomePage.vue | 33 +++++++++++++++++------
 1 file changed, 25 insertions(+), 8 deletions(-)

diff --git a/biji-qianduan/src/components/HomePage.vue b/biji-qianduan/src/components/HomePage.vue
index 644afd3..f138b92 100644
--- a/biji-qianduan/src/components/HomePage.vue
+++ b/biji-qianduan/src/components/HomePage.vue
@@ -39,22 +39,31 @@
         <div v-if="selectedFile" class="file-preview">
           <el-header class="preview-header">
             <h2 class="preview-title">
-              {{ selectedFile.title }}
+              <span>{{ selectedFile.title }}</span>
               <el-icon v-if="selectedFile.isPrivate === 1" class="lock-icon"><Lock /></el-icon>
               <el-icon class="edit-icon" @click="openRenameDialog(selectedFile, 'file')"><Edit /></el-icon>
             </h2>
             <div class="actions">
-              <el-button v-if="!showEditor" type="primary" @click="selectedFile = null">返回</el-button>
-              <el-button v-if="!showEditor && userStore.isLoggedIn" type="warning" @click="showMoveNoteDialog = true">移动</el-button>
-              <el-button v-if="!showEditor && userStore.isLoggedIn" type="primary" @click="editNote(selectedFile); isCollapsed = true">编辑</el-button>
-              <el-button v-if="!showEditor && userStore.isLoggedIn" type="danger" @click="deleteNote(selectedFile)">删除</el-button>
+              <el-button v-if="!showEditor" :circle="isMobile" :size="isMobile ? 'small' : 'default'" type="primary" @click="selectedFile = null">
+                <el-icon v-if="isMobile"><Back /></el-icon>
+                <span v-else>返回</span>
+              </el-button>
+              <el-button v-if="!showEditor && userStore.isLoggedIn && !isMobile" type="warning" @click="showMoveNoteDialog = true">移动</el-button>
+              <el-button v-if="!showEditor && userStore.isLoggedIn" :circle="isMobile" :size="isMobile ? 'small' : 'default'" type="primary" @click="editNote(selectedFile); isCollapsed = true">
+                <el-icon v-if="isMobile"><Edit /></el-icon>
+                <span v-else>编辑</span>
+              </el-button>
+              <el-button v-if="!showEditor && userStore.isLoggedIn" :circle="isMobile" :size="isMobile ? 'small' : 'default'" type="danger" @click="deleteNote(selectedFile)">
+                <el-icon v-if="isMobile"><Delete /></el-icon>
+                <span v-else>删除</span>
+              </el-button>
               <el-button v-if="showEditor" type="primary" @click="showEditor = !showEditor; previewFile(editData)">返回</el-button>
               <el-button v-if="showEditor && userStore.isLoggedIn" type="success" @click="handleSave(vditor.getValue())">保存</el-button>
               <span v-if="showEditor" class="save-status">{{ saveStatus }}</span>
-              <el-button v-if="!showEditor && userStore.isLoggedIn" type="info" @click="showPrivacyDialog = true">
+              <el-button v-if="!showEditor && userStore.isLoggedIn && !isMobile" type="info" @click="showPrivacyDialog = true">
                 {{ selectedFile.isPrivate === 1 ? '设为公开' : '设为私密' }}
               </el-button>
-              <el-dropdown v-if="!showEditor && userStore.isLoggedIn" @command="handleExport">
+              <el-dropdown v-if="!showEditor && userStore.isLoggedIn && !isMobile" @command="handleExport">
                 <el-button type="success">
                   导出<el-icon class="el-icon--right"><arrow-down /></el-icon>
                 </el-button>
@@ -337,7 +346,7 @@ import {
   generateRegistrationCode,
   updatePassword
 } from '@/api/CommonApi.js'
-import { Plus, Fold, Expand, Folder, Document, Search, Edit, Delete, ArrowDown, Clock, Lock, InfoFilled, Menu, User } from "@element-plus/icons-vue";
+import { Plus, Fold, Expand, Folder, Document, Search, Edit, Delete, ArrowDown, Clock, Lock, InfoFilled, Menu, User, Back } from "@element-plus/icons-vue";
 import { useUserStore } from '../stores/user';
 import { useRouter } from 'vue-router';
 import { privateNoteContent } from '../utils/privateNoteContent.js';
@@ -1412,6 +1421,14 @@ const resetUpdatePasswordForm = () => {
   display: flex;
   align-items: center;
   gap: 10px;
+  flex-grow: 1;
+  overflow: hidden;
+  white-space: nowrap;
+}
+
+.preview-title span {
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 
 .preview-title .edit-icon {