aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/views/collections/collectionSchema/CollectionSchemaView.scss98
-rw-r--r--src/client/views/collections/collectionSchema/CollectionSchemaView.tsx34
-rw-r--r--src/client/views/collections/collectionSchema/SchemaRowBox.tsx14
3 files changed, 73 insertions, 73 deletions
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaView.scss b/src/client/views/collections/collectionSchema/CollectionSchemaView.scss
index 1d0ab459d..4d7e8c39f 100644
--- a/src/client/views/collections/collectionSchema/CollectionSchemaView.scss
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaView.scss
@@ -7,22 +7,6 @@
.schema-table {
background-color: $white;
- .schema-header-row,
- .schema-row {
- display: flex;
- flex-direction: row;
- max-height: 70px;
- overflow: auto;
-
- .schema-column-header,
- .schema-table-cell,
- .row-menu {
- border: 1px solid $medium-gray;
- padding: 5px;
- overflow: hidden;
- }
- }
-
.schema-header-row {
justify-content: flex-end;
@@ -63,44 +47,60 @@
}
}
- .schema-row {
- justify-content: flex-end;
-
- .row-menu {
- display: flex;
- flex-direction: row;
- justify-content: center;
- min-width: 50px;
- }
-
- .row-cells {
- display: flex;
- flex-direction: row;
- justify-content: flex-end;
- }
- }
-
.schema-header-menu {
display: flex;
flex-direction: row;
}
+ }
+}
- .row-button,
- .schema-header-button {
- width: 20px;
- height: 20px;
- border-radius: 100%;
- background-color: $dark-gray;
- color: white;
- margin: 3px;
- cursor: pointer;
- display: flex;
- align-items: center;
- justify-content: center;
+.schema-header-row,
+.schema-row {
+ display: flex;
+ flex-direction: row;
+ max-height: 70px;
+ overflow: auto;
+
+ .schema-column-header,
+ .schema-table-cell,
+ .row-menu {
+ border: 1px solid $medium-gray;
+ padding: 5px;
+ overflow: hidden;
+ }
+}
- svg {
- width: 12px;
- }
- }
+.schema-row {
+ justify-content: flex-end;
+
+ .row-menu {
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ min-width: 50px;
+ }
+
+ .row-cells {
+ display: flex;
+ flex-direction: row;
+ justify-content: flex-end;
+ }
+}
+
+.schema-row-button,
+.schema-header-button {
+ width: 20px;
+ height: 20px;
+ border-radius: 100%;
+ background-color: $dark-gray;
+ color: white;
+ margin: 3px;
+ cursor: pointer;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ svg {
+ width: 12px;
}
}
diff --git a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
index 69a49598d..84a69d4b9 100644
--- a/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
+++ b/src/client/views/collections/collectionSchema/CollectionSchemaView.tsx
@@ -1,5 +1,5 @@
import React = require('react');
-import { action, computed, observable, ObservableSet } from 'mobx';
+import { action, computed, observable, ObservableMap, ObservableSet } from 'mobx';
import { observer } from 'mobx-react';
import { Doc, DocListCast } from '../../../../fields/Doc';
import { Id } from '../../../../fields/FieldSymbols';
@@ -41,7 +41,7 @@ export class CollectionSchemaView extends CollectionSubView() {
private _minColWidth: number = 120;
@observable _rowMenuWidth: number = 100;
- @observable _selectedDocs: ObservableSet = new ObservableSet<SchemaRowBox>();
+ @observable _selectedDocs: ObservableMap = new ObservableMap<SchemaRowBox, HTMLDivElement>();
@observable _isDragging: boolean = false;
@observable _displayColumnWidths: number[] | undefined;
@@ -149,7 +149,7 @@ export class CollectionSchemaView extends CollectionSubView() {
};
@action
- selectRow = (e: React.PointerEvent, doc: Doc, index: number) => {
+ selectRow = (e: React.PointerEvent, doc: Doc, ref: HTMLDivElement, index: number) => {
const ctrl = e.ctrlKey || e.metaKey;
const shift = e.shiftKey;
if (shift && this._lastSelectedRow !== undefined) {
@@ -157,19 +157,19 @@ export class CollectionSchemaView extends CollectionSubView() {
const endRow = Math.max(this._lastSelectedRow, index);
for (let i = startRow; i <= endRow; i++) {
const currDoc: Doc = this.childDocs[i];
- if (!this._selectedDocs.has(currDoc)) this._selectedDocs.add(currDoc);
+ if (!this._selectedDocs.has(currDoc)) this._selectedDocs.set(currDoc, ref);
}
this._lastSelectedRow = endRow;
} else if (ctrl) {
if (!this._selectedDocs.has(doc)) {
- this._selectedDocs.add(doc);
+ this._selectedDocs.set(doc, ref);
this._lastSelectedRow = index;
} else {
this._selectedDocs.delete(doc);
}
} else {
this._selectedDocs.clear();
- this._selectedDocs.add(doc);
+ this._selectedDocs.set(doc, ref);
this._lastSelectedRow = index;
}
@@ -219,25 +219,25 @@ export class CollectionSchemaView extends CollectionSubView() {
};
@action
- startDrag = (e: React.PointerEvent, doc: Doc) => {
+ startDrag = (e: React.PointerEvent, doc: Doc, ref: HTMLDivElement, index: number) => {
if (!this._selectedDocs.has(doc)) {
this._selectedDocs.clear();
- this._selectedDocs.add(doc);
- this._lastSelectedRow = this.childDocs.indexOf(doc);
+ this._selectedDocs.set(doc, ref);
+ this._lastSelectedRow = index;
SelectionManager.SelectSchemaViewDoc(doc);
}
this._isDragging = true;
this._selectedDocSortedArray = this.sortedSelectedDocs();
const dragData = new DragManager.DocumentDragData(this._selectedDocSortedArray, 'move');
dragData.moveDocument = this.props.moveDocument;
- const dragItem: HTMLElement[] = [];
- const dragDiv = document.createElement('div');
- dragDiv.className = 'presItem-multiDrag';
- dragDiv.innerText = 'Move ' + this._selectedDocs.size + ' row' + (this._selectedDocs.size > 1 ? 's' : '');
- dragDiv.style.position = 'absolute';
- dragDiv.style.top = e.clientY + 'px';
- dragDiv.style.left = e.clientX - 50 + 'px';
- dragItem.push(dragDiv);
+ const dragItem: HTMLElement[] = Array.from(this._selectedDocs.values());
+ // const dragDiv = document.createElement('div');
+ // dragDiv.className = 'presItem-multiDrag';
+ // dragDiv.innerText = 'Move ' + this._selectedDocs.size + ' row' + (this._selectedDocs.size > 1 ? 's' : '');
+ // dragDiv.style.position = 'absolute';
+ // dragDiv.style.top = e.clientY + 'px';
+ // dragDiv.style.left = e.clientX - 50 + 'px';
+ // dragItem.push(dragDiv);
DragManager.StartDocumentDrag(
dragItem.map(ele => ele),
diff --git a/src/client/views/collections/collectionSchema/SchemaRowBox.tsx b/src/client/views/collections/collectionSchema/SchemaRowBox.tsx
index 661056553..66cc3a47a 100644
--- a/src/client/views/collections/collectionSchema/SchemaRowBox.tsx
+++ b/src/client/views/collections/collectionSchema/SchemaRowBox.tsx
@@ -17,9 +17,9 @@ export interface SchemaRowBoxProps extends FieldViewProps {
columnKeys: string[];
columnWidths: number[];
rowMenuWidth: number;
- selectedRows: ObservableSet<Doc>;
- selectRow: (e: any, doc: Doc, index: number) => void;
- startDrag: (e: any, doc: Doc) => boolean;
+ selectedRows: ObservableMap<Doc, HTMLDivElement>;
+ selectRow: (e: any, doc: Doc, ref: HTMLDivElement, index: number) => void;
+ startDrag: (e: any, doc: Doc, ref: HTMLDivElement, index: number) => boolean;
dragging: boolean;
dropIndex: (index: number) => void;
}
@@ -42,9 +42,9 @@ export class SchemaRowBox extends ViewBoxBaseComponent<SchemaRowBoxProps>() {
setupMoveUpEvents(
this,
e,
- e => this.props.startDrag(e, this.props.Document),
+ e => this.props.startDrag(e, this.props.Document, this._ref!, this.props.rowIndex),
emptyFunction,
- e => this.props.selectRow(e, this.props.Document, this.props.rowIndex)
+ e => this.props.selectRow(e, this.props.Document, this._ref!, this.props.rowIndex)
);
};
@@ -96,7 +96,7 @@ export class SchemaRowBox extends ViewBoxBaseComponent<SchemaRowBoxProps>() {
ref={(row: HTMLDivElement | null) => (this._ref = row)}>
<div className="row-menu" style={{ width: this.props.rowMenuWidth }}>
<div
- className="row-button"
+ className="schema-row-button"
onPointerDown={undoBatch(e => {
e.stopPropagation();
this.props.removeDocument?.(this.props.Document);
@@ -104,7 +104,7 @@ export class SchemaRowBox extends ViewBoxBaseComponent<SchemaRowBoxProps>() {
<FontAwesomeIcon icon="times" />
</div>
<div
- className="row-button"
+ className="schema-row-button"
onPointerDown={e => {
e.stopPropagation();
this.props.addDocTab(this.props.Document, 'add:right');
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-12 00:38:12 +0000