feat:解决添加上下文搜索选择文件不匹配的问题
This commit is contained in:
@ -271,6 +271,7 @@ export function getContextButtonStyles(): string {
|
|||||||
width: 14px;
|
width: 14px;
|
||||||
height: 14px;
|
height: 14px;
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.context-menu-list-item label {
|
.context-menu-list-item label {
|
||||||
@ -335,6 +336,7 @@ export function getContextButtonScript(): string {
|
|||||||
return `
|
return `
|
||||||
// 上下文菜单状态
|
// 上下文菜单状态
|
||||||
let currentListData = [];
|
let currentListData = [];
|
||||||
|
let filteredListData = [];
|
||||||
let currentListType = '';
|
let currentListType = '';
|
||||||
let selectedItems = new Set();
|
let selectedItems = new Set();
|
||||||
|
|
||||||
@ -392,6 +394,15 @@ export function getContextButtonScript(): string {
|
|||||||
|
|
||||||
selectedItems.clear();
|
selectedItems.clear();
|
||||||
currentListData = [];
|
currentListData = [];
|
||||||
|
filteredListData = [];
|
||||||
|
clearContextSearchInput();
|
||||||
|
}
|
||||||
|
|
||||||
|
function clearContextSearchInput() {
|
||||||
|
const searchInput = document.getElementById('contextMenuSearch');
|
||||||
|
if (searchInput) {
|
||||||
|
searchInput.value = '';
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 切换到列表视图
|
// 切换到列表视图
|
||||||
@ -406,10 +417,12 @@ export function getContextButtonScript(): string {
|
|||||||
titleEl.textContent = title;
|
titleEl.textContent = title;
|
||||||
|
|
||||||
currentListType = type;
|
currentListType = type;
|
||||||
currentListData = data;
|
currentListData = data || [];
|
||||||
|
filteredListData = currentListData;
|
||||||
selectedItems.clear();
|
selectedItems.clear();
|
||||||
|
|
||||||
renderList(data);
|
clearContextSearchInput();
|
||||||
|
renderList(filteredListData);
|
||||||
updateSelectedCount();
|
updateSelectedCount();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -419,33 +432,37 @@ export function getContextButtonScript(): string {
|
|||||||
const body = document.getElementById('contextMenuListBody');
|
const body = document.getElementById('contextMenuListBody');
|
||||||
if (!body) return;
|
if (!body) return;
|
||||||
|
|
||||||
body.innerHTML = data.map((item, index) => \`
|
filteredListData = data || [];
|
||||||
<div class="context-menu-list-item" onclick="toggleItemSelection(\${index})">
|
|
||||||
<input type="checkbox" id="item-\${index}" />
|
body.innerHTML = filteredListData.map((item, index) => \`
|
||||||
<label for="item-\${index}">\${item.relativePath}</label>
|
<div class="context-menu-list-item \${selectedItems.has(item.path) ? 'selected' : ''}" onclick="toggleItemSelection(\${index})">
|
||||||
|
<input type="checkbox" id="item-\${index}" \${selectedItems.has(item.path) ? 'checked' : ''} />
|
||||||
|
<label>\${item.relativePath || item.path}</label>
|
||||||
</div>
|
</div>
|
||||||
\`).join('');
|
\`).join('');
|
||||||
}
|
}
|
||||||
|
|
||||||
// 切换项选择
|
// 切换项选择
|
||||||
function toggleItemSelection(index) {
|
function toggleItemSelection(index) {
|
||||||
|
const selectedItem = filteredListData[index];
|
||||||
|
if (!selectedItem) return;
|
||||||
|
|
||||||
|
const selectedPath = selectedItem.path;
|
||||||
const checkbox = document.getElementById('item-' + index);
|
const checkbox = document.getElementById('item-' + index);
|
||||||
const item = document.querySelectorAll('.context-menu-list-item')[index];
|
const item = document.querySelectorAll('.context-menu-list-item')[index];
|
||||||
|
|
||||||
if (checkbox && item) {
|
if (selectedItems.has(selectedPath)) {
|
||||||
checkbox.checked = !checkbox.checked;
|
selectedItems.delete(selectedPath);
|
||||||
|
if (checkbox) checkbox.checked = false;
|
||||||
if (checkbox.checked) {
|
if (item) item.classList.remove('selected');
|
||||||
selectedItems.add(index);
|
|
||||||
item.classList.add('selected');
|
|
||||||
} else {
|
} else {
|
||||||
selectedItems.delete(index);
|
selectedItems.add(selectedPath);
|
||||||
item.classList.remove('selected');
|
if (checkbox) checkbox.checked = true;
|
||||||
|
if (item) item.classList.add('selected');
|
||||||
}
|
}
|
||||||
|
|
||||||
updateSelectedCount();
|
updateSelectedCount();
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
// 更新选中数量
|
// 更新选中数量
|
||||||
function updateSelectedCount() {
|
function updateSelectedCount() {
|
||||||
@ -457,15 +474,25 @@ export function getContextButtonScript(): string {
|
|||||||
|
|
||||||
// 确认选择
|
// 确认选择
|
||||||
function confirmSelection() {
|
function confirmSelection() {
|
||||||
const selected = Array.from(selectedItems).map(index => currentListData[index]);
|
try {
|
||||||
|
const selected = currentListData.filter(item => selectedItems.has(item.path));
|
||||||
|
|
||||||
if (selected.length > 0) {
|
if (selected.length > 0) {
|
||||||
selected.forEach(item => {
|
selected.forEach(item => {
|
||||||
addContextItem(currentListType, item.path);
|
addContextItem(currentListType, item.path, item.relativePath || item.path);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
} finally {
|
||||||
toggleContextMenu();
|
const menu = document.getElementById('contextMenu');
|
||||||
|
const button = document.querySelector('.add-context-button');
|
||||||
|
if (menu) {
|
||||||
|
menu.classList.remove('show');
|
||||||
|
}
|
||||||
|
if (button) {
|
||||||
|
button.classList.remove('active');
|
||||||
|
}
|
||||||
|
backToMainMenu();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 添加图片
|
// 添加图片
|
||||||
@ -484,9 +511,9 @@ export function getContextButtonScript(): string {
|
|||||||
const searchInput = document.getElementById('contextMenuSearch');
|
const searchInput = document.getElementById('contextMenuSearch');
|
||||||
if (searchInput) {
|
if (searchInput) {
|
||||||
searchInput.addEventListener('input', function(e) {
|
searchInput.addEventListener('input', function(e) {
|
||||||
const keyword = e.target.value.toLowerCase();
|
const keyword = (e.target.value || '').toLowerCase().trim();
|
||||||
const filtered = currentListData.filter(item =>
|
const filtered = currentListData.filter(item =>
|
||||||
item.relativePath.toLowerCase().includes(keyword)
|
(item.relativePath || item.path || '').toLowerCase().includes(keyword)
|
||||||
);
|
);
|
||||||
renderList(filtered);
|
renderList(filtered);
|
||||||
});
|
});
|
||||||
|
|||||||
@ -137,9 +137,12 @@ export function getContextDisplayScript(): string {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 添加上下文项
|
// 添加上下文项
|
||||||
function addContextItem(type, path) {
|
function addContextItem(type, path, displayPath) {
|
||||||
|
const exists = contextItems.some(item => item.type === type && item.path === path);
|
||||||
|
if (exists) return;
|
||||||
|
|
||||||
const id = Date.now() + Math.random();
|
const id = Date.now() + Math.random();
|
||||||
contextItems.push({ id, type, path });
|
contextItems.push({ id, type, path, displayPath: displayPath || '' });
|
||||||
renderContextItems();
|
renderContextItems();
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -174,7 +177,7 @@ export function getContextDisplayScript(): string {
|
|||||||
return \`
|
return \`
|
||||||
<div class="context-item" title="\${item.path}">
|
<div class="context-item" title="\${item.path}">
|
||||||
\${icon}
|
\${icon}
|
||||||
<span class="context-item-name">\${getFileName(item.path)}</span>
|
<span class="context-item-name">\${item.displayPath || getFileName(item.path)}</span>
|
||||||
<span class="context-item-remove" onclick="removeContextItem(\${item.id})">
|
<span class="context-item-remove" onclick="removeContextItem(\${item.id})">
|
||||||
\${getRemoveIcon()}
|
\${getRemoveIcon()}
|
||||||
</span>
|
</span>
|
||||||
|
|||||||
Reference in New Issue
Block a user