feat: context menu shortcut to set NULL a table cell

This commit is contained in:
Fabio Di Stasio 2021-02-28 21:45:38 +01:00
parent 201fad9265
commit 71b4310117
5 changed files with 45 additions and 8 deletions

View File

@ -81,6 +81,8 @@ export default (connections) => {
escapedParam = `b'${sqlEscaper(params.content)}'`; escapedParam = `b'${sqlEscaper(params.content)}'`;
reload = true; reload = true;
} }
else if (params.content === null)
escapedParam = 'NULL';
else else
escapedParam = `"${sqlEscaper(params.content)}"`; escapedParam = `"${sqlEscaper(params.content)}"`;

View File

@ -9,6 +9,7 @@
:context-event="contextEvent" :context-event="contextEvent"
:selected-rows="selectedRows" :selected-rows="selectedRows"
@delete-selected="deleteSelected" @delete-selected="deleteSelected"
@set-null="setNull"
@close-context="isContext = false" @close-context="isContext = false"
/> />
<ul v-if="resultsWithRows.length > 1" class="tab tab-block result-tabs"> <ul v-if="resultsWithRows.length > 1" class="tab tab-block result-tabs">
@ -315,6 +316,21 @@ export default {
}; };
this.$emit('delete-selected', params); this.$emit('delete-selected', params);
}, },
setNull () {
const row = this.localResults.find(row => this.selectedRows.includes(row._id));
delete row._id;
const params = {
primary: this.primaryField.name,
schema: this.getSchema(this.resultsetIndex),
table: this.getTable(this.resultsetIndex),
id: this.getPrimaryValue(row),
row,
field: this.selectedCell.field,
content: null
};
this.$emit('update-field', params);
},
applyUpdate (params) { applyUpdate (params) {
const { primary, id, field, table, content } = params; const { primary, id, field, table, content } = params;

View File

@ -3,8 +3,19 @@
:context-event="contextEvent" :context-event="contextEvent"
@close-context="closeContext" @close-context="closeContext"
> >
<div
v-if="selectedRows.length === 1"
class="context-element"
@click="setNull"
>
<span class="d-flex">
<i class="mdi mdi-18px mdi-null text-light pr-1" /> {{ $t('message.setNull') }}
</span>
</div>
<div class="context-element" @click="showConfirmModal"> <div class="context-element" @click="showConfirmModal">
<span class="d-flex"><i class="mdi mdi-18px mdi-delete text-light pr-1" /> {{ $tc('message.deleteRows', selectedRows.length) }}</span> <span class="d-flex">
<i class="mdi mdi-18px mdi-delete text-light pr-1" /> {{ $tc('message.deleteRows', selectedRows.length) }}
</span>
</div> </div>
<ConfirmModal <ConfirmModal
@ -60,6 +71,10 @@ export default {
deleteRows () { deleteRows () {
this.$emit('delete-selected'); this.$emit('delete-selected');
this.closeContext(); this.closeContext();
},
setNull () {
this.$emit('set-null');
this.closeContext();
} }
} }
}; };

View File

@ -6,7 +6,7 @@
:key="cKey" :key="cKey"
class="td p-0" class="td p-0"
tabindex="0" tabindex="0"
@contextmenu.prevent="$emit('contextmenu', $event, {id: row._id, field: cKey})" @contextmenu.prevent="openContext($event, { id: row._id, field: cKey })"
> >
<template v-if="cKey !== '_id'"> <template v-if="cKey !== '_id'">
<span <span
@ -300,8 +300,8 @@ export default {
isEditable () { isEditable () {
if (this.fields) { if (this.fields) {
const nElements = Object.keys(this.fields).reduce((acc, curr) => { const nElements = Object.keys(this.fields).reduce((acc, curr) => {
acc.add(curr.table); acc.add(this.fields[curr].table);
acc.add(curr.schema); acc.add(this.fields[curr].schema);
return acc; return acc;
}, new Set([])); }, new Set([]));
@ -441,9 +441,6 @@ export default {
}; };
this.willBeDeleted = true; this.willBeDeleted = true;
}, },
contextMenu (event, cell) {
this.$emit('update-field', event, cell);
},
selectRow (event, row) { selectRow (event, row) {
this.$emit('select-row', event, row); this.$emit('select-row', event, row);
}, },
@ -452,6 +449,12 @@ export default {
return this.keyUsage.find(key => key.field === keyName.split('.').pop()); return this.keyUsage.find(key => key.field === keyName.split('.').pop());
return this.keyUsage.find(key => key.field === keyName); return this.keyUsage.find(key => key.field === keyName);
}, },
openContext (event, payload) {
if (this.isEditable) {
payload.field = this.fields[payload.field].name;// Ensures field name only
this.$emit('contextmenu', event, payload);
}
},
onKey (e) { onKey (e) {
e.stopPropagation(); e.stopPropagation();
if (e.key === 'Escape') { if (e.key === 'Escape') {

View File

@ -192,7 +192,8 @@ module.exports = {
searchForElements: 'Search for elements', searchForElements: 'Search for elements',
selectAll: 'Select all', selectAll: 'Select all',
queryDuration: 'Query duration', queryDuration: 'Query duration',
includeBetaUpdates: 'Include beta updates' includeBetaUpdates: 'Include beta updates',
setNull: 'Set NULL'
}, },
faker: { faker: {
address: 'Address', address: 'Address',