Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-03 20:06:08 +01:00
Code Issues Packages Projects Releases Activity

feat(views/table): relocate new row/column buttons

Browse Source
This commit is contained in:
Elian Doran
2025-07-04 19:23:26 +03:00
parent c69ef611a0
commit 01b2257063
3 changed files with 28 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
apps/client/src/translations/en/translation.json
View File

@@ -1934,5 +1934,9 @@
"title": "Features",
"emoji_completion_enabled": "Enable Emoji 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
View 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();
}

16
apps/client/src/widgets/view_widgets/table_view/index.ts
View File

@@ -12,6 +12,7 @@ import {Tabulator, SortModule, FormatModule, InteractionModule, EditModule, Resi
import "tabulator-tables/dist/css/tabulator_bootstrap5.min.css";
import { applyHeaderMenu } from "./header-menu.js";
import { canReorderRows, configureReorderingRows } from "./dragging.js";
import buildFooter from "./footer.js";
const TPL = /*html*/`
<div class="table-view">
@@ -43,12 +44,16 @@ const TPL = /*html*/`
background: transparent;
outline: none !important;
}
</style>
<div class="header">
<button data-trigger-command="addNoteListItem">Add new column</button>
<button data-trigger-command="addNewRow">Add new row</button>
</div>
.tabulator .tabulator-footer {
background-color: unset;
}
.tabulator .tabulator-footer .tabulator-footer-contents {
justify-content: left;
gap: 0.5em;
}
</style>
<div class="table-view-container"></div>
</div>
@@ -117,6 +122,7 @@ export default class TableView extends ViewMode<StateInfo> {
persistence: true,
movableColumns: true,
movableRows,
footerElement: buildFooter(),
persistenceWriterFunc: (_id, type: string, data: object) => {
this.persistentData[type] = data;
this.spacedUpdate.scheduleUpdate();