Compare commits

..

2 Commits

Author SHA1 Message Date
cfq 3a7665e3de docs: 添加企业微信截图至文档目录
添加三张企业微信相关截图,用于文档说明或演示。
2026-01-27 17:16:13 +08:00
cfq bea979f9b4 feat: 增强历史目录选择弹窗的交互体验
- 添加删除历史目录功能,支持从历史记录中移除特定路径
- 优化历史目录列表的视觉呈现,添加文件夹图标和悬停效果
- 增加空状态提示,当无历史记录时显示友好信息
- 调整弹窗宽度为600px以提供更好的空间展示长路径
- 使用更紧凑的列表项布局,提升信息密度和可操作性
2026-01-27 17:13:43 +08:00
4 changed files with 78 additions and 6 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 55 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.8 KiB

View File

@ -10,7 +10,7 @@ import { useFileTree } from "./composables/useFileTree";
import { useConfig } from "./composables/useConfig"; import { useConfig } from "./composables/useConfig";
import { useTheme } from "./composables/useTheme"; import { useTheme } from "./composables/useTheme";
import { ConfigProvider } from 'ant-design-vue'; import { ConfigProvider } from 'ant-design-vue';
import { SettingOutlined } from '@ant-design/icons-vue'; import { SettingOutlined, DeleteOutlined, FolderOpenOutlined } from '@ant-design/icons-vue';
const { setRootPath } = useFileTree(); const { setRootPath } = useFileTree();
const { loadConfig } = useConfig(); const { loadConfig } = useConfig();
@ -222,6 +222,14 @@ const handleSelectDirectory = async () => {
} }
}; };
const removeHistoryDir = async (path) => {
const index = historyDirs.value.indexOf(path);
if (index > -1) {
historyDirs.value.splice(index, 1);
await saveGlobalConfig();
}
};
const handleHistorySelect = (path) => { const handleHistorySelect = (path) => {
openDirectory(path); openDirectory(path);
showHistory.value = false; showHistory.value = false;
@ -313,12 +321,25 @@ const { state } = useFileTree(); // 需要获取 rootPath 用于保存
</a-modal> </a-modal>
<!-- 历史记录弹窗 --> <!-- 历史记录弹窗 -->
<a-modal v-model:open="showHistory" title="选择历史目录" :footer="null"> <a-modal v-model:open="showHistory" title="选择历史目录" :footer="null" width="600px">
<a-list :data-source="historyDirs"> <div v-if="historyDirs.length === 0" class="empty-history">
暂无历史记录
</div>
<a-list v-else :data-source="historyDirs" size="small" :split="false">
<template #renderItem="{ item }"> <template #renderItem="{ item }">
<a-list-item> <a-list-item class="history-item">
<a-button type="link" @click="handleHistorySelect(item)"> <div class="history-content" @click="handleHistorySelect(item)">
{{ item }} <FolderOpenOutlined class="history-icon" />
<span class="history-text" :title="item">{{ item }}</span>
</div>
<a-button
type="text"
danger
size="small"
class="delete-btn"
@click.stop="removeHistoryDir(item)"
>
<DeleteOutlined />
</a-button> </a-button>
</a-list-item> </a-list-item>
</template> </template>
@ -419,4 +440,55 @@ const { state } = useFileTree(); // 需要获取 rootPath 用于保存
border-color: var(--text-color); border-color: var(--text-color);
box-shadow: 0 0 0 2px var(--primary-color-bg); box-shadow: 0 0 0 2px var(--primary-color-bg);
} }
.history-item {
padding: 4px 8px !important;
border-radius: 6px;
cursor: pointer;
transition: background-color 0.2s;
display: flex;
align-items: center;
justify-content: space-between;
}
.history-item:hover {
background-color: rgba(0, 0, 0, 0.04);
}
.history-content {
flex: 1;
display: flex;
align-items: center;
overflow: hidden;
margin-right: 8px;
}
.history-icon {
margin-right: 8px;
color: var(--primary-color, #1890ff);
font-size: 16px;
flex-shrink: 0;
}
.history-text {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: var(--text-color);
}
.delete-btn {
opacity: 0;
transition: opacity 0.2s;
}
.history-item:hover .delete-btn {
opacity: 1;
}
.empty-history {
text-align: center;
padding: 40px 0;
color: #999;
}
</style> </style>