mirror of https://github.com/TriliumNext/Notes
refactoring of sql console into separate widgets
zadam
parent
1d64129572
commit
02d9752abf
@ -1,33 +0,0 @@
|
|||||||
import TabAwareWidget from "./tab_aware_widget.js";
|
|
||||||
|
|
||||||
const TPL = `
|
|
||||||
<div style="display: inline-flex;">
|
|
||||||
<button class="btn btn-sm icon-button bx bx-play-circle render-button"
|
|
||||||
data-trigger-command="renderActiveNote"
|
|
||||||
title="Render"></button>
|
|
||||||
|
|
||||||
<button class="btn btn-sm icon-button bx bx-play-circle execute-script-button"
|
|
||||||
data-trigger-command="runActiveNote"
|
|
||||||
title="Execute"></button>
|
|
||||||
</div>`;
|
|
||||||
|
|
||||||
export default class RunScriptButtonsWidget extends TabAwareWidget {
|
|
||||||
doRender() {
|
|
||||||
this.$widget = $(TPL);
|
|
||||||
this.contentSized();
|
|
||||||
|
|
||||||
this.$renderButton = this.$widget.find('.render-button');
|
|
||||||
this.$executeScriptButton = this.$widget.find('.execute-script-button');
|
|
||||||
}
|
|
||||||
|
|
||||||
refreshWithNote(note) {
|
|
||||||
this.$renderButton.toggle(note.type === 'render');
|
|
||||||
this.$executeScriptButton.toggle(note.type === 'code' && note.mime.startsWith('application/javascript'));
|
|
||||||
}
|
|
||||||
|
|
||||||
async entitiesReloadedEvent({loadResults}) {
|
|
||||||
if (loadResults.isNoteReloaded(this.noteId)) {
|
|
||||||
this.refresh();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -0,0 +1,64 @@
|
|||||||
|
import TabAwareWidget from "./tab_aware_widget.js";
|
||||||
|
import treeService from "../services/tree.js";
|
||||||
|
import linkService from "../services/link.js";
|
||||||
|
import hoistedNoteService from "../services/hoisted_note.js";
|
||||||
|
import server from "../services/server.js";
|
||||||
|
import toastService from "../services/toast.js";
|
||||||
|
|
||||||
|
const TPL = `
|
||||||
|
<div class="sql-result-widget">
|
||||||
|
<style>
|
||||||
|
.sql-result-widget {
|
||||||
|
padding: 15px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<div class="sql-console-result-container"></div>
|
||||||
|
</div>`;
|
||||||
|
|
||||||
|
export default class SqlResultWidget extends TabAwareWidget {
|
||||||
|
isEnabled() {
|
||||||
|
return this.note
|
||||||
|
&& this.note.mime === 'text/x-sqlite;schema=trilium'
|
||||||
|
&& super.isEnabled();
|
||||||
|
}
|
||||||
|
|
||||||
|
doRender() {
|
||||||
|
this.$widget = $(TPL);
|
||||||
|
this.overflowing();
|
||||||
|
|
||||||
|
this.$sqlConsoleResultContainer = this.$widget.find('.sql-console-result-container');
|
||||||
|
}
|
||||||
|
|
||||||
|
async sqlQueryResultsEvent({results}) {
|
||||||
|
this.$sqlConsoleResultContainer.empty();
|
||||||
|
|
||||||
|
for (const rows of results) {
|
||||||
|
if (rows.length === 0) {
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
|
||||||
|
const $table = $('<table class="table table-striped">');
|
||||||
|
this.$sqlConsoleResultContainer.append($table);
|
||||||
|
|
||||||
|
const result = rows[0];
|
||||||
|
const $row = $("<tr>");
|
||||||
|
|
||||||
|
for (const key in result) {
|
||||||
|
$row.append($("<th>").html(key));
|
||||||
|
}
|
||||||
|
|
||||||
|
$table.append($row);
|
||||||
|
|
||||||
|
for (const result of rows) {
|
||||||
|
const $row = $("<tr>");
|
||||||
|
|
||||||
|
for (const key in result) {
|
||||||
|
$row.append($("<td>").html(result[key]));
|
||||||
|
}
|
||||||
|
|
||||||
|
$table.append($row);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,83 @@
|
|||||||
|
import TabAwareWidget from "./tab_aware_widget.js";
|
||||||
|
import treeService from "../services/tree.js";
|
||||||
|
import linkService from "../services/link.js";
|
||||||
|
import hoistedNoteService from "../services/hoisted_note.js";
|
||||||
|
import server from "../services/server.js";
|
||||||
|
import toastService from "../services/toast.js";
|
||||||
|
|
||||||
|
const TPL = `
|
||||||
|
<div class="sql-table-schemas-widget">
|
||||||
|
<style>
|
||||||
|
.sql-table-schemas button {
|
||||||
|
padding: 0.25rem 0.4rem;
|
||||||
|
font-size: 0.875rem;
|
||||||
|
line-height: 0.5;
|
||||||
|
border-radius: 0.2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sql-console-result-container {
|
||||||
|
width: 100%;
|
||||||
|
font-size: smaller;
|
||||||
|
margin-top: 10px;
|
||||||
|
flex-grow: 1;
|
||||||
|
overflow: auto;
|
||||||
|
min-height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table-schema td {
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
Tables:
|
||||||
|
<span class="sql-table-schemas"></span>
|
||||||
|
</div>`;
|
||||||
|
|
||||||
|
export default class SqlTableSchemasWidget extends TabAwareWidget {
|
||||||
|
isEnabled() {
|
||||||
|
return this.note
|
||||||
|
&& this.note.mime === 'text/x-sqlite;schema=trilium'
|
||||||
|
&& super.isEnabled();
|
||||||
|
}
|
||||||
|
|
||||||
|
doRender() {
|
||||||
|
this.$widget = $(TPL);
|
||||||
|
this.overflowing();
|
||||||
|
|
||||||
|
this.$sqlConsoleTableSchemas = this.$widget.find('.sql-table-schemas');
|
||||||
|
}
|
||||||
|
|
||||||
|
async refreshWithNote(note) {
|
||||||
|
if (this.tableSchemasShown) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.tableSchemasShown = true;
|
||||||
|
|
||||||
|
const tableSchema = await server.get('sql/schema');
|
||||||
|
|
||||||
|
for (const table of tableSchema) {
|
||||||
|
const $tableLink = $('<button class="btn">').text(table.name);
|
||||||
|
|
||||||
|
const $table = $('<table class="table-schema">');
|
||||||
|
|
||||||
|
for (const column of table.columns) {
|
||||||
|
$table.append(
|
||||||
|
$("<tr>")
|
||||||
|
.append($("<td>").text(column.name))
|
||||||
|
.append($("<td>").text(column.type))
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
this.$sqlConsoleTableSchemas.append($tableLink).append(" ");
|
||||||
|
|
||||||
|
$tableLink.tooltip({
|
||||||
|
html: true,
|
||||||
|
placement: 'bottom',
|
||||||
|
boundary: 'window',
|
||||||
|
title: $table[0].outerHTML,
|
||||||
|
sanitize: false
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue