mirror of https://github.com/Fabio286/antares.git
feat: support to multiple queries in the same tab
This commit is contained in:
parent
3385744260
commit
48f77bae01
12
package.json
12
package.json
|
|
@ -53,13 +53,13 @@
|
|||
"monaco-editor": "^0.20.0",
|
||||
"mssql": "^6.2.1",
|
||||
"mysql": "^2.18.1",
|
||||
"pg": "^8.3.2",
|
||||
"pg": "^8.3.3",
|
||||
"source-map-support": "^0.5.16",
|
||||
"spectre.css": "^0.5.9",
|
||||
"vue-click-outside": "^1.1.0",
|
||||
"vue-i18n": "^8.21.0",
|
||||
"vue-the-mask": "^0.11.1",
|
||||
"vuedraggable": "^2.24.0",
|
||||
"vuedraggable": "^2.24.1",
|
||||
"vuex": "^3.5.1",
|
||||
"vuex-persist": "^2.2.0"
|
||||
},
|
||||
|
|
@ -71,7 +71,7 @@
|
|||
"electron-devtools-installer": "^3.1.1",
|
||||
"electron-webpack": "^2.8.2",
|
||||
"electron-webpack-vue": "^2.4.0",
|
||||
"eslint": "^7.7.0",
|
||||
"eslint": "^7.8.1",
|
||||
"eslint-config-standard": "^14.1.1",
|
||||
"eslint-plugin-import": "^2.22.0",
|
||||
"eslint-plugin-node": "^11.1.0",
|
||||
|
|
@ -80,12 +80,12 @@
|
|||
"eslint-plugin-vue": "^6.2.2",
|
||||
"monaco-editor-webpack-plugin": "^1.9.0",
|
||||
"node-sass": "^4.14.1",
|
||||
"sass-loader": "^10.0.1",
|
||||
"sass-loader": "^10.0.2",
|
||||
"standard-version": "^9.0.0",
|
||||
"stylelint": "^13.6.1",
|
||||
"stylelint": "^13.7.0",
|
||||
"stylelint-config-standard": "^20.0.0",
|
||||
"stylelint-scss": "^3.18.0",
|
||||
"vue": "^2.6.11",
|
||||
"vue": "^2.6.12",
|
||||
"webpack": "^4.44.1"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -280,33 +280,44 @@ export class AntaresConnector {
|
|||
* @memberof AntaresConnector
|
||||
*/
|
||||
async raw (sql) {
|
||||
const resultsArr = [];
|
||||
const queries = sql.split(';');
|
||||
|
||||
if (process.env.NODE_ENV === 'development') this._logger(sql);// TODO: replace BLOB content with a placeholder
|
||||
|
||||
switch (this._client) { // TODO: uniform fields with every client type, needed table name and fields array
|
||||
case 'maria':
|
||||
case 'mysql': {
|
||||
const { rows, report, fields } = await new Promise((resolve, reject) => {
|
||||
this._connection.query(sql, (err, response, fields) => {
|
||||
if (err)
|
||||
reject(err);
|
||||
else {
|
||||
resolve({
|
||||
rows: Array.isArray(response) ? response : false,
|
||||
report: !Array.isArray(response) ? response : false,
|
||||
fields
|
||||
});
|
||||
}
|
||||
for (const query of queries) {
|
||||
if (!query) continue;
|
||||
|
||||
switch (this._client) { // TODO: uniform fields with every client type, needed table name and fields array
|
||||
case 'maria':
|
||||
case 'mysql': {
|
||||
const { rows, report, fields } = await new Promise((resolve, reject) => {
|
||||
this._connection.query(query, (err, response, fields) => {
|
||||
if (err)
|
||||
reject(err);
|
||||
else {
|
||||
resolve({
|
||||
rows: Array.isArray(response) ? response : false,
|
||||
report: !Array.isArray(response) ? response : false,
|
||||
fields
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
return { rows, report, fields };
|
||||
resultsArr.push({ rows, report, fields });
|
||||
break;
|
||||
}
|
||||
case 'mssql': {
|
||||
const results = await this._connection.request().query(query);
|
||||
resultsArr.push({ rows: results.recordsets[0] });// TODO: fields
|
||||
break;
|
||||
}
|
||||
default:
|
||||
break;
|
||||
}
|
||||
case 'mssql': {
|
||||
const results = await this._connection.request().query(sql);
|
||||
return { rows: results.recordsets[0] };// TODO: fields
|
||||
}
|
||||
default:
|
||||
break;
|
||||
}
|
||||
|
||||
return resultsArr.length === 1 ? resultsArr[0] : resultsArr;
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
|||
|
|
@ -55,6 +55,11 @@
|
|||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div v-show="selectedTab === 'prop'" class="column col-12">
|
||||
<p class="px-2">
|
||||
In future releases
|
||||
</p>
|
||||
</div>
|
||||
<WorkspaceTableTab
|
||||
v-show="selectedTab === 'data'"
|
||||
:connection="connection"
|
||||
|
|
|
|||
|
|
@ -15,11 +15,11 @@
|
|||
</button>
|
||||
</div>
|
||||
<div class="workspace-query-info">
|
||||
<div v-if="results.rows">
|
||||
{{ $t('word.results') }}: <b>{{ results.rows.length }}</b>
|
||||
<div v-if="results[selectedResultsset] && results[selectedResultsset].rows">
|
||||
{{ $t('word.results') }}: <b>{{ resultsCount }}</b>
|
||||
</div>
|
||||
<div v-if="results.report">
|
||||
{{ $t('message.affectedRows') }}: <b>{{ results.report.affectedRows }}</b>
|
||||
<div v-if="results[selectedResultsset] && results[selectedResultsset].report">
|
||||
{{ $t('message.affectedRows') }}: <b>{{ affectedCount }}</b>
|
||||
</div>
|
||||
<div v-if="workspace.breadcrumbs.schema">
|
||||
{{ $t('word.schema') }}: <b>{{ workspace.breadcrumbs.schema }}</b>
|
||||
|
|
@ -66,8 +66,10 @@ export default {
|
|||
query: '',
|
||||
lastQuery: '',
|
||||
isQuering: false,
|
||||
results: {},
|
||||
selectedFields: []
|
||||
results: [],
|
||||
resultsCount: 0,
|
||||
affectedCount: 0,
|
||||
selectedResultsset: 0
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
|
|
@ -77,11 +79,6 @@ export default {
|
|||
workspace () {
|
||||
return this.getWorkspace(this.connection.uid);
|
||||
},
|
||||
table () {
|
||||
if ('fields' in this.results && this.results.fields.length)
|
||||
return this.results.fields[0].orgTable;
|
||||
return '';
|
||||
},
|
||||
schema () {
|
||||
if ('fields' in this.results && this.results.fields.length)
|
||||
return this.results.fields[0].db;
|
||||
|
|
@ -94,6 +91,11 @@ export default {
|
|||
setTabFields: 'workspaces/setTabFields',
|
||||
setTabKeyUsage: 'workspaces/setTabKeyUsage'
|
||||
}),
|
||||
getTable (index) {
|
||||
if ('fields' in this.results[index] && this.results[index].fields.length)
|
||||
return this.results[index].fields[0].orgTable;
|
||||
return '';
|
||||
},
|
||||
async runQuery (query) {
|
||||
if (!query) return;
|
||||
this.isQuering = true;
|
||||
|
|
@ -107,56 +109,69 @@ export default {
|
|||
};
|
||||
|
||||
const { status, response } = await Connection.rawQuery(params);
|
||||
|
||||
if (status === 'success') {
|
||||
this.results = response;
|
||||
if (response.rows) { // if is a select
|
||||
this.selectedFields = response.fields.map(field => field.orgName);
|
||||
this.results = Array.isArray(response) ? response : [response];
|
||||
|
||||
try { // Table data
|
||||
const params = {
|
||||
uid: this.connection.uid,
|
||||
schema: this.schema,
|
||||
table: this.table
|
||||
};
|
||||
let selectedFields = [];
|
||||
const fieldsArr = [];
|
||||
const keysArr = [];
|
||||
|
||||
const { status, response } = await Tables.getTableColumns(params);
|
||||
for (const [index, result] of this.results.entries()) {
|
||||
if (result.rows) { // if is a select
|
||||
selectedFields = result.fields.map(field => field.orgName);
|
||||
this.resultsCount += result.rows.length;
|
||||
|
||||
if (status === 'success') {
|
||||
let fields = response.filter(field => this.selectedFields.includes(field.name));
|
||||
if (this.selectedFields.length) {
|
||||
fields = fields.map((field, index) => {
|
||||
return { ...field, alias: this.results.fields[index].name };
|
||||
});
|
||||
try { // Table data
|
||||
const params = {
|
||||
uid: this.connection.uid,
|
||||
schema: this.schema,
|
||||
table: this.getTable(index)
|
||||
};
|
||||
|
||||
const { status, response } = await Tables.getTableColumns(params);
|
||||
|
||||
if (status === 'success') {
|
||||
let fields = response.filter(field => selectedFields.includes(field.name));
|
||||
if (selectedFields.length) {
|
||||
fields = fields.map((field, index) => {
|
||||
return { ...field, alias: result.fields[index].name };
|
||||
});
|
||||
}
|
||||
|
||||
fieldsArr.push(fields);
|
||||
}
|
||||
|
||||
this.setTabFields({ cUid: this.connection.uid, tUid: this.tabUid, fields });
|
||||
else
|
||||
this.addNotification({ status: 'error', message: response });
|
||||
}
|
||||
catch (err) {
|
||||
this.addNotification({ status: 'error', message: err.stack });
|
||||
}
|
||||
else
|
||||
this.addNotification({ status: 'error', message: response });
|
||||
}
|
||||
catch (err) {
|
||||
this.addNotification({ status: 'error', message: err.stack });
|
||||
}
|
||||
|
||||
try { // Key usage (foreign keys)
|
||||
const params = {
|
||||
uid: this.connection.uid,
|
||||
schema: this.schema,
|
||||
table: this.table
|
||||
};
|
||||
try { // Key usage (foreign keys)
|
||||
const params = {
|
||||
uid: this.connection.uid,
|
||||
schema: this.schema,
|
||||
table: this.getTable(index)
|
||||
};
|
||||
|
||||
const { status, response } = await Tables.getKeyUsage(params);
|
||||
if (status === 'success')
|
||||
this.setTabKeyUsage({ cUid: this.connection.uid, tUid: this.tabUid, keyUsage: response });
|
||||
else
|
||||
this.addNotification({ status: 'error', message: response });
|
||||
const { status, response } = await Tables.getKeyUsage(params);
|
||||
if (status === 'success')
|
||||
keysArr.push(response);
|
||||
else
|
||||
this.addNotification({ status: 'error', message: response });
|
||||
}
|
||||
catch (err) {
|
||||
this.addNotification({ status: 'error', message: err.stack });
|
||||
}
|
||||
}
|
||||
catch (err) {
|
||||
this.addNotification({ status: 'error', message: err.stack });
|
||||
else { // if is a query without results
|
||||
this.affectedCount += result.report.affectedRows;
|
||||
}
|
||||
}
|
||||
else { // if is a query without results
|
||||
}
|
||||
console.log(fieldsArr);
|
||||
this.setTabFields({ cUid: this.connection.uid, tUid: this.tabUid, fields: fieldsArr });
|
||||
this.setTabKeyUsage({ cUid: this.connection.uid, tUid: this.tabUid, keyUsage: keysArr });
|
||||
}
|
||||
else
|
||||
this.addNotification({ status: 'error', message: response });
|
||||
|
|
@ -172,7 +187,9 @@ export default {
|
|||
this.runQuery(this.lastQuery);
|
||||
},
|
||||
clearTabData () {
|
||||
this.results = {};
|
||||
this.results = [];
|
||||
this.resultsCount = 0;
|
||||
this.affectedCount = 0;
|
||||
this.setTabFields({ cUid: this.connection.uid, tUid: this.tabUid, fields: [] });
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,6 +11,17 @@
|
|||
@delete-selected="deleteSelected"
|
||||
@close-context="isContext = false"
|
||||
/>
|
||||
<ul v-if="results.length > 1" class="tab tab-block result-tabs">
|
||||
<li
|
||||
v-for="(result, index) in results"
|
||||
:key="index"
|
||||
class="tab-item"
|
||||
:class="{'active': resultsetIndex === index}"
|
||||
@click="selectResultset(index)"
|
||||
>
|
||||
<a>{{ result.fields[0].orgTable }} ({{ result.rows.length }})</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div ref="table" class="table table-hover">
|
||||
<div class="thead">
|
||||
<div class="tr">
|
||||
|
|
@ -39,7 +50,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<BaseVirtualScroll
|
||||
v-if="results.rows"
|
||||
v-if="results[resultsetIndex] && results[resultsetIndex].rows"
|
||||
ref="resultTable"
|
||||
:items="sortedResults"
|
||||
:item-height="22"
|
||||
|
|
@ -81,7 +92,7 @@ export default {
|
|||
TableContext
|
||||
},
|
||||
props: {
|
||||
results: Object,
|
||||
results: Array,
|
||||
tabUid: [String, Number]
|
||||
},
|
||||
data () {
|
||||
|
|
@ -93,7 +104,9 @@ export default {
|
|||
selectedCell: null,
|
||||
selectedRows: [],
|
||||
currentSort: '',
|
||||
currentSortDir: 'asc'
|
||||
currentSortDir: 'asc',
|
||||
resultsetIndex: 0,
|
||||
scrollElement: null
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
|
|
@ -119,26 +132,27 @@ export default {
|
|||
return this.localResults;
|
||||
},
|
||||
fields () {
|
||||
return this.getWorkspaceTab(this.tabUid) ? this.getWorkspaceTab(this.tabUid).fields : [];
|
||||
return this.getWorkspaceTab(this.tabUid) && this.getWorkspaceTab(this.tabUid).fields[this.resultsetIndex] ? this.getWorkspaceTab(this.tabUid).fields[this.resultsetIndex] : [];
|
||||
},
|
||||
keyUsage () {
|
||||
return this.getWorkspaceTab(this.tabUid) ? this.getWorkspaceTab(this.tabUid).keyUsage : [];
|
||||
},
|
||||
scrollElement () {
|
||||
return this.$refs.tableWrapper;
|
||||
return this.getWorkspaceTab(this.tabUid) && this.getWorkspaceTab(this.tabUid).keyUsage[this.resultsetIndex] ? this.getWorkspaceTab(this.tabUid).keyUsage[this.resultsetIndex] : [];
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
results () {
|
||||
this.resetSort();
|
||||
this.localResults = this.results.rows ? this.results.rows.map(item => {
|
||||
return { ...item, _id: uidGen() };
|
||||
}) : [];
|
||||
this.setLocalResults();
|
||||
this.resultsetIndex = 0;
|
||||
},
|
||||
resultsetIndex () {
|
||||
this.setLocalResults();
|
||||
}
|
||||
},
|
||||
updated () {
|
||||
if (this.$refs.table)
|
||||
this.refreshScroller();
|
||||
|
||||
if (this.$refs.tableWrapper)
|
||||
this.scrollElement = this.$refs.tableWrapper;
|
||||
},
|
||||
mounted () {
|
||||
window.addEventListener('resize', this.resizeResults);
|
||||
|
|
@ -178,6 +192,12 @@ export default {
|
|||
return 'UNKNOWN ' + key;
|
||||
}
|
||||
},
|
||||
setLocalResults () {
|
||||
this.resetSort();
|
||||
this.localResults = this.results[this.resultsetIndex] && this.results[this.resultsetIndex].rows ? this.results[this.resultsetIndex].rows.map(item => {
|
||||
return { ...item, _id: uidGen() };
|
||||
}) : [];
|
||||
},
|
||||
resizeResults () {
|
||||
if (this.$refs.resultTable) {
|
||||
const el = this.$refs.tableWrapper;
|
||||
|
|
@ -275,12 +295,15 @@ export default {
|
|||
resetSort () {
|
||||
this.currentSort = '';
|
||||
this.currentSortDir = 'asc';
|
||||
},
|
||||
selectResultset (index) {
|
||||
this.resultsetIndex = index;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
<style lang="scss" scoped>
|
||||
.vscroll {
|
||||
height: 1000px;
|
||||
overflow: auto;
|
||||
|
|
@ -305,4 +328,9 @@ export default {
|
|||
line-height: 1;
|
||||
margin-left: 0.2rem;
|
||||
}
|
||||
|
||||
.result-tabs {
|
||||
background: transparent !important;
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -186,7 +186,10 @@ export default {
|
|||
},
|
||||
props: {
|
||||
row: Object,
|
||||
fields: Array,
|
||||
fields: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
keyUsage: Array
|
||||
},
|
||||
data () {
|
||||
|
|
@ -253,10 +256,12 @@ export default {
|
|||
return this.keyUsage.map(key => key.column);
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.fields.forEach(field => {
|
||||
this.isInlineEditor[field.name] = false;
|
||||
});
|
||||
watch: {
|
||||
fields () {
|
||||
this.fields.forEach(field => {
|
||||
this.isInlineEditor[field.name] = false;
|
||||
});
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getFieldType (cKey) {
|
||||
|
|
|
|||
|
|
@ -33,8 +33,9 @@
|
|||
<div class="workspace-query-results column col-12">
|
||||
<WorkspaceQueryTable
|
||||
v-if="results"
|
||||
v-show="!isQuering"
|
||||
ref="queryTable"
|
||||
:results="results"
|
||||
:results="[results]"
|
||||
:tab-uid="tabUid"
|
||||
@update-field="updateField"
|
||||
@delete-selected="deleteSelected"
|
||||
|
|
@ -116,6 +117,8 @@ export default {
|
|||
if (!this.table) return;
|
||||
this.isQuering = true;
|
||||
this.results = {};
|
||||
const fieldsArr = [];
|
||||
const keysArr = [];
|
||||
this.setTabFields({ cUid: this.connection.uid, tUid: this.tabUid, fields: [] });
|
||||
|
||||
const params = {
|
||||
|
|
@ -128,7 +131,7 @@ export default {
|
|||
const { status, response } = await Tables.getTableColumns(params);
|
||||
if (status === 'success') {
|
||||
this.fields = response;// Needed to add new rows
|
||||
this.setTabFields({ cUid: this.connection.uid, tUid: this.tabUid, fields: response });
|
||||
fieldsArr.push(response);
|
||||
}
|
||||
else
|
||||
this.addNotification({ status: 'error', message: response });
|
||||
|
|
@ -153,7 +156,7 @@ export default {
|
|||
const { status, response } = await Tables.getKeyUsage(params);
|
||||
if (status === 'success') {
|
||||
this.keyUsage = response;// Needed to add new rows
|
||||
this.setTabKeyUsage({ cUid: this.connection.uid, tUid: this.tabUid, keyUsage: response });
|
||||
keysArr.push(response);
|
||||
}
|
||||
else
|
||||
this.addNotification({ status: 'error', message: response });
|
||||
|
|
@ -162,6 +165,8 @@ export default {
|
|||
this.addNotification({ status: 'error', message: err.stack });
|
||||
}
|
||||
|
||||
this.setTabFields({ cUid: this.connection.uid, tUid: this.tabUid, fields: fieldsArr });
|
||||
this.setTabKeyUsage({ cUid: this.connection.uid, tUid: this.tabUid, keyUsage: keysArr });
|
||||
this.isQuering = false;
|
||||
},
|
||||
reloadTable () {
|
||||
|
|
|
|||
Loading…
Reference in New Issue