Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-12-20 08:30:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

🐛 fix https://github.com/siyuan-note/siyuan/issues/11534

Browse source
This commit is contained in:
Vanessa 2024-05-27 10:25:43 +08:00
parent c4d72c16c3
commit cf4c5396ab
1 changed files with 24 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

40
app/src/config/util/snippets.ts
View file

@ -65,7 +65,7 @@ export const openSnippets = () => {
<div class="fn__flex-1"></div> <div class="fn__flex-1"></div>
<div class="b3-form__icon"> <div class="b3-form__icon">
<svg class="b3-form__icon-icon"><use xlink:href="#iconSearch"></use></svg> <svg class="b3-form__icon-icon"><use xlink:href="#iconSearch"></use></svg>
<input data-type="css" data-action="search" type="text" placeholder="${window.siyuan.languages.enterKey} ${window.siyuan.languages.search}" class="b3-text-field b3-form__icon-input"> <input data-type="css" data-action="search" type="text" placeholder="${window.siyuan.languages.search}" class="b3-text-field b3-form__icon-input">
</div> </div>
<div class="fn__space"></div> <div class="fn__space"></div>
<span aria-label="${window.siyuan.languages.addAttr} CSS" id="addCodeSnippetCSS" class="b3-tooltips b3-tooltips__sw block__icon block__icon--show"> <span aria-label="${window.siyuan.languages.addAttr} CSS" id="addCodeSnippetCSS" class="b3-tooltips b3-tooltips__sw block__icon block__icon--show">
@ -81,7 +81,7 @@ export const openSnippets = () => {
<div class="fn__flex-1"></div> <div class="fn__flex-1"></div>
<div class="b3-form__icon"> <div class="b3-form__icon">
<svg class="b3-form__icon-icon"><use xlink:href="#iconSearch"></use></svg> <svg class="b3-form__icon-icon"><use xlink:href="#iconSearch"></use></svg>
<input data-type="js" data-action="search" type="text" placeholder="${window.siyuan.languages.enterKey} ${window.siyuan.languages.search}" class="b3-text-field b3-form__icon-input"> <input data-type="js" data-action="search" type="text" placeholder="${window.siyuan.languages.search}" class="b3-text-field b3-form__icon-input">
</div> </div>
<div class="fn__space"></div> <div class="fn__space"></div>
<span aria-label="${window.siyuan.languages.addAttr} JS" id="addCodeSnippetJS" class="b3-tooltips b3-tooltips__sw block__icon block__icon--show"> <span aria-label="${window.siyuan.languages.addAttr} JS" id="addCodeSnippetJS" class="b3-tooltips b3-tooltips__sw block__icon block__icon--show">
@ -162,28 +162,34 @@ export const openSnippets = () => {
} }
}); });
dialog.element.querySelectorAll('[data-action="search"]').forEach((inputItem: HTMLInputElement) => { dialog.element.querySelectorAll('[data-action="search"]').forEach((inputItem: HTMLInputElement) => {
inputItem.addEventListener("keydown", (event: KeyboardEvent) => { inputItem.addEventListener("input", (event: KeyboardEvent) => {
if (event.key === "Enter" && !event.isComposing) { if (event.isComposing) {
fetchPost("/api/snippet/getSnippet", { return
type: "all",
enabled: 2,
keyword: inputItem.value
}, (searchResponse) => {
dialog.element.querySelectorAll(`.fn__flex-1 > div > [data-type="${inputItem.dataset.type}"]`).forEach((snipeetPanel: Element) => {
snipeetPanel.classList.add("fn__none");
});
searchResponse.data.snippets.forEach((snippetItem: ISnippet) => {
if (snippetItem.type === inputItem.dataset.type) {
dialog.element.querySelector(`[data-id="${snippetItem.id}"]`).classList.remove("fn__none");
} }
filterSnippet(dialog, inputItem)
}); });
}); inputItem.addEventListener("compositionend", () => {
} filterSnippet(dialog, inputItem)
}); });
}); });
}); });
}; };
const filterSnippet = (dialog: Dialog, inputItem: HTMLInputElement) => {
dialog.element.querySelectorAll(`.fn__flex-1 > div > [data-type="${inputItem.dataset.type}"]`).forEach((snippetPanel: Element) => {
const snippetName = snippetPanel.querySelector("input").value.toLowerCase();
const snippetContent = snippetPanel.querySelector("textarea").value.toLowerCase();
const searchValue = inputItem.value.toLowerCase();
if (!searchValue ||
(snippetName && (searchValue.includes(snippetName) || snippetName.includes(searchValue))) ||
(snippetContent && (snippetContent.includes(searchValue) || searchValue.includes(snippetContent)))) {
snippetPanel.classList.remove("fn__none");
} else {
snippetPanel.classList.add("fn__none");
}
});
}
const genSnippet = (options: ISnippet) => { const genSnippet = (options: ISnippet) => {
return `<div data-id="${options.id || ""}" data-type="${options.type}"> return `<div data-id="${options.id || ""}" data-type="${options.type}">
<div class="fn__hr--b"></div> <div class="fn__hr--b"></div>