From aa27fefef43651208f5f74f1db8bf52c2e960b8e Mon Sep 17 00:00:00 2001 From: garrettmills Date: Thu, 11 Mar 2021 11:48:02 -0600 Subject: [PATCH] Database - in place updates to preserve editing flow --- .../editor/database/database.component.html | 1 + .../editor/database/database.component.ts | 49 ++++++++++++++----- src/app/service/api.service.ts | 2 +- 3 files changed, 38 insertions(+), 14 deletions(-) diff --git a/src/app/components/editor/database/database.component.html b/src/app/components/editor/database/database.component.html index 1efd514..7777674 100644 --- a/src/app/components/editor/database/database.component.html +++ b/src/app/components/editor/database/database.component.html @@ -38,6 +38,7 @@ [style]="fullPage ? 'width: 100%; height: 100%;' : 'width: 100%; height: 500px;'" [ngClass]="isDark() ? 'ag-theme-balham-dark' : 'ag-theme-balham'" [rowData]="rowData" + [getRowNodeId]="getRowNodeId" [columnDefs]="columnDefs" [singleClickEdit]="true" [enterMovesDownAfterEdit]="true" diff --git a/src/app/components/editor/database/database.component.ts b/src/app/components/editor/database/database.component.ts index a71d7e2..9fc380f 100644 --- a/src/app/components/editor/database/database.component.ts +++ b/src/app/components/editor/database/database.component.ts @@ -15,7 +15,7 @@ import {BooleanRendererComponent} from './renderers/boolean-renderer.component'; import {EditorNodeContract} from '../../nodes/EditorNode.contract'; import {EditorService} from '../../../service/editor.service'; import {WysiwygEditorComponent} from './editors/wysiwyg/wysiwyg-editor.component'; -import {debounce, debug} from '../../../utility'; +import {debounce, debug, uuid_v4} from '../../../utility'; import {DateTimeFilterComponent} from './filters/date-time.filter'; import {DatabasePageComponent} from './database-page.component'; import {PageLinkRendererComponent} from './renderers/page-link-renderer.component'; @@ -416,17 +416,40 @@ export class DatabaseComponent extends EditorNodeContract implements OnInit { }); } + public getRowNodeId(data: any) { + if ( !data.UUID ) { + data.UUID = uuid_v4(); + } + + return data.UUID; + } + + protected getAllRows() { + const rowData: any[] = []; + + this.agGridElement.api.forEachNode(node => { + if ( !node.data.UUID ) { + node.data.UUID = uuid_v4(); + } + + rowData.push(node.data); + }); + + return rowData; + } + public async performSave(): Promise { // Save the columns first await this.api.saveDatabaseColumns(this.page.UUID, this.node.UUID, this.node.Value.Value, this.getSaveColumns()); // Save the data - const rows = await this.api.saveDatabaseEntries(this.page.UUID, this.node.UUID, this.node.Value.Value, this.rowData); - this.rowData = rows.map(x => x.RowData); + const allRows = this.getAllRows(); + const rows = await this.api.saveDatabaseEntries(this.page.UUID, this.node.UUID, this.node.Value.Value, allRows); + // this.rowData = rows.map(x => x.RowData); // Dynamically update the row data to avoid breaking open editors - const rowUUIDs = this.rowData.map(x => x.UUID); - const gridUUIDs = []; + const returnedUUIDs = rows.map(x => x.UUID); + const existingUUIDs = []; const rowDataTransaction = { add: [], @@ -436,11 +459,11 @@ export class DatabaseComponent extends EditorNodeContract implements OnInit { this.agGridElement.api.forEachNode((rowNode, index) => { const data = rowNode.data; - if ( !data.UUID || !rowUUIDs.includes(data.UUID) ) { + if ( !returnedUUIDs.includes(data.UUID) ) { rowDataTransaction.remove.push(rowNode.id); } else { - gridUUIDs.push(data.UUID); - const updatedRow = this.rowData.find(x => x.UUID === data.UUID); + existingUUIDs.push(data.UUID); + const updatedRow = rows.find(x => x.UUID === data.UUID); if ( updatedRow ) { for ( const prop in updatedRow ) { @@ -456,11 +479,11 @@ export class DatabaseComponent extends EditorNodeContract implements OnInit { } }); - for ( const row of this.rowData ) { - if ( !gridUUIDs.includes(row.UUID) ) { - rowDataTransaction.add.push(row); - } - } + // for ( const row of rows ) { + // if ( !gridUUIDs.includes(row.UUID) ) { + // rowDataTransaction.add.push(row); + // } + // } // @ts-ignore this.agGridElement.api.applyTransaction(rowDataTransaction); diff --git a/src/app/service/api.service.ts b/src/app/service/api.service.ts index e2b1243..d27bdd3 100644 --- a/src/app/service/api.service.ts +++ b/src/app/service/api.service.ts @@ -1046,7 +1046,7 @@ export class ApiService { for ( const row of rowData ) { const newDatabaseEntry = new DatabaseEntry( DatabaseId, - DatabaseEntry.getUUID(), + row.UUID || DatabaseEntry.getUUID(), JSON.stringify(row), true );