chore(client/ts): port search_options

This commit is contained in:
Elian Doran 2025-02-28 17:58:51 +02:00
parent 2c714afa21
commit 423037b9d6
No known key found for this signature in database
4 changed files with 26 additions and 22 deletions

View File

@ -6,13 +6,13 @@ const TPL = `
<tr> <tr>
<td colspan="2"> <td colspan="2">
<div style="display: flex; align-items: center;"> <div style="display: flex; align-items: center;">
<div style="margin-right: 10px">${t("ancestor.label")}:</div> <div style="margin-right: 10px">${t("ancestor.label")}:</div>
<div class="input-group" style="flex-shrink: 2"> <div class="input-group" style="flex-shrink: 2">
<input class="ancestor form-control" placeholder="${t("ancestor.placeholder")}"> <input class="ancestor form-control" placeholder="${t("ancestor.placeholder")}">
</div> </div>
<div style="margin-left: 10px; margin-right: 10px">${t("ancestor.depth_label")}:</div> <div style="margin-left: 10px; margin-right: 10px">${t("ancestor.depth_label")}:</div>
<select name="depth" class="form-select d-inline ancestor-depth" style="flex-shrink: 3"> <select name="depth" class="form-select d-inline ancestor-depth" style="flex-shrink: 3">
<option value="">${t("ancestor.depth_doesnt_matter")}</option> <option value="">${t("ancestor.depth_doesnt_matter")}</option>
<option value="eq1">${t("ancestor.depth_eq", { count: 1 })} (${t("ancestor.direct_children")})</option> <option value="eq1">${t("ancestor.depth_eq", { count: 1 })} (${t("ancestor.direct_children")})</option>
@ -58,7 +58,7 @@ export default class Ancestor extends AbstractSearchOption {
return "relation"; return "relation";
} }
static async create(noteId) { static async create(noteId: string) {
await AbstractSearchOption.setAttribute(noteId, "relation", "ancestor", "root"); await AbstractSearchOption.setAttribute(noteId, "relation", "ancestor", "root");
} }
@ -77,7 +77,7 @@ export default class Ancestor extends AbstractSearchOption {
}); });
$ancestorDepth.on("change", async () => { $ancestorDepth.on("change", async () => {
const ancestorDepth = $ancestorDepth.val(); const ancestorDepth = String($ancestorDepth.val());
if (ancestorDepth) { if (ancestorDepth) {
await this.setAttribute("label", "ancestorDepth", ancestorDepth); await this.setAttribute("label", "ancestorDepth", ancestorDepth);
@ -88,7 +88,7 @@ export default class Ancestor extends AbstractSearchOption {
const ancestorNoteId = this.note.getRelationValue("ancestor"); const ancestorNoteId = this.note.getRelationValue("ancestor");
if (ancestorNoteId !== "root") { if (ancestorNoteId && ancestorNoteId !== "root") {
$ancestor.setNote(ancestorNoteId); $ancestor.setNote(ancestorNoteId);
} }

View File

@ -15,14 +15,17 @@ const TPL = `
<span class="bx bx-help-circle icon-action" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></span> <span class="bx bx-help-circle icon-action" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></span>
<div class="dropdown-menu dropdown-menu-right p-4"> <div class="dropdown-menu dropdown-menu-right p-4">
${t("limit.take_first_x_results")} ${t("limit.take_first_x_results")}
</div> </div>
</div> </div>
<span class="bx bx-x icon-action search-option-del"></span> <span class="bx bx-x icon-action search-option-del"></span>
</td> </td>
</tr>`; </tr>`;
export default class Limit extends AbstractSearchOption { export default class Limit extends AbstractSearchOption {
private $limit!: JQuery<HTMLElement>;
static get optionName() { static get optionName() {
return "limit"; return "limit";
} }
@ -30,7 +33,7 @@ export default class Limit extends AbstractSearchOption {
return "label"; return "label";
} }
static async create(noteId) { static async create(noteId: string) {
await AbstractSearchOption.setAttribute(noteId, "label", "limit", "10"); await AbstractSearchOption.setAttribute(noteId, "label", "limit", "10");
} }
@ -40,13 +43,13 @@ export default class Limit extends AbstractSearchOption {
this.$limit = $option.find("input[name=limit]"); this.$limit = $option.find("input[name=limit]");
this.$limit.on("change", () => this.update()); this.$limit.on("change", () => this.update());
this.$limit.on("input", () => this.update()); this.$limit.on("input", () => this.update());
this.$limit.val(this.note.getLabelValue("limit")); this.$limit.val(this.note.getLabelValue("limit") ?? "");
return $option; return $option;
} }
async update() { async update() {
const limit = this.$limit.val(); const limit = String(this.$limit.val());
await this.setAttribute("label", "limit", limit); await this.setAttribute("label", "limit", limit);
} }

View File

@ -24,7 +24,7 @@ const TPL = `
<option value="targetRelationCount">${t("order_by.target_relation_count")}</option> <option value="targetRelationCount">${t("order_by.target_relation_count")}</option>
<option value="random">${t("order_by.random")}</option> <option value="random">${t("order_by.random")}</option>
</select> </select>
<select name="orderDirection" class="form-control w-auto d-inline"> <select name="orderDirection" class="form-control w-auto d-inline">
<option value="asc">${t("order_by.asc")}</option> <option value="asc">${t("order_by.asc")}</option>
<option value="desc">${t("order_by.desc")}</option> <option value="desc">${t("order_by.desc")}</option>
@ -36,6 +36,7 @@ const TPL = `
</tr>`; </tr>`;
export default class OrderBy extends AbstractSearchOption { export default class OrderBy extends AbstractSearchOption {
static get optionName() { static get optionName() {
return "orderBy"; return "orderBy";
} }
@ -43,7 +44,7 @@ export default class OrderBy extends AbstractSearchOption {
return "label"; return "label";
} }
static async create(noteId) { static async create(noteId: string) {
await AbstractSearchOption.setAttribute(noteId, "label", "orderBy", "relevancy"); await AbstractSearchOption.setAttribute(noteId, "label", "orderBy", "relevancy");
await AbstractSearchOption.setAttribute(noteId, "label", "orderDirection", "asc"); await AbstractSearchOption.setAttribute(noteId, "label", "orderDirection", "asc");
} }
@ -53,15 +54,15 @@ export default class OrderBy extends AbstractSearchOption {
const $orderBy = $option.find("select[name=orderBy]"); const $orderBy = $option.find("select[name=orderBy]");
$orderBy.on("change", async () => { $orderBy.on("change", async () => {
const orderBy = $orderBy.val(); const orderBy = String($orderBy.val());
await this.setAttribute("label", "orderBy", orderBy); await this.setAttribute("label", "orderBy", orderBy);
}); });
$orderBy.val(this.note.getLabelValue("orderBy")); $orderBy.val(this.note.getLabelValue("orderBy") ?? "");
const $orderDirection = $option.find("select[name=orderDirection]"); const $orderDirection = $option.find("select[name=orderDirection]");
$orderDirection.on("change", async () => { $orderDirection.on("change", async () => {
const orderDirection = $orderDirection.val(); const orderDirection = String($orderDirection.val());
await this.setAttribute("label", "orderDirection", orderDirection); await this.setAttribute("label", "orderDirection", orderDirection);
}); });

View File

@ -17,17 +17,17 @@ const TPL = `
<span class="bx bx-help-circle icon-action" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></span> <span class="bx bx-help-circle icon-action" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></span>
<div class="dropdown-menu dropdown-menu-right p-4"> <div class="dropdown-menu dropdown-menu-right p-4">
<p>${t("search_script.description1")}</p> <p>${t("search_script.description1")}</p>
<p>${t("search_script.description2")}</p> <p>${t("search_script.description2")}</p>
<p>${t("search_script.example_title")}</p> <p>${t("search_script.example_title")}</p>
<pre>${t("search_script.example_code")}</pre> <pre>${t("search_script.example_code")}</pre>
${t("search_script.note")} ${t("search_script.note")}
</div> </div>
</div> </div>
<span class="bx bx-x icon-action search-option-del"></span> <span class="bx bx-x icon-action search-option-del"></span>
</td> </td>
</tr>`; </tr>`;
@ -40,7 +40,7 @@ export default class SearchScript extends AbstractSearchOption {
return "relation"; return "relation";
} }
static async create(noteId) { static async create(noteId: string) {
await AbstractSearchOption.setAttribute(noteId, "relation", "searchScript", "root"); await AbstractSearchOption.setAttribute(noteId, "relation", "searchScript", "root");
} }
@ -59,7 +59,7 @@ export default class SearchScript extends AbstractSearchOption {
const searchScriptNoteId = this.note.getRelationValue("searchScript"); const searchScriptNoteId = this.note.getRelationValue("searchScript");
if (searchScriptNoteId !== "root") { if (searchScriptNoteId && searchScriptNoteId !== "root") {
$searchScript.setNote(searchScriptNoteId); $searchScript.setNote(searchScriptNoteId);
} }