diff --git a/src/components/datatable/DataTable.vue b/src/components/datatable/DataTable.vue
index e4d86c9f2..2b6a89d2a 100644
--- a/src/components/datatable/DataTable.vue
+++ b/src/components/datatable/DataTable.vue
@@ -983,6 +983,10 @@ export default {
table-layout: auto;
}
+.p-datatable-hoverable-rows .p-datatable-tbody > tr.p-highlight {
+ cursor: pointer;
+}
+
/* Sections */
.p-datatable-header,
.p-datatable-footer {
diff --git a/src/components/treetable/TreeTable.vue b/src/components/treetable/TreeTable.vue
index f443225dd..f6d2930c8 100644
--- a/src/components/treetable/TreeTable.vue
+++ b/src/components/treetable/TreeTable.vue
@@ -36,7 +36,7 @@
@@ -231,6 +231,85 @@ export default {
this.d_expandedKeys = {...this.d_expandedKeys};
this.$emit('update:expandedKeys', this.d_expandedKeys);
},
+ onNodeClick(event) {
+ if (this.selectionMode != null && event.node.selectable !== false) {
+ const metaSelection = event.nodeTouched ? false : this.metaKeySelection;
+ const _selectionKeys = metaSelection ? this.handleSelectionWithMetaKey(event) : this.handleSelectionWithoutMetaKey(event);
+
+ this.$emit('update:selectionKeys', _selectionKeys);
+ }
+ },
+ handleSelectionWithMetaKey(event) {
+ const originalEvent = event.originalEvent;
+ const node = event.node;
+ const metaKey = (originalEvent.metaKey||originalEvent.ctrlKey);
+ const selected = this.isNodeSelected(node);
+ let _selectionKeys;
+
+ if (selected && metaKey) {
+ if (this.isSingleSelectionMode()) {
+ _selectionKeys = {};
+ }
+ else {
+ _selectionKeys = {...this.selectionKeys};
+ delete _selectionKeys[node.key];
+ }
+
+ this.$emit('node-unselect', node);
+ }
+ else {
+ if (this.isSingleSelectionMode()) {
+ _selectionKeys = {};
+ }
+ else if (this.isMultipleSelectionMode()) {
+ _selectionKeys = !metaKey ? {} : (this.selectionKeys ? {...this.selectionKeys} : {});
+ }
+
+ _selectionKeys[node.key] = true;
+ this.$emit('node-select', node);
+ }
+
+ return _selectionKeys;
+ },
+ handleSelectionWithoutMetaKey(event) {
+ const node = event.node;
+ const selected = this.isNodeSelected(node);
+ let _selectionKeys;
+
+ if (this.isSingleSelectionMode()) {
+ if (selected) {
+ _selectionKeys = {};
+ this.$emit('node-unselect', node);
+ }
+ else {
+ _selectionKeys = {};
+ _selectionKeys[node.key] = true;
+ this.$emit('node-select', node);
+ }
+ }
+ else {
+ if (selected) {
+ _selectionKeys = {...this.selectionKeys};
+ delete _selectionKeys[node.key];
+
+ this.$emit('node-unselect', node);
+ }
+ else {
+ _selectionKeys = this.selectionKeys ? {...this.selectionKeys} : {};
+ _selectionKeys[node.key] = true;
+
+ this.$emit('node-select', node);
+ }
+ }
+
+ return _selectionKeys;
+ },
+ isSingleSelectionMode() {
+ return this.selectionMode === 'single';
+ },
+ isMultipleSelectionMode() {
+ return this.selectionMode === 'multiple';
+ },
onPage(event) {
this.d_first = event.first;
this.d_rows = event.rows;
@@ -655,6 +734,10 @@ export default {
table-layout: auto;
}
+.p-treetable-hoverable-rows .p-treetable-tbody > tr.p-highlight {
+ cursor: pointer;
+}
+
/* Sections */
.p-treetable-header,
.p-treetable-footer {
diff --git a/src/components/treetable/TreeTableRow.vue b/src/components/treetable/TreeTableRow.vue
index e2d037288..ca4a6edad 100644
--- a/src/components/treetable/TreeTableRow.vue
+++ b/src/components/treetable/TreeTableRow.vue
@@ -1,5 +1,5 @@
-
+
@@ -12,6 +12,7 @@
+
+
\ No newline at end of file
|