mirror of
https://github.com/zadam/trilium.git
synced 2025-10-28 08:46:43 +01:00
feat(views/table): relocate new row/column buttons
This commit is contained in:
@@ -1934,5 +1934,9 @@
|
|||||||
"title": "Features",
|
"title": "Features",
|
||||||
"emoji_completion_enabled": "Enable Emoji auto-completion",
|
"emoji_completion_enabled": "Enable Emoji auto-completion",
|
||||||
"note_completion_enabled": "Enable note auto-completion"
|
"note_completion_enabled": "Enable note auto-completion"
|
||||||
|
},
|
||||||
|
"table_view": {
|
||||||
|
"new-row": "New row",
|
||||||
|
"new-column": "New column"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
13
apps/client/src/widgets/view_widgets/table_view/footer.ts
Normal file
13
apps/client/src/widgets/view_widgets/table_view/footer.ts
Normal file
@@ -0,0 +1,13 @@
|
|||||||
|
import { t } from "../../../services/i18n.js";
|
||||||
|
|
||||||
|
export default function buildFooter() {
|
||||||
|
return /*html*/`\
|
||||||
|
<button class="btn btn-sm" style="padding: 0px 10px 0px 10px;" data-trigger-command="addNewRow">
|
||||||
|
<span class="bx bx-plus"></span> ${t("table_view.new-row")}
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<button class="btn btn-sm" style="padding: 0px 10px 0px 10px;" data-trigger-command="addNoteListItem">
|
||||||
|
<span class="bx bx-columns"></span> ${t("table_view.new-column")}
|
||||||
|
</button>
|
||||||
|
`.trimStart();
|
||||||
|
}
|
||||||
@@ -12,6 +12,7 @@ import {Tabulator, SortModule, FormatModule, InteractionModule, EditModule, Resi
|
|||||||
import "tabulator-tables/dist/css/tabulator_bootstrap5.min.css";
|
import "tabulator-tables/dist/css/tabulator_bootstrap5.min.css";
|
||||||
import { applyHeaderMenu } from "./header-menu.js";
|
import { applyHeaderMenu } from "./header-menu.js";
|
||||||
import { canReorderRows, configureReorderingRows } from "./dragging.js";
|
import { canReorderRows, configureReorderingRows } from "./dragging.js";
|
||||||
|
import buildFooter from "./footer.js";
|
||||||
|
|
||||||
const TPL = /*html*/`
|
const TPL = /*html*/`
|
||||||
<div class="table-view">
|
<div class="table-view">
|
||||||
@@ -43,12 +44,16 @@ const TPL = /*html*/`
|
|||||||
background: transparent;
|
background: transparent;
|
||||||
outline: none !important;
|
outline: none !important;
|
||||||
}
|
}
|
||||||
</style>
|
|
||||||
|
|
||||||
<div class="header">
|
.tabulator .tabulator-footer {
|
||||||
<button data-trigger-command="addNoteListItem">Add new column</button>
|
background-color: unset;
|
||||||
<button data-trigger-command="addNewRow">Add new row</button>
|
}
|
||||||
</div>
|
|
||||||
|
.tabulator .tabulator-footer .tabulator-footer-contents {
|
||||||
|
justify-content: left;
|
||||||
|
gap: 0.5em;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
<div class="table-view-container"></div>
|
<div class="table-view-container"></div>
|
||||||
</div>
|
</div>
|
||||||
@@ -117,6 +122,7 @@ export default class TableView extends ViewMode<StateInfo> {
|
|||||||
persistence: true,
|
persistence: true,
|
||||||
movableColumns: true,
|
movableColumns: true,
|
||||||
movableRows,
|
movableRows,
|
||||||
|
footerElement: buildFooter(),
|
||||||
persistenceWriterFunc: (_id, type: string, data: object) => {
|
persistenceWriterFunc: (_id, type: string, data: object) => {
|
||||||
this.persistentData[type] = data;
|
this.persistentData[type] = data;
|
||||||
this.spacedUpdate.scheduleUpdate();
|
this.spacedUpdate.scheduleUpdate();
|
||||||
|
|||||||
Reference in New Issue
Block a user