github/siyuan
4
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-05-12 23:21:23 +08:00
Code Issues Packages Projects Releases Wiki Activity

🎨 https://github.com/siyuan-note/siyuan/issues/4901

Browse Source
This commit is contained in:
Vanessa 2022-08-30 17:58:28 +08:00
parent 01bde0494d
commit a165cac78e
3 changed files with 36 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/src/asset/renderAssets.ts
View File

@ -13,6 +13,6 @@ export const renderAssetsPreview = (pathString: string) => {
} else if (Constants.SIYUAN_ASSETS_VIDEO.includes(type)) { } else if (Constants.SIYUAN_ASSETS_VIDEO.includes(type)) {
return `<video style="max-width: 100%" controls="controls" src="${pathString}"></video>`; return `<video style="max-width: 100%" controls="controls" src="${pathString}"></video>`;
} else { } else {
return ""; return pathString;
} }
}; };

6
app/src/assets/scss/_function.scss
View File

@ -158,12 +158,6 @@
color: var(--b3-theme-on-background); color: var(--b3-theme-on-background);
} }
&__asset {
background-color: var(--b3-theme-background);
padding: 16px;
border-radius: 0 0 4px 0;
}
&__repo { &__repo {
background-color: var(--b3-theme-background); background-color: var(--b3-theme-background);
display: flex; display: flex;

90
app/src/util/history.ts
View File

@ -17,27 +17,34 @@ const renderDoc = (element: HTMLElement, currentPage: number) => {
previousElement.setAttribute("disabled", "disabled"); previousElement.setAttribute("disabled", "disabled");
} }
const inputElement = element.querySelector(".b3-text-field") as HTMLInputElement; const inputElement = element.querySelector(".b3-text-field") as HTMLInputElement;
const selectElements = element.querySelectorAll(".b3-select"); const opElement = element.querySelector('.b3-select[data-type="opselect"]') as HTMLSelectElement;
window.localStorage.setItem(Constants.LOCAL_HISTORYNOTEID, (selectElements[1] as HTMLSelectElement).value); const typeElement = element.querySelector('.b3-select[data-type="typeselect"]') as HTMLSelectElement;
const notebookElement = element.querySelector('.b3-select[data-type="notebookselect"]') as HTMLSelectElement;
window.localStorage.setItem(Constants.LOCAL_HISTORYNOTEID, notebookElement.value);
if (typeElement.value === "0") {
opElement.removeAttribute("disabled")
notebookElement.removeAttribute("disabled")
} else {
opElement.setAttribute("disabled", "disabled")
notebookElement.setAttribute("disabled", "disabled")
}
fetchPost("/api/history/searchHistory", { fetchPost("/api/history/searchHistory", {
notebook: (selectElements[1] as HTMLSelectElement).value, notebook: notebookElement.value,
query: inputElement.value, query: inputElement.value,
page: currentPage, page: currentPage,
op: (selectElements[0] as HTMLSelectElement).value, op: opElement.value,
type: 0 type: parseInt(typeElement.value)
}, (response) => { }, (response) => {
if (currentPage < response.data.pageCount) { if (currentPage < response.data.pageCount) {
nextElement.removeAttribute("disabled"); nextElement.removeAttribute("disabled");
} else { } else {
nextElement.setAttribute("disabled", "disabled"); nextElement.setAttribute("disabled", "disabled");
} }
if (response.data.histories.length === 0) { if (response.data.histories.length === 0) {
element.lastElementChild.lastElementChild.innerHTML = ""; element.lastElementChild.lastElementChild.innerHTML = "";
element.lastElementChild.firstElementChild.innerHTML = `<li class="b3-list--empty">${window.siyuan.languages.emptyContent}</li>`; element.lastElementChild.firstElementChild.innerHTML = `<li class="b3-list--empty">${window.siyuan.languages.emptyContent}</li>`;
return; return;
} }
let logsHTML = ""; let logsHTML = "";
response.data.histories.forEach((item: { items: { path: string, title: string }[], hCreated: string }, index: number) => { response.data.histories.forEach((item: { items: { path: string, title: string }[], hCreated: string }, index: number) => {
logsHTML += `<li class="b3-list-item" data-type="toggle" style="padding-left: 0"> logsHTML += `<li class="b3-list-item" data-type="toggle" style="padding-left: 0">
@ -47,7 +54,7 @@ const renderDoc = (element: HTMLElement, currentPage: number) => {
if (item.items.length > 0) { if (item.items.length > 0) {
logsHTML += `<ul class="${index === 0 ? "" : "fn__none"}">`; logsHTML += `<ul class="${index === 0 ? "" : "fn__none"}">`;
item.items.forEach((docItem, docIndex) => { item.items.forEach((docItem, docIndex) => {
logsHTML += `<li title="${escapeHtml(docItem.title)}" data-type="doc" data-path="${docItem.path}" class="b3-list-item b3-list-item--hide-action${(index === 0 && docIndex === 0) ? " b3-list-item--focus" : ""}" style="padding-left: 32px"> logsHTML += `<li title="${escapeHtml(docItem.title)}" data-type="${typeElement.value === "1" ? "assets" : "doc"}" data-path="${docItem.path}" class="b3-list-item b3-list-item--hide-action${(index === 0 && docIndex === 0) ? " b3-list-item--focus" : ""}" style="padding-left: 32px">
<span class="b3-list-item__text">${escapeHtml(docItem.title)}</span> <span class="b3-list-item__text">${escapeHtml(docItem.title)}</span>
<span class="fn__space"></span> <span class="fn__space"></span>
<span class="b3-list-item__action b3-tooltips b3-tooltips__w" data-type="rollback" aria-label="${window.siyuan.languages.rollback}"> <span class="b3-list-item__action b3-tooltips b3-tooltips__w" data-type="rollback" aria-label="${window.siyuan.languages.rollback}">
@ -56,8 +63,10 @@ const renderDoc = (element: HTMLElement, currentPage: number) => {
</li>`; </li>`;
}); });
logsHTML += "</ul>"; logsHTML += "</ul>";
if (index === 0) { if (index === 0) {
if (typeElement.value === "1") {
element.lastElementChild.lastElementChild.innerHTML = renderAssetsPreview(item.items[0].path);
} else {
fetchPost("/api/history/getDocHistoryContent", { fetchPost("/api/history/getDocHistoryContent", {
historyPath: item.items[0].path historyPath: item.items[0].path
}, (contentResponse) => { }, (contentResponse) => {
@ -65,47 +74,12 @@ const renderDoc = (element: HTMLElement, currentPage: number) => {
}); });
} }
} }
}
}); });
element.lastElementChild.firstElementChild.innerHTML = logsHTML; element.lastElementChild.firstElementChild.innerHTML = logsHTML;
}); });
}; };
const renderAssets = (element: HTMLElement) => {
element.setAttribute("data-init", "true");
fetchPost("/api/history/getAssetsHistory", {}, (response) => {
if (response.data.histories.length === 0) {
element.lastElementChild.innerHTML = "";
element.firstElementChild.innerHTML = `<li class="b3-list--empty">${window.siyuan.languages.emptyContent}</li>`;
return;
}
let logsHTML = "";
response.data.histories.forEach((item: { items: { path: string, title: string }[], hCreated: string }, index: number) => {
logsHTML += `<li class="b3-list-item" data-type="toggle" style="padding-left: 0">
<span style="padding-left: 8px" class="b3-list-item__toggle"><svg class="b3-list-item__arrow${index === 0 ? " b3-list-item__arrow--open" : ""}${item.items.length > 0 ? "" : " fn__hidden"}"><use xlink:href="#iconRight"></use></svg></span>
<span class="b3-list-item__text">${item.hCreated}</span>
</li>`;
if (item.items.length > 0) {
logsHTML += `<ul class="${index === 0 ? "" : "fn__none"}">`;
item.items.forEach((docItem, docIndex) => {
logsHTML += `<li title="${escapeHtml(docItem.title)}" data-type="assets" data-path="${docItem.path}" class="b3-list-item b3-list-item--hide-action${(index === 0 && docIndex === 0) ? " b3-list-item--focus" : ""}" style="padding-left: 32px">
<span class="b3-list-item__text">${escapeHtml(docItem.title)}</span>
<span class="fn__space"></span>
<span class="b3-list-item__action b3-tooltips b3-tooltips__w" data-type="rollback" aria-label="${window.siyuan.languages.rollback}">
<svg><use xlink:href="#iconUndo"></use></svg>
</span>
</li>`;
});
logsHTML += "</ul>";
if (index === 0) {
element.lastElementChild.innerHTML = renderAssetsPreview(item.items[0].path);
}
}
});
element.firstElementChild.innerHTML = logsHTML;
});
};
const renderRepoItem = (response: IWebSocketData, element: Element, type: string) => { const renderRepoItem = (response: IWebSocketData, element: Element, type: string) => {
if (response.data.snapshots.length === 0) { if (response.data.snapshots.length === 0) {
element.lastElementChild.innerHTML = `<li class="b3-list--empty">${window.siyuan.languages.emptyContent}</li>`; element.lastElementChild.innerHTML = `<li class="b3-list--empty">${window.siyuan.languages.emptyContent}</li>`;
@ -248,8 +222,7 @@ export const openHistory = () => {
const dialog = new Dialog({ const dialog = new Dialog({
content: `<div class="fn__flex-column" style="height: 100%;"> content: `<div class="fn__flex-column" style="height: 100%;">
<div class="layout-tab-bar fn__flex" style="border-radius: 4px 4px 0 0"> <div class="layout-tab-bar fn__flex" style="border-radius: 4px 4px 0 0">
<div data-type="doc" class="item item--focus"><span class="item__text">${window.siyuan.languages.doc}</span></div> <div data-type="doc" class="item item--focus"><span class="item__text">${window.siyuan.languages.dataHistory}</span></div>
<div data-type="assets" class="item"><span class="item__text">${window.siyuan.languages.assets}</span></div>
<div data-type="notebook" class="item"><span class="item__text">${window.siyuan.languages.removedNotebook}</span></div> <div data-type="notebook" class="item"><span class="item__text">${window.siyuan.languages.removedNotebook}</span></div>
<div data-type="repo" class="item"><span class="item__text">${window.siyuan.languages.dataSnapshot}</span></div> <div data-type="repo" class="item"><span class="item__text">${window.siyuan.languages.dataSnapshot}</span></div>
</div> </div>
@ -265,7 +238,12 @@ export const openHistory = () => {
<input class="b3-text-field b3-form__icon-input"> <input class="b3-text-field b3-form__icon-input">
</div> </div>
<span class="fn__space"></span> <span class="fn__space"></span>
<select class="b3-select" style="min-width: auto"> <select data-type="typeselect" class="b3-select" style="min-width: auto">
<option value="0" selected>${window.siyuan.languages.doc}</option>
<option value="1">${window.siyuan.languages.assets}</option>
</select>
<span class="fn__space"></span>
<select data-type="opselect" class="b3-select" style="min-width: auto">
<option value="all" selected>all</option> <option value="all" selected>all</option>
<option value="clean">clean</option> <option value="clean">clean</option>
<option value="update">update</option> <option value="update">update</option>
@ -274,7 +252,7 @@ export const openHistory = () => {
<option value="sync">sync</option> <option value="sync">sync</option>
</select> </select>
<span class="fn__space"></span> <span class="fn__space"></span>
<select class="b3-select" style="min-width: auto"> <select data-type="notebookselect" class="b3-select" style="min-width: auto">
${notebookSelectHTML} ${notebookSelectHTML}
</select> </select>
<span class="fn__space"></span> <span class="fn__space"></span>
@ -284,15 +262,9 @@ export const openHistory = () => {
<ul style="width:200px;overflow: auto;" class="b3-list b3-list--background"> <ul style="width:200px;overflow: auto;" class="b3-list b3-list--background">
<li class="b3-list--empty">${window.siyuan.languages.emptyContent}</li> <li class="b3-list--empty">${window.siyuan.languages.emptyContent}</li>
</ul> </ul>
<textarea class="fn__flex-1 history__text" readonly></textarea> <div class="fn__flex-1 history__text" readonly></div>
</div> </div>
</div> </div>
<div data-type="assets" class="fn__flex fn__none">
<ul style="width:200px;overflow: auto;" class="b3-list b3-list--background">
<li class="b3-list--empty">${window.siyuan.languages.emptyContent}</li>
</ul>
<div class="fn__flex-1 history__asset"></div>
</div>
<ul data-type="notebook" style="background-color: var(--b3-theme-background);border-radius: 0 0 4px 4px" class="fn__none b3-list b3-list--background"> <ul data-type="notebook" style="background-color: var(--b3-theme-background);border-radius: 0 0 4px 4px" class="fn__none b3-list b3-list--background">
<li class="b3-list--empty">${window.siyuan.languages.emptyContent}</li> <li class="b3-list--empty">${window.siyuan.languages.emptyContent}</li>
</ul> </ul>
@ -362,9 +334,7 @@ export const openHistory = () => {
item.classList.add("fn__block"); item.classList.add("fn__block");
target.classList.add("item--focus"); target.classList.add("item--focus");
if (item.getAttribute("data-init") !== "true") { if (item.getAttribute("data-init") !== "true") {
if (type === "assets") { if (type === "notebook") {
renderAssets(item);
} else if (type === "notebook") {
renderRmNotebook(item); renderRmNotebook(item);
} else if (type === "repo") { } else if (type === "repo") {
renderRepo(item, 1); renderRepo(item, 1);
@ -511,7 +481,7 @@ export const openHistory = () => {
renderDoc(firstPanelElement, type === "docprevious" ? currentPage - 1 : currentPage + 1); renderDoc(firstPanelElement, type === "docprevious" ? currentPage - 1 : currentPage + 1);
break; break;
} else if (type === "rebuildIndex") { } else if (type === "rebuildIndex") {
fetchPost("/api/history/reindexHistory", {}, ()=> { fetchPost("/api/history/reindexHistory", {}, () => {
renderDoc(firstPanelElement, 1); renderDoc(firstPanelElement, 1);
}); });
break; break;