1
1
mirror of https://github.com/Fabio286/antares.git synced 2025-06-05 21:59:22 +02:00

Merge branch 'master' of https://github.com/Fabio286/antares into pr/toriphes/129

This commit is contained in:
2022-02-16 09:14:46 +01:00
parent d25c62b4da
commit 328ab61757
102 changed files with 3499 additions and 563 deletions

View File

@ -0,0 +1,108 @@
<template>
<div id="map" class="map" />
</template>
<script>
import L from 'leaflet';
import {
point,
lineString,
polygon
} from '@turf/helpers';
import { getArrayDepth } from 'common/libs/getArrayDepth';
export default {
name: 'BaseMap',
props: {
points: [Object, Array],
isMultiSpatial: Boolean
},
data () {
return {
map: null,
markers: [],
center: null
};
},
mounted () {
if (this.isMultiSpatial) {
for (const element of this.points)
this.markers.push(this.getMarkers(element));
}
else {
this.markers = this.getMarkers(this.points);
if (!Array.isArray(this.points))
this.center = [this.points.y, this.points.x];
}
this.map = L.map('map', {
center: this.center || [0, 0],
zoom: 15,
minZoom: 1,
attributionControl: false
});
L.control.attribution({ prefix: '<b>Leaflet</b>' }).addTo(this.map);
const geoJsonObj = L.geoJSON(this.markers, {
style: function () {
return {
weight: 2,
fillColor: '#ff7800',
color: '#ff7800',
opacity: 0.8,
fillOpacity: 0.4
};
},
pointToLayer: function (feature, latlng) {
return L.circleMarker(latlng, {
radius: 7,
weight: 2,
fillColor: '#ff7800',
color: '#ff7800',
opacity: 0.8,
fillOpacity: 0.4
});
}
}).addTo(this.map);
const southWest = L.latLng(-90, -180);
const northEast = L.latLng(90, 180);
const bounds = L.latLngBounds(southWest, northEast);
this.map.setMaxBounds(bounds);
if (!this.center) this.map.fitBounds(geoJsonObj.getBounds());
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '&copy; <b>OpenStreetMap</b>'
}).addTo(this.map);
},
methods: {
getMarkers (points) {
if (Array.isArray(points)) {
if (getArrayDepth(points) === 1)
return lineString(points.reduce((acc, curr) => [...acc, [curr.x, curr.y]], []));
else
return polygon(points.map(arr => arr.reduce((acc, curr) => [...acc, [curr.x, curr.y]], [])));
}
else
return point([points.x, points.y]);
}
}
};
</script>
<style lang="scss">
.map{
height: 400px;
}
.marker-icon{
display: flex;
justify-content: center;
align-items: center;
background: $primary-color;
border-radius: 50%;
box-shadow: 0 0 5px 1px darken($body-font-color-dark, 40%);
}
</style>

View File

@ -89,7 +89,7 @@
:type="inputProps().type"
:disabled="!isChecked"
>
<template v-if="methodData && 'params' in methodData" class="columns">
<template v-if="methodData && 'params' in methodData">
<input
v-for="(option, key) in methodData.params"
:key="key"

View File

@ -6,18 +6,18 @@
@confirm="runRoutine"
@hide="closeModal"
>
<template slot="header">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-play mr-1" />
<span class="cut-text">{{ $t('word.parameters') }}: {{ localRoutine.name }}</span>
</div>
</template>
<div slot="body">
<template #body>
<div class="content">
<form class="form-horizontal">
<div
v-for="(parameter, i) in inParameters"
:key="parameter._id"
:key="parameter._antares_id"
class="form-group"
>
<div class="col-4">
@ -43,7 +43,7 @@
</div>
</form>
</div>
</div>
</template>
</ConfirmModal>
</template>

View File

@ -5,16 +5,16 @@
@confirm="$emit('confirm')"
@hide="$emit('close')"
>
<template slot="header">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-content-save-alert mr-1" /> {{ $t('message.unsavedChanges') }}
</div>
</template>
<div slot="body">
<template #body>
<div>
{{ $t('message.discardUnsavedChanges') }}
</div>
</div>
</template>
</ConfirmModal>
</template>

View File

@ -170,7 +170,7 @@
KiB
</option>
<option value="rows">
{{ $t('word.rows') }}
{{ $tc('word.row', 2) }}
</option>
</select>
</div>

View File

@ -6,7 +6,7 @@
<div class="modal-title h6">
<div class="d-flex">
<i class="mdi mdi-24px mdi-playlist-plus mr-1" />
<span class="cut-text">{{ $t('message.tableFiller') }}</span>
<span class="cut-text">{{ $tc('message.insertRow', 2) }}</span>
</div>
</div>
<a class="btn btn-clear c-hand" @click.stop="closeModal" />
@ -41,7 +41,7 @@
<label class="form-checkbox ml-3" :title="$t('word.insert')">
<input
type="checkbox"
:checked="!field.autoIncrement"
:checked="!fieldsToExclude.includes(field.name)"
@change.prevent="toggleFields($event, field)"
><i class="form-icon" />
</label>
@ -264,7 +264,7 @@ export default {
else if (BIT.includes(field.type))
fieldDefault = field.default.replaceAll('\'', '').replaceAll('b', '');
else if (DATETIME.includes(field.type)) {
if (field.default && ['current_timestamp', 'now()'].includes(field.default.toLowerCase())) {
if (field.default && ['current_timestamp', 'now()'].some(term => field.default.toLowerCase().includes(term))) {
let datePrecision = '';
for (let i = 0; i < field.datePrecision; i++)
datePrecision += i === 0 ? '.S' : 'S';
@ -281,7 +281,7 @@ export default {
rowObj[field.name] = { value: fieldDefault };
if (field.autoIncrement)// Disable by default auto increment fields
if (field.autoIncrement || !!field.onUpdate)// Disable by default auto increment or "on update" fields
this.fieldsToExclude = [...this.fieldsToExclude, field.name];
}

View File

@ -253,6 +253,7 @@ export default {
font-size: 100%;
// color: $primary-color;
opacity: 0.8;
font-weight: 600;
}
.tile-subtitle {

View File

@ -22,12 +22,12 @@
:hide-footer="true"
@hide="hideInfoModal"
>
<template :slot="'header'">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-information-outline mr-1" /> {{ $t('message.processInfo') }}
</div>
</template>
<div :slot="'body'">
<template #body>
<div>
<div>
<TextEditor
@ -38,7 +38,7 @@
/>
</div>
</div>
</div>
</template>
</ConfirmModal>
</div>
</template>

View File

@ -396,7 +396,7 @@ export default {
return locales;
},
hasUpdates () {
return ['available', 'downloading', 'downloaded'].includes(this.updateStatus);
return ['available', 'downloading', 'downloaded', 'link'].includes(this.updateStatus);
},
workspace () {
return this.getWorkspace(this.selectedWorkspace);

View File

@ -16,7 +16,7 @@
<script>
import { mapGetters } from 'vuex';
import marked from 'marked';
import { marked } from 'marked';
import BaseLoader from '@/components/BaseLoader';
export default {

View File

@ -29,12 +29,19 @@
{{ $t('message.checkForUpdates') }}
</button>
<button
v-if="updateStatus === 'downloaded'"
v-else-if="updateStatus === 'downloaded'"
class="btn btn-primary"
@click="restartToUpdate"
>
{{ $t('message.restartToInstall') }}
</button>
<button
v-else-if="updateStatus === 'link'"
class="btn btn-primary"
@click="openOutside('https://antares-sql.app/download.html')"
>
{{ $t('message.goToDownloadPage') }}
</button>
</div>
<div class="form-group mt-4">
<label class="form-switch d-inline-block disabled" @click.prevent="toggleAllowPrerelease">
@ -47,7 +54,7 @@
<script>
import { mapGetters, mapActions } from 'vuex';
import { ipcRenderer } from 'electron';
import { ipcRenderer, shell } from 'electron';
export default {
name: 'ModalSettingsUpdate',
@ -71,6 +78,8 @@ export default {
return this.$t('message.downloadingUpdate');
case 'downloaded':
return this.$t('message.updateDownloaded');
case 'link':
return this.$t('message.updateAvailable');
default:
return this.updateStatus;
}
@ -80,6 +89,9 @@ export default {
...mapActions({
changeAllowPrerelease: 'settings/changeAllowPrerelease'
}),
openOutside (link) {
shell.openExternal(link);
},
checkForUpdates () {
ipcRenderer.send('check-for-updates');
},

View File

@ -15,16 +15,16 @@
@confirm="confirmDeleteConnection"
@hide="hideConfirmModal"
>
<template :slot="'header'">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-server-remove mr-1" /> {{ $t('message.deleteConnection') }}
</div>
</template>
<div :slot="'body'">
<template #body>
<div class="mb-2">
{{ $t('message.deleteCorfirm') }} <b>{{ connectionName }}</b>?
</div>
</div>
</template>
</ConfirmModal>
</BaseContextMenu>
</template>

View File

@ -11,9 +11,9 @@
<div class="footer-right-elements">
<ul class="footer-elements">
<li class="footer-element footer-link" @click="openOutside('https://www.treedom.net/en/user/fabio-di-stasio/event/antares-for-the-planet')">
<i class="mdi mdi-18px mdi-tree mr-1" />
<small>{{ $t('message.plantATree') }}</small>
<li class="footer-element footer-link" @click="openOutside('https://www.paypal.com/paypalme/fabiodistasio')">
<i class="mdi mdi-18px mdi-coffee mr-1" />
<small>{{ $t('word.donate') }}</small>
</li>
<li class="footer-element footer-link" @click="openOutside('https://github.com/Fabio286/antares/issues')">
<i class="mdi mdi-18px mdi-bug" />

View File

@ -40,15 +40,13 @@ export default {
}
},
watch: {
notifications: {
deep: true,
handler: function (notification) {
if (notification.length) {
this.timeouts[notification[0].uid] = setTimeout(() => {
this.removeNotification(notification[0].uid);
delete this.timeouts[notification.uid];
}, this.notificationsTimeout * 1000);
}
'notifications.length': function (val) {
if (val > 0) {
const nUid = this.notifications[0].uid;
this.timeouts[nUid] = setTimeout(() => {
this.removeNotification(nUid);
delete this.timeouts[nUid];
}, this.notificationsTimeout * 1000);
}
}
},
@ -63,11 +61,14 @@ export default {
}
},
rearmTimeouts () {
const delay = 50;
let i = this.notifications.length * delay;
for (const notification of this.notifications) {
this.timeouts[notification.uid] = setTimeout(() => {
this.removeNotification(notification.uid);
delete this.timeouts[notification.uid];
}, this.notificationsTimeout * 1000);
}, (this.notificationsTimeout * 1000) + i);
i = i > delay ? i - delay : 0;
}
}
}

View File

@ -6,12 +6,12 @@
:hide-footer="true"
@hide="hideScratchpad"
>
<template :slot="'header'">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-notebook-edit-outline mr-1" /> {{ $t('word.scratchpad') }}
</div>
</template>
<div :slot="'body'">
<template #body>
<div>
<div>
<TextEditor
@ -24,7 +24,7 @@
</div>
<small class="text-gray">{{ $t('message.markdownSupported') }}</small>
</div>
</div>
</template>
</ConfirmModal>
</template>

View File

@ -92,7 +92,7 @@ export default {
}
},
hasUpdates () {
return ['available', 'downloading', 'downloaded'].includes(this.updateStatus);
return ['available', 'downloading', 'downloaded', 'link'].includes(this.updateStatus);
}
},
methods: {
@ -200,7 +200,7 @@ export default {
}
&::before {
content: '';
content: "";
height: 0;
width: 3px;
transition: height 0.2s;

View File

@ -18,14 +18,17 @@
<li
v-for="(tab, i) of draggableTabs"
:key="i"
:ref="selectedTab === tab.uid ? 'tab-selected' : ''"
class="tab-item tab-draggable"
draggable="true"
:class="{'active': selectedTab === tab.uid}"
@mousedown.left="selectTab({uid: workspace.uid, tab: tab.uid})"
@mouseup.middle="closeTab(tab)"
>
<a v-if="tab.type === 'query'" class="tab-link">
<a
v-if="tab.type === 'query'"
class="tab-link"
:class="{'badge': tab.isChanged}"
>
<i class="mdi mdi-18px mdi-code-tags mr-1" />
<span>
<span>{{ tab.content || 'Query' | cutText }} #{{ tab.index }}</span>
@ -256,52 +259,59 @@
</span>
</a>
</li>
<li slot="header" class="tab-item dropdown tools-dropdown">
<a
class="tab-link workspace-tools-link dropdown-toggle"
tabindex="0"
:title="$t('word.tools')"
<template #header>
<li
v-if="workspace.customizations.processesList"
class="tab-item dropdown tools-dropdown"
>
<i class="mdi mdi-24px mdi-tools" />
</a>
<ul class="menu text-left text-uppercase">
<li v-if="workspace.customizations.processesList" class="menu-item">
<a class="c-hand p-vcentered" @click="showProcessesModal">
<i class="mdi mdi-memory mr-1 tool-icon" />
<span>{{ $t('message.processesList') }}</span>
</a>
</li>
<li
v-if="workspace.customizations.variables"
class="menu-item"
title="Coming..."
<a
class="tab-link workspace-tools-link dropdown-toggle"
tabindex="0"
:title="$t('word.tools')"
>
<a class="c-hand p-vcentered disabled">
<i class="mdi mdi-shape mr-1 tool-icon" />
<span>{{ $t('word.variables') }}</span>
</a>
</li>
<li
v-if="workspace.customizations.usersManagement"
class="menu-item"
title="Coming..."
<i class="mdi mdi-24px mdi-tools" />
</a>
<ul v-if="hasTools" class="menu text-left text-uppercase">
<li class="menu-item">
<a class="c-hand p-vcentered" @click="showProcessesModal">
<i class="mdi mdi-memory mr-1 tool-icon" />
<span>{{ $t('message.processesList') }}</span>
</a>
</li>
<li
v-if="workspace.customizations.variables"
class="menu-item"
title="Coming..."
>
<a class="c-hand p-vcentered disabled">
<i class="mdi mdi-shape mr-1 tool-icon" />
<span>{{ $t('word.variables') }}</span>
</a>
</li>
<li
v-if="workspace.customizations.usersManagement"
class="menu-item"
title="Coming..."
>
<a class="c-hand p-vcentered disabled">
<i class="mdi mdi-account-group mr-1 tool-icon" />
<span>{{ $t('message.manageUsers') }}</span>
</a>
</li>
</ul>
</li>
</template>
<template #footer>
<li class="tab-item">
<a
class="tab-add"
:title="$t('message.openNewTab')"
@click="addQueryTab"
>
<a class="c-hand p-vcentered disabled">
<i class="mdi mdi-account-group mr-1 tool-icon" />
<span>{{ $t('message.manageUsers') }}</span>
</a>
</li>
</ul>
</li>
<li slot="footer" class="tab-item">
<a
class="tab-add"
:title="$t('message.openNewTab')"
@click="addQueryTab"
>
<i class="mdi mdi-24px mdi-plus" />
</a>
</li>
<i class="mdi mdi-24px mdi-plus" />
</a>
</li>
</template>
</Draggable>
<WorkspaceEmptyState v-if="!workspace.tabs.length" @new-tab="addQueryTab" />
<template v-for="tab of workspace.tabs">
@ -561,7 +571,7 @@ export default {
return this.workspace ? this.workspace.selectedTab : null;
},
queryTabs () {
return this.workspace.tabs.filter(tab => tab.type === 'query');
return this.workspace ? this.workspace.tabs.filter(tab => tab.type === 'query') : [];
},
schemaChild () {
for (const key in this.workspace.breadcrumbs) {
@ -569,19 +579,20 @@ export default {
if (this.workspace.breadcrumbs[key]) return this.workspace.breadcrumbs[key];
}
return false;
},
hasTools () {
return this.workspace.customizations.processesList ||
this.workspace.customizations.usersManagement ||
this.workspace.customizations.variables;
}
},
watch: {
selectedTab (newVal, oldVal) {
if (newVal !== oldVal) {
queryTabs: function (newVal, oldVal) {
if (newVal.length > oldVal.length) {
setTimeout(() => {
const element = this.$refs['tab-selected'] ? this.$refs['tab-selected'][0] : null;
if (element) {
element.setAttribute('tabindex', '-1');
element.focus();
element.removeAttribute('tabindex');
}
}, 50);
const scroller = this.$refs.tabWrap;
if (scroller) scroller.$el.scrollLeft = scroller.$el.scrollWidth;
}, 0);
}
}
},

View File

@ -11,6 +11,7 @@
<a class="tab-link">{{ $t('word.general') }}</a>
</li>
<li
v-if="customizations.sslConnection"
class="tab-item c-hand"
:class="{'active': selectedTab === 'ssl'}"
@click="selectTab('ssl')"
@ -18,6 +19,7 @@
<a class="tab-link">{{ $t('word.ssl') }}</a>
</li>
<li
v-if="customizations.sshConnection"
class="tab-item c-hand"
:class="{'active': selectedTab === 'ssh'}"
@click="selectTab('ssh')"
@ -49,25 +51,17 @@
</div>
<div class="column col-8 col-sm-12">
<select v-model="connection.client" class="form-select">
<option value="mysql">
MySQL
<option
v-for="client in clients"
:key="client.slug"
:value="client.slug"
>
{{ client.name }}
</option>
<option value="maria">
MariaDB
</option>
<option value="pg">
PostgreSQL
</option>
<!-- <option value="mssql">
Microsoft SQL
</option>
<option value="oracledb">
Oracle DB
</option> -->
</select>
</div>
</div>
<div class="form-group columns">
<div v-if="!customizations.fileConnection" class="form-group columns">
<div class="column col-4 col-sm-12">
<label class="form-label">{{ $t('word.hostName') }}/IP</label>
</div>
@ -79,7 +73,20 @@
>
</div>
</div>
<div class="form-group columns">
<div v-if="customizations.fileConnection" class="form-group columns">
<div class="column col-4 col-sm-12">
<label class="form-label">{{ $t('word.database') }}</label>
</div>
<div class="column col-8 col-sm-12">
<BaseUploadInput
:value="connection.databasePath"
:message="$t('word.browse')"
@clear="pathClear('databasePath')"
@change="pathSelection($event, 'databasePath')"
/>
</div>
</div>
<div v-if="!customizations.fileConnection" class="form-group columns">
<div class="column col-4 col-sm-12">
<label class="form-label">{{ $t('word.port') }}</label>
</div>
@ -105,7 +112,7 @@
>
</div>
</div>
<div class="form-group columns">
<div v-if="!customizations.fileConnection" class="form-group columns">
<div class="column col-4 col-sm-12">
<label class="form-label">{{ $t('word.user') }}</label>
</div>
@ -118,7 +125,7 @@
>
</div>
</div>
<div class="form-group columns">
<div v-if="!customizations.fileConnection" class="form-group columns">
<div class="column col-4 col-sm-12">
<label class="form-label">{{ $t('word.password') }}</label>
</div>
@ -144,7 +151,15 @@
>
</div>
</div>
<div class="form-group columns">
<div v-if="customizations.readOnlyMode" class="form-group columns">
<div class="column col-4 col-sm-12" />
<div class="column col-8 col-sm-12">
<label class="form-checkbox form-inline">
<input v-model="connection.readonly" type="checkbox"><i class="form-icon" /> {{ $t('message.readOnlyMode') }}
</label>
</div>
</div>
<div v-if="!customizations.fileConnection" class="form-group columns">
<div class="column col-4 col-sm-12" />
<div class="column col-8 col-sm-12">
<label class="form-checkbox form-inline">
@ -369,15 +384,23 @@ export default {
},
data () {
return {
clients: [
{ name: 'MySQL', slug: 'mysql' },
{ name: 'MariaDB', slug: 'maria' },
{ name: 'PostgreSQL', slug: 'pg' },
{ name: 'SQLite', slug: 'sqlite' }
],
connection: {
name: '',
client: 'mysql',
host: '127.0.0.1',
database: null,
databasePath: '',
port: null,
user: null,
password: '',
ask: false,
readonly: false,
uid: uidGen('C'),
ssl: false,
cert: '',

View File

@ -11,6 +11,7 @@
<a class="tab-link">{{ $t('word.general') }}</a>
</li>
<li
v-if="customizations.sslConnection"
class="tab-item c-hand"
:class="{'active': selectedTab === 'ssl'}"
@click="selectTab('ssl')"
@ -18,6 +19,7 @@
<a class="tab-link">{{ $t('word.ssl') }}</a>
</li>
<li
v-if="customizations.sshConnection"
class="tab-item c-hand"
:class="{'active': selectedTab === 'ssh'}"
@click="selectTab('ssh')"
@ -49,19 +51,17 @@
</div>
<div class="column col-8 col-sm-12">
<select v-model="localConnection.client" class="form-select">
<option value="mysql">
MySQL
</option>
<option value="maria">
MariaDB
</option>
<option value="pg">
PostgreSQL
<option
v-for="client in clients"
:key="client.slug"
:value="client.slug"
>
{{ client.name }}
</option>
</select>
</div>
</div>
<div class="form-group columns">
<div v-if="!customizations.fileConnection" class="form-group columns">
<div class="column col-4 col-sm-12">
<label class="form-label">{{ $t('word.hostName') }}/IP</label>
</div>
@ -73,7 +73,20 @@
>
</div>
</div>
<div class="form-group columns">
<div v-if="customizations.fileConnection" class="form-group columns">
<div class="column col-4 col-sm-12">
<label class="form-label">{{ $t('word.database') }}</label>
</div>
<div class="column col-8 col-sm-12">
<BaseUploadInput
:value="localConnection.databasePath"
:message="$t('word.browse')"
@clear="pathClear('databasePath')"
@change="pathSelection($event, 'databasePath')"
/>
</div>
</div>
<div v-if="!customizations.fileConnection" class="form-group columns">
<div class="column col-4 col-sm-12">
<label class="form-label">{{ $t('word.port') }}</label>
</div>
@ -99,7 +112,7 @@
>
</div>
</div>
<div class="form-group columns">
<div v-if="!customizations.fileConnection" class="form-group columns">
<div class="column col-4 col-sm-12">
<label class="form-label">{{ $t('word.user') }}</label>
</div>
@ -112,7 +125,7 @@
>
</div>
</div>
<div class="form-group columns">
<div v-if="!customizations.fileConnection" class="form-group columns">
<div class="column col-4 col-sm-12">
<label class="form-label">{{ $t('word.password') }}</label>
</div>
@ -138,7 +151,15 @@
>
</div>
</div>
<div class="form-group columns">
<div v-if="customizations.readOnlyMode" class="form-group columns">
<div class="column col-4 col-sm-12" />
<div class="column col-8 col-sm-12">
<label class="form-checkbox form-inline">
<input v-model="localConnection.readonly" type="checkbox"><i class="form-icon" /> {{ $t('message.readOnlyMode') }}
</label>
</div>
</div>
<div v-if="!customizations.fileConnection" class="form-group columns">
<div class="column col-4 col-sm-12" />
<div class="column col-8 col-sm-12">
<label class="form-checkbox form-inline">
@ -374,6 +395,12 @@ export default {
},
data () {
return {
clients: [
{ name: 'MySQL', slug: 'mysql' },
{ name: 'MariaDB', slug: 'maria' },
{ name: 'PostgreSQL', slug: 'pg' },
{ name: 'SQLite', slug: 'sqlite' }
],
isConnecting: false,
isTesting: false,
isAsking: false,
@ -383,7 +410,7 @@ export default {
},
computed: {
customizations () {
return customizations[this.connection.client];
return customizations[this.localConnection.client];
},
isBusy () {
return this.isConnecting || this.isTesting;

View File

@ -13,6 +13,7 @@
<span class="workspace-explorebar-title">{{ connectionName }}</span>
<span v-if="workspace.connectionStatus === 'connected'" class="workspace-explorebar-tools">
<i
v-if="customizations.schemas"
class="mdi mdi-18px mdi-database-plus c-hand mr-2"
:title="$t('message.createNewSchema')"
@click="showNewDBModal"

View File

@ -10,6 +10,30 @@
>
<span class="d-flex"><i class="mdi mdi-18px mdi-play text-light pr-1" /> {{ $t('word.run') }}</span>
</div>
<div
v-if="selectedMisc.type === 'trigger' && customizations.triggerEnableDisable"
class="context-element"
@click="toggleTrigger"
>
<span v-if="!selectedMisc.enabled" class="d-flex">
<i class="mdi mdi-18px mdi-play text-light pr-1" /> {{ $t('word.enable') }}
</span>
<span v-else class="d-flex">
<i class="mdi mdi-18px mdi-pause text-light pr-1" /> {{ $t('word.disable') }}
</span>
</div>
<div
v-if="selectedMisc.type === 'scheduler'"
class="context-element"
@click="toggleScheduler"
>
<span v-if="!selectedMisc.enabled" class="d-flex">
<i class="mdi mdi-18px mdi-play text-light pr-1" /> {{ $t('word.enable') }}
</span>
<span v-else class="d-flex">
<i class="mdi mdi-18px mdi-pause text-light pr-1" /> {{ $t('word.disable') }}
</span>
</div>
<div class="context-element" @click="showDeleteModal">
<span class="d-flex"><i class="mdi mdi-18px mdi-table-remove text-light pr-1" /> {{ $t('word.delete') }}</span>
</div>
@ -18,17 +42,17 @@
@confirm="deleteMisc"
@hide="hideDeleteModal"
>
<template slot="header">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-delete mr-1" />
<span class="cut-text">{{ deleteMessage }}</span>
</div>
</template>
<div slot="body">
<template #body>
<div class="mb-2">
{{ $t('message.deleteCorfirm') }} "<b>{{ selectedMisc.name }}</b>"?
</div>
</div>
</template>
</ConfirmModal>
<ModalAskParameters
v-if="isAskingParameters"
@ -78,6 +102,9 @@ export default {
workspace () {
return this.getWorkspace(this.selectedWorkspace);
},
customizations () {
return this.getWorkspace(this.selectedWorkspace).customizations;
},
deleteMessage () {
switch (this.selectedMisc.type) {
case 'trigger':
@ -98,6 +125,8 @@ export default {
...mapActions({
addNotification: 'notifications/addNotification',
changeBreadcrumbs: 'workspaces/changeBreadcrumbs',
addLoadingElement: 'workspaces/addLoadingElement',
removeLoadingElement: 'workspaces/removeLoadingElement',
removeTabs: 'workspaces/removeTabs',
newTab: 'workspaces/newTab'
}),
@ -273,6 +302,68 @@ export default {
this.newTab({ uid: this.workspace.uid, content: sql, type: 'query', autorun: true });
this.closeContext();
},
async toggleTrigger () {
this.addLoadingElement({
name: this.selectedMisc.name,
schema: this.selectedSchema,
type: 'trigger'
});
try {
const { status, response } = await Triggers.toggleTrigger({
uid: this.selectedWorkspace,
schema: this.selectedSchema,
trigger: this.selectedMisc.name,
enabled: this.selectedMisc.enabled
});
if (status !== 'success')
this.addNotification({ status: 'error', message: response });
}
catch (err) {
this.addNotification({ status: 'error', message: err.stack });
}
this.removeLoadingElement({
name: this.selectedMisc.name,
schema: this.selectedSchema,
type: 'trigger'
});
this.closeContext();
this.$emit('reload');
},
async toggleScheduler () {
this.addLoadingElement({
name: this.selectedMisc.name,
schema: this.selectedSchema,
type: 'scheduler'
});
try {
const { status, response } = await Schedulers.toggleScheduler({
uid: this.selectedWorkspace,
schema: this.selectedSchema,
scheduler: this.selectedMisc.name,
enabled: this.selectedMisc.enabled
});
if (status !== 'success')
this.addNotification({ status: 'error', message: response });
}
catch (err) {
this.addNotification({ status: 'error', message: err.stack });
}
this.removeLoadingElement({
name: this.selectedMisc.name,
schema: this.selectedSchema,
type: 'scheduler'
});
this.closeContext();
this.$emit('reload');
}
}
};

View File

@ -9,7 +9,16 @@
<div v-if="isLoading" class="icon loading" />
<i v-else class="icon mdi mdi-18px mdi-chevron-right" />
<i class="database-icon mdi mdi-18px mdi-database mr-1" />
<span>{{ database.name }}</span>
<div class="">
<span>{{ database.name }}</span>
<div
v-if="database.size"
class="schema-size tooltip tooltip-left mr-1"
:data-tooltip="formatBytes(database.size)"
>
<i class="mdi mdi-information-outline pr-2" />
</div>
</div>
</summary>
<div class="accordion-body">
<div class="database-tables">
@ -34,7 +43,7 @@
<span v-html="highlightWord(table.name)" />
</a>
<div
v-if="table.type === 'table'"
v-if="table.type === 'table' && table.size !== false"
class="table-size tooltip tooltip-left mr-1"
:data-tooltip="formatBytes(table.size)"
>
@ -68,9 +77,17 @@
@contextmenu.prevent="showMiscContext($event, {...trigger, type: 'trigger'})"
>
<a class="table-name">
<i class="table-icon mdi mdi-table-cog mdi-18px mr-1" />
<div v-if="checkLoadingStatus(trigger.name, 'trigger')" class="icon loading mr-1" />
<i v-else class="table-icon mdi mdi-table-cog mdi-18px mr-1" />
<span v-html="highlightWord(trigger.name)" />
</a>
<div
v-if="trigger.enabled === false"
class="tooltip tooltip-left disabled-indicator"
:data-tooltip="$t('word.disabled')"
>
<i class="table-icon mdi mdi-pause mdi-18px mr-1" />
</div>
</li>
</ul>
</div>
@ -204,9 +221,17 @@
@contextmenu.prevent="showMiscContext($event, {...scheduler, type: 'scheduler'})"
>
<a class="table-name">
<i class="table-icon mdi mdi-calendar-clock mdi-18px mr-1" />
<div v-if="checkLoadingStatus(scheduler.name, 'scheduler')" class="icon loading mr-1" />
<i v-else class="table-icon mdi mdi-calendar-clock mdi-18px mr-1" />
<span v-html="highlightWord(scheduler.name)" />
</a>
<div
v-if="scheduler.enabled === false"
class="tooltip tooltip-left disabled-indicator"
:data-tooltip="$t('word.disabled')"
>
<i class="table-icon mdi mdi-pause mdi-18px mr-1" />
</div>
</li>
</ul>
</div>
@ -426,6 +451,11 @@ export default {
position: sticky;
top: 0;
z-index: 2;
.schema-size {
visibility: hidden;
width: 22.5px;
}
}
.database-name,
@ -471,6 +501,10 @@ export default {
.misc-name {
&:hover {
border-radius: $border-radius;
.schema-size {
visibility: visible;
}
}
}
@ -500,7 +534,9 @@ export default {
}
}
.table-size {
.schema-size,
.table-size,
.disabled-indicator {
position: absolute;
right: 0;
top: 0;

View File

@ -72,7 +72,11 @@
>
<span class="d-flex"><i class="mdi mdi-18px mdi-database-edit text-light pr-1" /> {{ $t('word.edit') }}</span>
</div>
<div class="context-element" @click="showDeleteModal">
<div
v-if="workspace.customizations.schemaDrop"
class="context-element"
@click="showDeleteModal"
>
<span class="d-flex"><i class="mdi mdi-18px mdi-database-remove text-light pr-1" /> {{ $t('word.delete') }}</span>
</div>
@ -81,17 +85,17 @@
@confirm="deleteSchema"
@hide="hideDeleteModal"
>
<template slot="header">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-database-remove mr-1" />
<span class="cut-text">{{ $t('message.deleteSchema') }}</span>
</div>
</template>
<div slot="body">
<template #body>
<div class="mb-2">
{{ $t('message.deleteCorfirm') }} "<b>{{ selectedSchema }}</b>"?
</div>
</div>
</template>
</ConfirmModal>
<ModalEditSchema
v-if="isEditModal"

View File

@ -40,33 +40,33 @@
@confirm="emptyTable"
@hide="hideEmptyModal"
>
<template slot="header">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-table-off mr-1" /> <span class="cut-text">{{ $t('message.emptyTable') }}</span>
</div>
</template>
<div slot="body">
<template #body>
<div class="mb-2">
{{ $t('message.emptyCorfirm') }} "<b>{{ selectedTable.name }}</b>"?
</div>
</div>
</template>
</ConfirmModal>
<ConfirmModal
v-if="isDeleteModal"
@confirm="deleteTable"
@hide="hideDeleteModal"
>
<template slot="header">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-table-remove mr-1" />
<span class="cut-text">{{ selectedTable.type === 'table' ? $t('message.deleteTable') : $t('message.deleteView') }}</span>
</div>
</template>
<div slot="body">
<template #body>
<div class="mb-2">
{{ $t('message.deleteCorfirm') }} "<b>{{ selectedTable.name }}</b>"?
</div>
</div>
</template>
</ConfirmModal>
</BaseContextMenu>
</template>

View File

@ -5,7 +5,7 @@
<div class="workspace-query-buttons">
<button
class="btn btn-primary btn-sm"
:disabled="!isChanged"
:disabled="!isChanged || !isValid"
:class="{'loading':isSaving}"
title="CTRL+S"
@click="saveChanges"
@ -242,6 +242,9 @@ export default {
JSON.stringify(this.originalKeyUsage) !== JSON.stringify(this.localKeyUsage) ||
JSON.stringify(this.originalIndexes) !== JSON.stringify(this.localIndexes) ||
JSON.stringify(this.tableOptions) !== JSON.stringify(this.localOptions);
},
isValid () {
return !!this.localFields.length && !!this.localOptions.name.trim().length;
}
},
watch: {
@ -287,7 +290,7 @@ export default {
changeBreadcrumbs: 'workspaces/changeBreadcrumbs'
}),
async saveChanges () {
if (this.isSaving) return;
if (this.isSaving || !this.isValid) return;
this.isSaving = true;
const params = {
@ -344,7 +347,7 @@ export default {
},
addField () {
this.localFields.push({
_id: uidGen(),
_antares_id: uidGen(),
name: `${this.$tc('word.field', 1)}_${++this.newFieldsCounter}`,
key: '',
type: this.workspace.dataTypes[0].types[0].name,
@ -385,8 +388,8 @@ export default {
});
},
duplicateField (uid) {
const fieldToClone = Object.assign({}, this.localFields.find(field => field._id === uid));
fieldToClone._id = uidGen();
const fieldToClone = Object.assign({}, this.localFields.find(field => field._antares_id === uid));
fieldToClone._antares_id = uidGen();
fieldToClone.name = `${fieldToClone.name}_copy`;
fieldToClone.order = this.localFields.length + 1;
this.localFields = [...this.localFields, fieldToClone];
@ -397,11 +400,11 @@ export default {
}, 20);
},
removeField (uid) {
this.localFields = this.localFields.filter(field => field._id !== uid);
this.localFields = this.localFields.filter(field => field._antares_id !== uid);
},
addNewIndex (payload) {
this.localIndexes = [...this.localIndexes, {
_id: uidGen(),
_antares_id: uidGen(),
name: payload.index === 'PRIMARY' ? 'PRIMARY' : payload.field,
fields: [payload.field],
type: payload.index,
@ -413,7 +416,7 @@ export default {
},
addToIndex (payload) {
this.localIndexes = this.localIndexes.map(index => {
if (index._id === payload.index) index.fields.push(payload.field);
if (index._antares_id === payload.index) index.fields.push(payload.field);
return index;
});
},

View File

@ -373,7 +373,7 @@ export default {
this.originalFunction = response;
this.originalFunction.parameters = [...this.originalFunction.parameters.map(param => {
param._id = uidGen();
param._antares_id = uidGen();
return param;
})];

View File

@ -6,13 +6,13 @@
@confirm="confirmParametersChange"
@hide="$emit('hide')"
>
<template :slot="'header'">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-dots-horizontal mr-1" />
<span class="cut-text">{{ $t('word.parameters') }} "{{ func }}"</span>
</div>
</template>
<div :slot="'body'">
<template #body>
<div class="columns col-gapless">
<div class="column col-5">
<div class="panel" :style="{ height: modalInnerHeight + 'px'}">
@ -36,10 +36,10 @@
<div ref="parametersPanel" class="panel-body p-0 pr-1">
<div
v-for="param in parametersProxy"
:key="param._id"
:key="param._antares_id"
class="tile tile-centered c-hand mb-1 p-1"
:class="{'selected-element': selectedParam === param._id}"
@click="selectParameter($event, param._id)"
:class="{'selected-element': selectedParam === param._antares_id}"
@click="selectParameter($event, param._antares_id)"
>
<div class="tile-icon">
<div>
@ -56,7 +56,7 @@
<button
class="btn btn-link remove-field p-0 mr-2"
:title="$t('word.delete')"
@click.prevent="removeParameter(param._id)"
@click.prevent="removeParameter(param._antares_id)"
>
<i class="mdi mdi-close" />
</button>
@ -167,7 +167,7 @@
</div>
</div>
</div>
</div>
</template>
</ConfirmModal>
</template>
@ -196,7 +196,7 @@ export default {
},
computed: {
selectedParamObj () {
return this.parametersProxy.find(param => param._id === this.selectedParam);
return this.parametersProxy.find(param => param._antares_id === this.selectedParam);
},
isChanged () {
return JSON.stringify(this.localParameters) !== JSON.stringify(this.parametersProxy);
@ -237,10 +237,11 @@ export default {
this.modalInnerHeight = modalBody.clientHeight - (parseFloat(getComputedStyle(modalBody).paddingTop) + parseFloat(getComputedStyle(modalBody).paddingBottom));
},
addParameter () {
const newUid = uidGen();
this.parametersProxy = [...this.parametersProxy, {
_id: uidGen(),
name: `Param${this.i++}`,
type: 'INT',
_antares_id: newUid,
name: `param${this.i++}`,
type: this.workspace.dataTypes[0].types[0].name,
context: 'IN',
length: ''
}];
@ -250,12 +251,13 @@ export default {
setTimeout(() => {
this.$refs.parametersPanel.scrollTop = this.$refs.parametersPanel.scrollHeight + 60;
this.selectedParam = newUid;
}, 20);
},
removeParameter (uid) {
this.parametersProxy = this.parametersProxy.filter(param => param._id !== uid);
this.parametersProxy = this.parametersProxy.filter(param => param._antares_id !== uid);
if (this.selectedParam === name && this.parametersProxy.length)
if (this.parametersProxy.length && this.selectedParam === uid)
this.resetSelectedID();
},
clearChanges () {
@ -266,7 +268,7 @@ export default {
this.resetSelectedID();
},
resetSelectedID () {
this.selectedParam = this.parametersProxy.length ? this.parametersProxy[0]._id : '';
this.selectedParam = this.parametersProxy.length ? this.parametersProxy[0]._antares_id : '';
}
}
};

View File

@ -318,7 +318,7 @@ export default {
this.originalRoutine = response;
this.originalRoutine.parameters = [...this.originalRoutine.parameters.map(param => {
param._id = uidGen();
param._antares_id = uidGen();
return param;
})];

View File

@ -6,13 +6,13 @@
@confirm="confirmParametersChange"
@hide="$emit('hide')"
>
<template :slot="'header'">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-dots-horizontal mr-1" />
<span class="cut-text">{{ $t('word.parameters') }} "{{ routine }}"</span>
</div>
</template>
<div :slot="'body'">
<template #body>
<div class="columns col-gapless">
<div class="column col-5">
<div class="panel" :style="{ height: modalInnerHeight + 'px'}">
@ -36,10 +36,10 @@
<div ref="parametersPanel" class="panel-body p-0 pr-1">
<div
v-for="param in parametersProxy"
:key="param._id"
:key="param._antares_id"
class="tile tile-centered c-hand mb-1 p-1"
:class="{'selected-element': selectedParam === param._id}"
@click="selectParameter($event, param._id)"
:class="{'selected-element': selectedParam === param._antares_id}"
@click="selectParameter($event, param._antares_id)"
>
<div class="tile-icon">
<div>
@ -56,7 +56,7 @@
<button
class="btn btn-link remove-field p-0 mr-2"
:title="$t('word.delete')"
@click.prevent="removeParameter(param._id)"
@click.prevent="removeParameter(param._antares_id)"
>
<i class="mdi mdi-close" />
</button>
@ -167,7 +167,7 @@
</div>
</div>
</div>
</div>
</template>
</ConfirmModal>
</template>
@ -196,7 +196,7 @@ export default {
},
computed: {
selectedParamObj () {
return this.parametersProxy.find(param => param._id === this.selectedParam);
return this.parametersProxy.find(param => param._antares_id === this.selectedParam);
},
isChanged () {
return JSON.stringify(this.localParameters) !== JSON.stringify(this.parametersProxy);
@ -237,8 +237,9 @@ export default {
this.modalInnerHeight = modalBody.clientHeight - (parseFloat(getComputedStyle(modalBody).paddingTop) + parseFloat(getComputedStyle(modalBody).paddingBottom));
},
addParameter () {
const newUid = uidGen();
this.parametersProxy = [...this.parametersProxy, {
_id: uidGen(),
_antares_id: newUid,
name: `param${this.i++}`,
type: this.workspace.dataTypes[0].types[0].name,
context: 'IN',
@ -250,12 +251,13 @@ export default {
setTimeout(() => {
this.$refs.parametersPanel.scrollTop = this.$refs.parametersPanel.scrollHeight + 60;
this.selectedParam = newUid;
}, 20);
},
removeParameter (uid) {
this.parametersProxy = this.parametersProxy.filter(param => param._id !== uid);
this.parametersProxy = this.parametersProxy.filter(param => param._antares_id !== uid);
if (this.selectedParam === name && this.parametersProxy.length)
if (this.parametersProxy.length && this.selectedParam === uid)
this.resetSelectedID();
},
clearChanges () {
@ -266,7 +268,7 @@ export default {
this.resetSelectedID();
},
resetSelectedID () {
this.selectedParam = this.parametersProxy.length ? this.parametersProxy[0]._id : '';
this.selectedParam = this.parametersProxy.length ? this.parametersProxy[0]._antares_id : '';
}
}
};

View File

@ -5,13 +5,13 @@
@confirm="confirmOptionsChange"
@hide="$emit('hide')"
>
<template :slot="'header'">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-timer mr-1" />
<span class="cut-text">{{ $t('word.timing') }} "{{ localOptions.name }}"</span>
</div>
</template>
<div :slot="'body'">
<template #body>
<form class="form-horizontal">
<div class="form-group">
<label class="form-label col-4">
@ -133,7 +133,7 @@
</div>
</div>
</form>
</div>
</template>
</ConfirmModal>
</template>

View File

@ -342,7 +342,7 @@ export default {
field.default = `'${field.default}'`;
}
return { ...field, _id: uidGen() };
return { ...field, _antares_id: uidGen() };
});
this.localFields = JSON.parse(JSON.stringify(this.originalFields));
}
@ -365,7 +365,7 @@ export default {
this.originalIndexes = Object.keys(indexesObj).map(index => {
return {
_id: uidGen(),
_antares_id: uidGen(),
name: index,
fields: indexesObj[index].map(field => field.column),
type: indexesObj[index][0].type,
@ -391,7 +391,7 @@ export default {
if (status === 'success') {
this.originalKeyUsage = response.map(foreign => {
return {
_id: uidGen(),
_antares_id: uidGen(),
...foreign
};
});
@ -411,25 +411,25 @@ export default {
this.isSaving = true;
// FIELDS
const originalIDs = this.originalFields.reduce((acc, curr) => [...acc, curr._id], []);
const localIDs = this.localFields.reduce((acc, curr) => [...acc, curr._id], []);
const originalIDs = this.originalFields.reduce((acc, curr) => [...acc, curr._antares_id], []);
const localIDs = this.localFields.reduce((acc, curr) => [...acc, curr._antares_id], []);
// Fields Additions
const additions = this.localFields.filter((field, i) => !originalIDs.includes(field._id)).map(field => {
const lI = this.localFields.findIndex(localField => localField._id === field._id);
const additions = this.localFields.filter((field, i) => !originalIDs.includes(field._antares_id)).map(field => {
const lI = this.localFields.findIndex(localField => localField._antares_id === field._antares_id);
const after = lI > 0 ? this.localFields[lI - 1].name : false;
return { ...field, after };
});
// Fields Deletions
const deletions = this.originalFields.filter(field => !localIDs.includes(field._id));
const deletions = this.originalFields.filter(field => !localIDs.includes(field._antares_id));
// Fields Changes
const changes = [];
this.originalFields.forEach((originalField, oI) => {
const lI = this.localFields.findIndex(localField => localField._id === originalField._id);
const originalSibling = oI > 0 ? this.originalFields[oI - 1]._id : false;
const localSibling = lI > 0 ? this.localFields[lI - 1]._id : false;
const lI = this.localFields.findIndex(localField => localField._antares_id === originalField._antares_id);
const originalSibling = oI > 0 ? this.originalFields[oI - 1]._antares_id : false;
const localSibling = lI > 0 ? this.localFields[lI - 1]._antares_id : false;
const after = lI > 0 ? this.localFields[lI - 1].name : false;
const orgName = originalField.name;
@ -450,15 +450,15 @@ export default {
changes: [],
deletions: []
};
const originalIndexIDs = this.originalIndexes.reduce((acc, curr) => [...acc, curr._id], []);
const localIndexIDs = this.localIndexes.reduce((acc, curr) => [...acc, curr._id], []);
const originalIndexIDs = this.originalIndexes.reduce((acc, curr) => [...acc, curr._antares_id], []);
const localIndexIDs = this.localIndexes.reduce((acc, curr) => [...acc, curr._antares_id], []);
// Index Additions
indexChanges.additions = this.localIndexes.filter(index => !originalIndexIDs.includes(index._id));
indexChanges.additions = this.localIndexes.filter(index => !originalIndexIDs.includes(index._antares_id));
// Index Changes
this.originalIndexes.forEach(originalIndex => {
const lI = this.localIndexes.findIndex(localIndex => localIndex._id === originalIndex._id);
const lI = this.localIndexes.findIndex(localIndex => localIndex._antares_id === originalIndex._antares_id);
if (JSON.stringify(originalIndex) !== JSON.stringify(this.localIndexes[lI])) {
if (this.localIndexes[lI]) {
indexChanges.changes.push({
@ -471,7 +471,7 @@ export default {
});
// Index Deletions
indexChanges.deletions = this.originalIndexes.filter(index => !localIndexIDs.includes(index._id));
indexChanges.deletions = this.originalIndexes.filter(index => !localIndexIDs.includes(index._antares_id));
// FOREIGN KEYS
const foreignChanges = {
@ -479,15 +479,15 @@ export default {
changes: [],
deletions: []
};
const originalForeignIDs = this.originalKeyUsage.reduce((acc, curr) => [...acc, curr._id], []);
const localForeignIDs = this.localKeyUsage.reduce((acc, curr) => [...acc, curr._id], []);
const originalForeignIDs = this.originalKeyUsage.reduce((acc, curr) => [...acc, curr._antares_id], []);
const localForeignIDs = this.localKeyUsage.reduce((acc, curr) => [...acc, curr._antares_id], []);
// Foreigns Additions
foreignChanges.additions = this.localKeyUsage.filter(foreign => !originalForeignIDs.includes(foreign._id));
foreignChanges.additions = this.localKeyUsage.filter(foreign => !originalForeignIDs.includes(foreign._antares_id));
// Foreigns Changes
this.originalKeyUsage.forEach(originalForeign => {
const lI = this.localKeyUsage.findIndex(localForeign => localForeign._id === originalForeign._id);
const lI = this.localKeyUsage.findIndex(localForeign => localForeign._antares_id === originalForeign._antares_id);
if (JSON.stringify(originalForeign) !== JSON.stringify(this.localKeyUsage[lI])) {
if (this.localKeyUsage[lI]) {
foreignChanges.changes.push({
@ -499,13 +499,19 @@ export default {
});
// Foreigns Deletions
foreignChanges.deletions = this.originalKeyUsage.filter(foreign => !localForeignIDs.includes(foreign._id));
foreignChanges.deletions = this.originalKeyUsage.filter(foreign => !localForeignIDs.includes(foreign._antares_id));
// ALTER
const params = {
uid: this.connection.uid,
schema: this.schema,
table: this.table,
tableStructure: {
name: this.localOptions.name,
fields: this.localFields,
foreigns: this.localKeyUsage,
indexes: this.localIndexes
},
additions,
changes,
deletions,
@ -555,7 +561,7 @@ export default {
},
addField () {
this.localFields.push({
_id: uidGen(),
_antares_id: uidGen(),
name: `${this.$tc('word.field', 1)}_${++this.newFieldsCounter}`,
key: '',
type: this.workspace.dataTypes[0].types[0].name,
@ -597,8 +603,8 @@ export default {
});
},
duplicateField (uid) {
const fieldToClone = Object.assign({}, this.localFields.find(field => field._id === uid));
fieldToClone._id = uidGen();
const fieldToClone = Object.assign({}, this.localFields.find(field => field._antares_id === uid));
fieldToClone._antares_id = uidGen();
fieldToClone.name = `${fieldToClone.name}_copy`;
fieldToClone.order = this.localFields.length + 1;
this.localFields = [...this.localFields, fieldToClone];
@ -609,11 +615,19 @@ export default {
}, 20);
},
removeField (uid) {
this.localFields = this.localFields.filter(field => field._id !== uid);
this.localFields = this.localFields.filter(field => field._antares_id !== uid);
this.localKeyUsage = this.localKeyUsage.filter(fk =>// Clear foreign keys
this.localFields.some(field => field.name === fk.field)
);
this.localIndexes = this.localIndexes.filter(index =>// Clear indexes
this.localFields.some(field =>
index.fields.includes(field.name)
)
);
},
addNewIndex (payload) {
this.localIndexes = [...this.localIndexes, {
_id: uidGen(),
_antares_id: uidGen(),
name: payload.index === 'PRIMARY' ? 'PRIMARY' : payload.field,
fields: [payload.field],
type: payload.index,
@ -625,7 +639,7 @@ export default {
},
addToIndex (payload) {
this.localIndexes = this.localIndexes.map(index => {
if (index._id === payload.index) index.fields.push(payload.field);
if (index._antares_id === payload.index) index.fields.push(payload.field);
return index;
});
},

View File

@ -27,7 +27,7 @@
:key="index.name"
class="context-element"
:class="{'disabled': index.fields.includes(selectedField.name)}"
@click="addToIndex(index._id)"
@click="addToIndex(index._antares_id)"
>
<span class="d-flex"><i class="mdi mdi-18px mdi-key column-key pr-1" :class="`key-${index.type}`" /> {{ index.name }}</span>
</div>

View File

@ -109,7 +109,7 @@
>
<TableRow
v-for="row in fields"
:key="row._id"
:key="row._antares_id"
:row="row"
:indexes="getIndexes(row.name)"
:foreigns="getForeigns(row.name)"
@ -217,15 +217,15 @@ export default {
this.resizeResults();
},
contextMenu (event, uid) {
this.selectedField = this.fields.find(field => field._id === uid);
this.selectedField = this.fields.find(field => field._antares_id === uid);
this.contextEvent = event;
this.isContext = true;
},
duplicateField () {
this.$emit('duplicate-field', this.selectedField._id);
this.$emit('duplicate-field', this.selectedField._antares_id);
},
removeField () {
this.$emit('remove-field', this.selectedField._id);
this.$emit('remove-field', this.selectedField._antares_id);
},
getIndexes (field) {
return this.indexes.reduce((acc, curr) => {

View File

@ -6,13 +6,13 @@
@confirm="confirmForeignsChange"
@hide="$emit('hide')"
>
<template :slot="'header'">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-key-link mr-1" />
<span class="cut-text">{{ $t('word.foreignKeys') }} "{{ table }}"</span>
</div>
</template>
<div :slot="'body'">
<template #body>
<div class="columns col-gapless">
<div class="column col-5">
<div class="panel" :style="{ height: modalInnerHeight + 'px'}">
@ -36,10 +36,10 @@
<div ref="indexesPanel" class="panel-body p-0 pr-1">
<div
v-for="foreign in foreignProxy"
:key="foreign._id"
:key="foreign._antares_id"
class="tile tile-centered c-hand mb-1 p-1"
:class="{'selected-element': selectedForeignID === foreign._id}"
@click="selectForeign($event, foreign._id)"
:class="{'selected-element': selectedForeignID === foreign._antares_id}"
@click="selectForeign($event, foreign._antares_id)"
>
<div class="tile-icon">
<div>
@ -68,7 +68,7 @@
<button
class="btn btn-link remove-field p-0 mr-2"
:title="$t('word.delete')"
@click.prevent="removeIndex(foreign._id)"
@click.prevent="removeIndex(foreign._antares_id)"
>
<i class="mdi mdi-close" />
</button>
@ -197,7 +197,7 @@
</div>
</div>
</div>
</div>
</template>
</ConfirmModal>
</template>
@ -238,7 +238,7 @@ export default {
},
computed: {
selectedForeignObj () {
return this.foreignProxy.find(foreign => foreign._id === this.selectedForeignID);
return this.foreignProxy.find(foreign => foreign._antares_id === this.selectedForeignID);
},
isChanged () {
return JSON.stringify(this.localKeyUsage) !== JSON.stringify(this.foreignProxy);
@ -288,8 +288,8 @@ export default {
},
addForeign () {
this.foreignProxy = [...this.foreignProxy, {
_id: uidGen(),
constraintName: `FK_${this.foreignProxy.length + 1}`,
_antares_id: uidGen(),
constraintName: `FK_${uidGen()}`,
refSchema: this.schema,
table: this.table,
refTable: '',
@ -307,19 +307,19 @@ export default {
}, 20);
},
removeIndex (id) {
this.foreignProxy = this.foreignProxy.filter(foreign => foreign._id !== id);
this.foreignProxy = this.foreignProxy.filter(foreign => foreign._antares_id !== id);
if (this.selectedForeignID === id && this.foreignProxy.length)
this.resetSelectedID();
},
clearChanges () {
this.foreignProxy = JSON.parse(JSON.stringify(this.localKeyUsage));
if (!this.foreignProxy.some(foreign => foreign._id === this.selectedForeignID))
if (!this.foreignProxy.some(foreign => foreign._antares_id === this.selectedForeignID))
this.resetSelectedID();
},
toggleField (field) {
this.foreignProxy = this.foreignProxy.map(foreign => {
if (foreign._id === this.selectedForeignID)
if (foreign._antares_id === this.selectedForeignID)
foreign.field = field;
return foreign;
@ -327,14 +327,14 @@ export default {
},
toggleRefField (field) {
this.foreignProxy = this.foreignProxy.map(foreign => {
if (foreign._id === this.selectedForeignID)
if (foreign._antares_id === this.selectedForeignID)
foreign.refField = field;
return foreign;
});
},
resetSelectedID () {
this.selectedForeignID = this.foreignProxy.length ? this.foreignProxy[0]._id : '';
this.selectedForeignID = this.foreignProxy.length ? this.foreignProxy[0]._antares_id : '';
},
async getRefFields () {
if (!this.selectedForeignObj.refTable) return;

View File

@ -6,13 +6,13 @@
@confirm="confirmIndexesChange"
@hide="$emit('hide')"
>
<template :slot="'header'">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-key mdi-rotate-45 mr-1" />
<span class="cut-text">{{ $t('word.indexes') }} "{{ table }}"</span>
</div>
</template>
<div :slot="'body'">
<template #body>
<div class="columns col-gapless">
<div class="column col-5">
<div class="panel" :style="{ height: modalInnerHeight + 'px'}">
@ -36,10 +36,10 @@
<div ref="indexesPanel" class="panel-body p-0 pr-1">
<div
v-for="index in indexesProxy"
:key="index._id"
:key="index._antares_id"
class="tile tile-centered c-hand mb-1 p-1"
:class="{'selected-element': selectedIndexID === index._id}"
@click="selectIndex($event, index._id)"
:class="{'selected-element': selectedIndexID === index._antares_id}"
@click="selectIndex($event, index._antares_id)"
>
<div class="tile-icon">
<div>
@ -56,7 +56,7 @@
<button
class="btn btn-link remove-field p-0 mr-2"
:title="$t('word.delete')"
@click.prevent="removeIndex(index._id)"
@click.prevent="removeIndex(index._antares_id)"
>
<i class="mdi mdi-close" />
</button>
@ -133,7 +133,7 @@
</div>
</div>
</div>
</div>
</template>
</ConfirmModal>
</template>
@ -163,7 +163,7 @@ export default {
},
computed: {
selectedIndexObj () {
return this.indexesProxy.find(index => index._id === this.selectedIndexID);
return this.indexesProxy.find(index => index._antares_id === this.selectedIndexID);
},
isChanged () {
return JSON.stringify(this.localIndexes) !== JSON.stringify(this.indexesProxy);
@ -200,7 +200,7 @@ export default {
},
addIndex () {
this.indexesProxy = [...this.indexesProxy, {
_id: uidGen(),
_antares_id: uidGen(),
name: 'NEW_INDEX',
fields: [],
type: 'INDEX',
@ -218,19 +218,19 @@ export default {
}, 20);
},
removeIndex (id) {
this.indexesProxy = this.indexesProxy.filter(index => index._id !== id);
this.indexesProxy = this.indexesProxy.filter(index => index._antares_id !== id);
if (this.selectedIndexID === id && this.indexesProxy.length)
this.resetSelectedID();
},
clearChanges () {
this.indexesProxy = JSON.parse(JSON.stringify(this.localIndexes));
if (!this.indexesProxy.some(index => index._id === this.selectedIndexID))
if (!this.indexesProxy.some(index => index._antares_id === this.selectedIndexID))
this.resetSelectedID();
},
toggleField (field) {
this.indexesProxy = this.indexesProxy.map(index => {
if (index._id === this.selectedIndexID) {
if (index._antares_id === this.selectedIndexID) {
if (index.fields.includes(field))
index.fields = index.fields.filter(f => f !== field);
else
@ -240,7 +240,7 @@ export default {
});
},
resetSelectedID () {
this.selectedIndexID = this.indexesProxy.length ? this.indexesProxy[0]._id : '';
this.selectedIndexID = this.indexesProxy.length ? this.indexesProxy[0]._antares_id : '';
}
}
};

View File

@ -1,5 +1,5 @@
<template>
<div class="tr" @contextmenu.prevent="$emit('contextmenu', $event, localRow._id)">
<div class="tr" @contextmenu.prevent="$emit('contextmenu', $event, localRow._antares_id)">
<div class="td p-0" tabindex="0">
<div :class="customizations.sortableFields ? 'row-draggable' : 'text-center'">
<i v-if="customizations.sortableFields" class="mdi mdi-drag-horizontal row-draggable-icon" />
@ -99,6 +99,9 @@
<span v-if="localRow.enumValues">
{{ localRow.enumValues }}
</span>
<span v-else-if="localRow.numScale">
{{ localLength }}, {{ localRow.numScale }}
</span>
<span v-else>
{{ localLength }}
</span>
@ -112,6 +115,16 @@
class="editable-field form-input input-sm px-1"
@blur="editOFF"
>
<input
v-else-if="fieldType.scale"
ref="editField"
v-model="editingContent"
type="text"
autofocus
class="editable-field form-input input-sm px-1"
@keypress="checkLengthScale"
@blur="editOFF"
>
<input
v-else
ref="editField"
@ -230,13 +243,13 @@
@confirm="editOFF"
@hide="hideDefaultModal"
>
<template :slot="'header'">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-playlist-edit mr-1" />
<span class="cut-text">{{ $t('word.default') }} "{{ row.name }}"</span>
</div>
</template>
<div :slot="'body'">
<template #body>
<form class="form-horizontal">
<div class="mb-2">
<label class="form-radio form-inline">
@ -324,7 +337,7 @@
</div>
</div>
</form>
</div>
</template>
</ConfirmModal>
</div>
</template>
@ -367,7 +380,8 @@ export default {
getWorkspace: 'workspaces/getWorkspace'
}),
localLength () {
return this.localRow.numLength || this.localRow.charLength || this.localRow.datePrecision || this.localRow.numPrecision || 0;
const localLength = this.localRow.numLength || this.localRow.charLength || this.localRow.datePrecision || this.localRow.numPrecision || 0;
return localLength === true ? null : localLength;
},
fieldType () {
const fieldType = this.dataTypes.reduce((acc, group) => [...acc, ...group.types], []).filter(type =>
@ -391,7 +405,7 @@ export default {
return this.indexes.some(index => ['PRIMARY', 'UNIQUE'].includes(index.type));
},
isNullable () {
return !this.indexes.some(index => ['PRIMARY'].includes(index.type));
return this.customizations.nullablePrimary || !this.indexes.some(index => ['PRIMARY'].includes(index.type));
},
isInDataTypes () {
let typeNames = [];
@ -479,6 +493,11 @@ export default {
this.editingContent = this.localRow.enumValues;
this.originalContent = this.localRow.enumValues;
}
else if (this.fieldType.scale && field === 'length') {
const scale = this.localRow.numScale !== null ? this.localRow.numScale : 0;
this.editingContent = `${content}, ${scale}`;
this.originalContent = `${content}, ${scale}`;
}
else {
this.editingContent = content;
this.originalContent = content;
@ -501,10 +520,17 @@ export default {
if (this.editingField === 'name')
this.$emit('rename-field', { old: this.localRow[this.editingField], new: this.editingContent });
this.localRow[this.editingField] = this.editingContent;
if (this.editingField === 'numLength' && this.fieldType.scale) {
const [length, scale] = this.editingContent.split(',');
this.localRow.numLength = +length;
this.localRow.numScale = scale ? +scale : null;
}
else
this.localRow[this.editingField] = this.editingContent;
if (this.editingField === 'type' && this.editingContent !== this.originalContent) {
this.localRow.numLength = null;
this.localRow.numScale = null;
this.localRow.charLength = null;
this.localRow.datePrecision = null;
this.localRow.enumValues = '';
@ -559,6 +585,15 @@ export default {
this.originalContent = null;
this.editingField = null;
},
checkLengthScale (e) {
e = (e) || window.event;
const charCode = (e.which) ? e.which : e.keyCode;
if (((charCode > 31 && (charCode < 48 || charCode > 57)) && charCode !== 44) || (charCode === 44 && e.target.value.includes(',')))
e.preventDefault();
else
return true;
},
hideDefaultModal () {
this.isDefaultModal = false;
}

View File

@ -238,7 +238,7 @@ export default {
this.originalFunction = response;
this.originalFunction.parameters = [...this.originalFunction.parameters.map(param => {
param._id = uidGen();
param._antares_id = uidGen();
return param;
})];

View File

@ -4,6 +4,7 @@
class="workspace-query-tab column col-12 columns col-gapless no-outline p-0"
tabindex="0"
@keydown.116="runQuery(query)"
@keydown.75="killTabQuery"
@keydown.ctrl.alt.87="clear"
@keydown.ctrl.66="beautify"
@keydown.ctrl.71="openHistoryModal"
@ -22,15 +23,46 @@
<div ref="resizer" class="query-area-resizer" />
<div class="workspace-query-runner-footer">
<div class="workspace-query-buttons">
<div @mouseenter="setCancelButtonVisibility(true)" @mouseleave="setCancelButtonVisibility(false)">
<button
v-if="showCancel && isQuering"
class="btn btn-primary btn-sm cancellable"
:disabled="!query"
:title="$t('word.cancel')"
@click="killTabQuery()"
>
<i class="mdi mdi-24px mdi-window-close" />
<span class="d-invisible pr-1">{{ $t('word.run') }}</span>
</button>
<button
v-else
class="btn btn-primary btn-sm"
:class="{'loading':isQuering}"
:disabled="!query"
title="F5"
@click="runQuery(query)"
>
<i class="mdi mdi-24px mdi-play pr-1" />
<span>{{ $t('word.run') }}</span>
</button>
</div>
<button
class="btn btn-primary btn-sm"
v-if="!autocommit"
class="btn btn-dark btn-sm"
:class="{'loading':isQuering}"
:disabled="!query"
title="F5"
@click="runQuery(query)"
@click="commitTab()"
>
<i class="mdi mdi-24px mdi-play pr-1" />
<span>{{ $t('word.run') }}</span>
<i class="mdi mdi-24px mdi-cube-send pr-1" />
<span>{{ $t('word.commit') }}</span>
</button>
<button
v-if="!autocommit"
class="btn btn-dark btn-sm"
:class="{'loading':isQuering}"
@click="rollbackTab()"
>
<i class="mdi mdi-24px mdi-undo-variant pr-1" />
<span>{{ $t('word.rollback') }}</span>
</button>
<button
class="btn btn-link btn-sm mr-0"
@ -64,7 +96,7 @@
</button>
<div class="dropdown table-dropdown pr-2">
<button
:disabled="!results.length || isQuering"
:disabled="!hasResults || isQuering"
class="btn btn-dark btn-sm dropdown-toggle mr-0 pr-0"
tabindex="0"
>
@ -81,6 +113,17 @@
</li>
</ul>
</div>
<div class="input-group pr-2" :title="$t('message.commitMode')">
<i class="input-group-addon addon-sm mdi mdi-24px mdi-source-commit p-0" />
<select v-model="autocommit" class="form-select select-sm text-bold">
<option :value="true">
{{ $t('message.autoCommit') }}
</option>
<option :value="false">
{{ $t('message.manualCommit') }}
</option>
</select>
</div>
</div>
<div class="workspace-query-info">
<div
@ -90,11 +133,19 @@
>
<i class="mdi mdi-timer-sand mdi-rotate-180 pr-1" /> <b>{{ durationsCount / 1000 }}s</b>
</div>
<div v-if="resultsCount">
{{ $t('word.results') }}: <b>{{ resultsCount.toLocaleString() }}</b>
<div
v-if="resultsCount"
class="d-flex"
:title="$t('word.results')"
>
<i class="mdi mdi-equal pr-1" /> <b>{{ resultsCount.toLocaleString() }}</b>
</div>
<div v-if="affectedCount">
{{ $t('message.affectedRows') }}: <b>{{ affectedCount }}</b>
<div
v-if="hasAffected"
class="d-flex"
:title="$t('message.affectedRows')"
>
<i class="mdi mdi-target pr-1" /> <b>{{ affectedCount }}</b>
</div>
<div class="input-group" :title="$t('word.schema')">
<i class="input-group-addon addon-sm mdi mdi-24px mdi-database" />
@ -110,7 +161,7 @@
</div>
</div>
</div>
<WorkspaceTabQueryEmptyState v-if="!results.length && !isQuering" />
<WorkspaceTabQueryEmptyState v-if="!results.length && !isQuering" :customizations="workspace.customizations" />
<div class="workspace-query-results p-relative column col-12">
<BaseLoader v-if="isQuering" />
<WorkspaceTabQueryTable
@ -166,11 +217,14 @@ export default {
query: '',
lastQuery: '',
isQuering: false,
isCancelling: false,
showCancel: false,
autocommit: true,
results: [],
selectedSchema: null,
resultsCount: 0,
durationsCount: 0,
affectedCount: 0,
affectedCount: null,
editorHeight: 200,
isHistoryOpen: false
};
@ -184,6 +238,9 @@ export default {
workspace () {
return this.getWorkspace(this.connection.uid);
},
tabUid () {
return this.$vnode.key;
},
breadcrumbsSchema () {
return this.workspace.breadcrumbs.schema || null;
},
@ -198,12 +255,23 @@ export default {
},
history () {
return this.getHistoryByWorkspace(this.connection.uid) || [];
},
hasResults () {
return this.results.length && this.results[0].rows;
},
hasAffected () {
return this.affectedCount || (!this.resultsCount && this.affectedCount !== null);
}
},
watch: {
isSelected (val) {
if (val)
if (val) {
this.changeBreadcrumbs({ schema: this.selectedSchema, query: `Query #${this.tab.index}` });
setTimeout(() => {
if (this.$refs.queryEditor)
this.$refs.queryEditor.editor.focus();
}, 0);
}
},
selectedSchema () {
this.changeBreadcrumbs({ schema: this.selectedSchema, query: `Query #${this.tab.index}` });
@ -230,12 +298,18 @@ export default {
},
beforeDestroy () {
window.removeEventListener('keydown', this.onKey);
const params = {
uid: this.connection.uid,
tabUid: this.tab.uid
};
Schema.destroyConnectionToCommit(params);
},
methods: {
...mapActions({
addNotification: 'notifications/addNotification',
changeBreadcrumbs: 'workspaces/changeBreadcrumbs',
updateTabContent: 'workspaces/updateTabContent',
setUnsavedChanges: 'workspaces/setUnsavedChanges',
saveHistory: 'history/saveHistory'
}),
async runQuery (query) {
@ -248,6 +322,8 @@ export default {
const params = {
uid: this.connection.uid,
schema: this.selectedSchema,
tabUid: this.tab.uid,
autocommit: this.autocommit,
query
};
@ -255,9 +331,14 @@ export default {
if (status === 'success') {
this.results = Array.isArray(response) ? response : [response];
this.resultsCount += this.results.reduce((acc, curr) => acc + (curr.rows ? curr.rows.length : 0), 0);
this.durationsCount += this.results.reduce((acc, curr) => acc + curr.duration, 0);
this.affectedCount += this.results.reduce((acc, curr) => acc + (curr.report ? curr.report.affectedRows : 0), 0);
this.resultsCount = this.results.reduce((acc, curr) => acc + (curr.rows ? curr.rows.length : 0), 0);
this.durationsCount = this.results.reduce((acc, curr) => acc + curr.duration, 0);
this.affectedCount = this.results
.filter(result => result.report !== null)
.reduce((acc, curr) => {
if (acc === null) acc = 0;
return acc + (curr.report ? curr.report.affectedRows : 0);
}, null);
this.updateTabContent({
uid: this.connection.uid,
@ -267,6 +348,8 @@ export default {
content: query
});
this.saveHistory(params);
if (!this.autocommit)
this.setUnsavedChanges({ uid: this.connection.uid, tUid: this.tabUid, isChanged: true });
}
else
this.addNotification({ status: 'error', message: response });
@ -278,6 +361,29 @@ export default {
this.isQuering = false;
this.lastQuery = query;
},
async killTabQuery () {
if (this.isCancelling) return;
this.isCancelling = true;
try {
const params = {
uid: this.connection.uid,
tabUid: this.tab.uid
};
await Schema.killTabQuery(params);
}
catch (err) {
this.addNotification({ status: 'error', message: err.stack });
}
this.isCancelling = false;
},
setCancelButtonVisibility (val) {
if (this.workspace.customizations.cancelQueries)
this.showCancel = val;
},
reloadTable () {
this.runQuery(this.lastQuery);
},
@ -285,7 +391,7 @@ export default {
this.results = [];
this.resultsCount = 0;
this.durationsCount = 0;
this.affectedCount = 0;
this.affectedCount = null;
},
resize (e) {
const el = this.$refs.queryEditor.$el;
@ -341,6 +447,42 @@ export default {
},
downloadTable (format) {
this.$refs.queryTable.downloadTable(format, `${this.tab.type}-${this.tab.index}`);
},
async commitTab () {
this.isQuering = true;
try {
const params = {
uid: this.connection.uid,
tabUid: this.tab.uid
};
await Schema.commitTab(params);
this.setUnsavedChanges({ uid: this.connection.uid, tUid: this.tabUid, isChanged: false });
this.addNotification({ status: 'success', message: this.$t('message.actionSuccessful', { action: 'COMMIT' }) });
}
catch (err) {
this.addNotification({ status: 'error', message: err.stack });
}
this.isQuering = false;
},
async rollbackTab () {
this.isQuering = true;
try {
const params = {
uid: this.connection.uid,
tabUid: this.tab.uid
};
await Schema.rollbackTab(params);
this.setUnsavedChanges({ uid: this.connection.uid, tUid: this.tabUid, isChanged: false });
this.addNotification({ status: 'success', message: this.$t('message.actionSuccessful', { action: 'ROLLBACK' }) });
}
catch (err) {
this.addNotification({ status: 'error', message: err.stack });
}
this.isQuering = false;
}
}
};
@ -369,10 +511,12 @@ export default {
.workspace-query-runner-footer {
display: flex;
flex-wrap: wrap;
row-gap: 0.4rem;
justify-content: space-between;
padding: 0.3rem 0.6rem 0.4rem;
align-items: center;
height: 42px;
min-height: 42px;
.workspace-query-buttons,
.workspace-query-info {

View File

@ -5,6 +5,9 @@
<div class="mb-4">
{{ $t('message.runQuery') }}
</div>
<div v-if="customizations.cancelQueries" class="mb-4">
{{ $t('message.killQuery') }}
</div>
<div class="mb-4">
{{ $t('word.format') }}
</div>
@ -25,6 +28,9 @@
<div class="mb-4">
<code>F5</code>
</div>
<div v-if="customizations.cancelQueries" class="mb-4">
<code>CTRL</code> + <code>K</code>
</div>
<div class="mb-4">
<code>CTRL</code> + <code>B</code>
</div>
@ -47,7 +53,10 @@
<script>
export default {
name: 'WorkspaceTabQueryEmptyState'
name: 'WorkspaceTabQueryEmptyState',
props: {
customizations: Object
}
};
</script>

View File

@ -5,7 +5,7 @@
tabindex="0"
:style="{'height': resultsSize+'px'}"
@keyup.46="showDeleteConfirmModal"
@keydown.ctrl.65="selectAllRows"
@keydown.ctrl.65="selectAllRows($event)"
@keydown.esc="deselectRows"
>
<TableContext
@ -53,6 +53,7 @@
class="mdi sort-icon"
:class="currentSortDir === 'asc' ? 'mdi-sort-ascending':'mdi-sort-descending'"
/>
<i v-else class="mdi sort-icon mdi-minus d-invisible" />
</div>
</div>
</div>
@ -62,7 +63,7 @@
v-if="resultsWithRows[resultsetIndex] && resultsWithRows[resultsetIndex].rows"
ref="resultTable"
:items="sortedResults"
:item-height="22"
:item-height="rowHeight"
class="tbody"
:visible-height="resultsSize"
:scroll-element="scrollElement"
@ -70,13 +71,14 @@
<template slot-scope="{ items }">
<WorkspaceTabQueryTableRow
v-for="row in items"
:key="row._id"
:key="row._antares_id"
:item-height="rowHeight"
:row="row"
:fields="fieldsObj"
:key-usage="keyUsage"
:element-type="elementType"
:class="{'selected': selectedRows.includes(row._id)}"
@select-row="selectRow($event, row._id)"
:class="{'selected': selectedRows.includes(row._antares_id)}"
@select-row="selectRow($event, row._antares_id)"
@update-field="updateField($event, row)"
@contextmenu="contextMenu"
/>
@ -89,17 +91,17 @@
@confirm="deleteSelected"
@hide="hideDeleteConfirmModal"
>
<template :slot="'header'">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-delete mr-1" />
<span class="cut-text">{{ $tc('message.deleteRows', selectedRows.length) }}</span>
</div>
</template>
<div :slot="'body'">
<template #body>
<div class="mb-2">
{{ $tc('message.confirmToDeleteRows', selectedRows.length) }}
</div>
</div>
</template>
</ConfirmModal>
</div>
</template>
@ -142,7 +144,8 @@ export default {
currentSort: '',
currentSortDir: 'asc',
resultsetIndex: 0,
scrollElement: null
scrollElement: null,
rowHeight: 23
};
},
computed: {
@ -196,7 +199,7 @@ export default {
if (this.sortedResults.length) {
const fieldsObj = {};
for (const key in this.sortedResults[0]) {
if (key === '_id') continue;
if (key === '_antares_id') continue;
const fieldObj = this.fields.find(field => {
let fieldNames = [
@ -242,6 +245,11 @@ export default {
if (this.$refs.tableWrapper)
this.scrollElement = this.$refs.tableWrapper;
document.querySelectorAll('.column-resizable').forEach(element => {
if (element.clientWidth !== 0)
element.style.width = element.clientWidth + 'px';
});
},
mounted () {
window.addEventListener('resize', this.resizeResults);
@ -272,6 +280,7 @@ export default {
fieldLength (field) {
if ([...BLOB, ...LONG_TEXT].includes(field.type)) return null;
else if (TEXT.includes(field.type)) return field.charLength;
else if (field.numScale) return `${field.numPrecision}, ${field.numScale}`;
return field.length;
},
keyName (key) {
@ -310,7 +319,7 @@ export default {
setLocalResults () {
this.localResults = this.resultsWithRows[this.resultsetIndex] && this.resultsWithRows[this.resultsetIndex].rows
? this.resultsWithRows[this.resultsetIndex].rows.map(item => {
return { ...item, _id: uidGen() };
return { ...item, _antares_id: uidGen() };
})
: [];
},
@ -330,7 +339,7 @@ export default {
this.resizeResults();
},
updateField (payload, row) {
const orgRow = this.localResults.find(lr => lr._id === row._id);
const orgRow = this.localResults.find(lr => lr._antares_id === row._antares_id);
Object.keys(orgRow).forEach(key => { // remap the row
if (orgRow[key] instanceof Date && moment(orgRow[key]).isValid()) { // if datetime
@ -367,8 +376,8 @@ export default {
},
deleteSelected () {
this.closeContext();
const rows = JSON.parse(JSON.stringify(this.localResults)).filter(row => this.selectedRows.includes(row._id)).map(row => {
delete row._id;
const rows = JSON.parse(JSON.stringify(this.localResults)).filter(row => this.selectedRows.includes(row._antares_id)).map(row => {
delete row._antares_id;
return row;
});
@ -381,7 +390,7 @@ export default {
this.$emit('delete-selected', params);
},
setNull () {
const row = this.localResults.find(row => this.selectedRows.includes(row._id));
const row = this.localResults.find(row => this.selectedRows.includes(row._antares_id));
const params = {
primary: this.primaryField.name,
@ -396,19 +405,22 @@ export default {
this.$emit('update-field', params);
},
copyCell () {
const row = this.localResults.find(row => this.selectedRows.includes(row._id));
const row = this.localResults.find(row => this.selectedRows.includes(row._antares_id));
const cellName = Object.keys(row).find(prop => [
this.selectedCell.field,
this.selectedCell.orgField,
`${this.fields[0].table}.${this.selectedCell.field}`,
`${this.fields[0].tableAlias}.${this.selectedCell.field}`
].includes(prop));
const valueToCopy = row[cellName];
let valueToCopy = row[cellName];
if (typeof valueToCopy === 'object')
valueToCopy = JSON.stringify(valueToCopy);
navigator.clipboard.writeText(valueToCopy);
},
copyRow () {
const row = this.localResults.find(row => this.selectedRows.includes(row._id));
const row = this.localResults.find(row => this.selectedRows.includes(row._antares_id));
const rowToCopy = JSON.parse(JSON.stringify(row));
delete rowToCopy._id;
delete rowToCopy._antares_id;
navigator.clipboard.writeText(JSON.stringify(rowToCopy));
},
applyUpdate (params) {
@ -435,24 +447,26 @@ export default {
this.selectedRows.push(row);
else {
const lastID = this.selectedRows.slice(-1)[0];
const lastIndex = this.sortedResults.findIndex(el => el._id === lastID);
const clickedIndex = this.sortedResults.findIndex(el => el._id === row);
const lastIndex = this.sortedResults.findIndex(el => el._antares_id === lastID);
const clickedIndex = this.sortedResults.findIndex(el => el._antares_id === row);
if (lastIndex > clickedIndex) {
for (let i = clickedIndex; i < lastIndex; i++)
this.selectedRows.push(this.sortedResults[i]._id);
this.selectedRows.push(this.sortedResults[i]._antares_id);
}
else if (lastIndex < clickedIndex) {
for (let i = clickedIndex; i > lastIndex; i--)
this.selectedRows.push(this.sortedResults[i]._id);
this.selectedRows.push(this.sortedResults[i]._antares_id);
}
}
}
else
this.selectedRows = [row];
},
selectAllRows () {
selectAllRows (e) {
if (e.target.classList.contains('editable-field')) return;
this.selectedRows = this.localResults.reduce((acc, curr) => {
acc.push(curr._id);
acc.push(curr._antares_id);
return acc;
}, []);
},
@ -501,7 +515,7 @@ export default {
if (!this.sortedResults) return;
const rows = JSON.parse(JSON.stringify(this.sortedResults)).map(row => {
delete row._id;
delete row._antares_id;
return row;
});

View File

@ -61,8 +61,6 @@ export default {
selectedRows: Array,
selectedCell: Object
},
computed: {
},
methods: {
showConfirmModal () {
this.$emit('show-delete-modal');

View File

@ -1,14 +1,18 @@
<template>
<div class="tr" @click="selectRow($event, row._id)">
<div
class="tr"
:style="{height: itemHeight+'px'}"
@click="selectRow($event, row._antares_id)"
>
<div
v-for="(col, cKey) in row"
v-show="cKey !== '_id'"
v-show="cKey !== '_antares_id'"
:key="cKey"
class="td p-0"
tabindex="0"
@contextmenu.prevent="openContext($event, { id: row._id, field: cKey })"
@contextmenu.prevent="openContext($event, { id: row._antares_id, orgField: cKey })"
>
<template v-if="cKey !== '_id'">
<template v-if="cKey !== '_antares_id'">
<span
v-if="!isInlineEditor[cKey] && fields[cKey]"
class="cell-content"
@ -72,12 +76,12 @@
@confirm="editOFF"
@hide="hideEditorModal"
>
<template :slot="'header'">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-playlist-edit mr-1" /> <span class="cut-text">{{ $t('word.edit') }} "{{ editingField }}"</span>
</div>
</template>
<div :slot="'body'">
<template #body>
<div class="mb-2">
<div>
<TextEditor
@ -96,23 +100,12 @@
v-model="editorMode"
class="form-select select-sm"
>
<option value="text">
TEXT
</option>
<option value="html">
HTML
</option>
<option value="xml">
XML
</option>
<option value="json">
JSON
</option>
<option value="svg">
SVG
</option>
<option value="yaml">
YAML
<option
v-for="language in availableLanguages"
:key="language.slug"
:value="language.slug"
>
{{ language.name }}
</option>
</select>
</div>
@ -128,7 +121,22 @@
</div>
</div>
</div>
</div>
</template>
</ConfirmModal>
<ConfirmModal
v-if="isMapModal"
:hide-footer="true"
size="medium"
@hide="hideEditorModal"
>
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-map mr-1" /> <span class="cut-text">"{{ editingField }}"</span>
</div>
</template>
<template #body>
<BaseMap :points="editingContent" :is-multi-spatial="isMultiSpatial" />
</template>
</ConfirmModal>
<ConfirmModal
v-if="isBlobEditor"
@ -136,13 +144,13 @@
@confirm="editOFF"
@hide="hideEditorModal"
>
<template :slot="'header'">
<template #header>
<div class="d-flex">
<i class="mdi mdi-24px mdi-playlist-edit mr-1" />
<span class="cut-text">{{ $t('word.edit') }} "{{ editingField }}"</span>
</div>
</template>
<div :slot="'body'">
<template #body>
<div class="mb-2">
<transition name="jump-down">
<div v-if="contentInfo.size">
@ -182,21 +190,39 @@
>
</div>
</div>
</div>
</template>
</ConfirmModal>
</div>
</template>
<script>
import moment from 'moment';
import { ModelOperations } from '@vscode/vscode-languagedetection';
import { mimeFromHex } from 'common/libs/mimeFromHex';
import { formatBytes } from 'common/libs/formatBytes';
import { bufferToBase64 } from 'common/libs/bufferToBase64';
import hexToBinary from 'common/libs/hexToBinary';
import { TEXT, LONG_TEXT, ARRAY, TEXT_SEARCH, NUMBER, FLOAT, BOOLEAN, DATE, TIME, DATETIME, BLOB, BIT, HAS_TIMEZONE } from 'common/fieldTypes';
import {
TEXT,
LONG_TEXT,
ARRAY,
TEXT_SEARCH,
NUMBER,
FLOAT,
BOOLEAN,
DATE,
TIME,
DATETIME,
BLOB,
BIT,
HAS_TIMEZONE,
SPATIAL,
IS_MULTI_SPATIAL
} from 'common/fieldTypes';
import { VueMaskDirective } from 'v-mask';
import ConfirmModal from '@/components/BaseConfirmModal';
import TextEditor from '@/components/BaseTextEditor';
import BaseMap from '@/components/BaseMap';
import ForeignKeySelect from '@/components/ForeignKeySelect';
export default {
@ -204,7 +230,8 @@ export default {
components: {
ConfirmModal,
TextEditor,
ForeignKeySelect
ForeignKeySelect,
BaseMap
},
directives: {
mask: VueMaskDirective
@ -254,13 +281,17 @@ export default {
return val;
}
return val;
if (SPATIAL.includes(type))
return val;
return typeof val === 'object' ? JSON.stringify(val) : val;
}
},
props: {
row: Object,
fields: Object,
keyUsage: Array,
itemHeight: Number,
elementType: { type: String, default: 'table' }
},
data () {
@ -268,6 +299,8 @@ export default {
isInlineEditor: {},
isTextareaEditor: false,
isBlobEditor: false,
isMapModal: false,
isMultiSpatial: false,
willBeDeleted: false,
originalContent: null,
editingContent: null,
@ -280,7 +313,17 @@ export default {
mime: '',
size: null
},
fileToUpload: null
fileToUpload: null,
availableLanguages: [
{ name: 'TEXT', slug: 'text', id: 'text' },
{ name: 'HTML', slug: 'html', id: 'html' },
{ name: 'XML', slug: 'xml', id: 'xml' },
{ name: 'JSON', slug: 'json', id: 'json' },
{ name: 'SVG', slug: 'svg', id: 'svg' },
{ name: 'INI', slug: 'ini', id: 'ini' },
{ name: 'MARKDOWN', slug: 'markdown', id: 'md' },
{ name: 'YAML', slug: 'yaml', id: 'yaml' }
]
};
},
computed: {
@ -326,6 +369,9 @@ export default {
if (BOOLEAN.includes(this.editingType))
return { type: 'boolean', mask: false };
if (SPATIAL.includes(this.editingType))
return { type: 'map', mask: false };
return { type: 'text', mask: false };
},
isImage () {
@ -362,6 +408,21 @@ export default {
Object.keys(this.fields).forEach(field => {
this.isInlineEditor[field.name] = false;
});
},
isTextareaEditor (val) {
if (val) {
const modelOperations = new ModelOperations();
(async () => {
const detected = await modelOperations.runModel(this.editingContent);
const filteredLanguages = detected.filter(dLang =>
this.availableLanguages.some(aLang => aLang.id === dLang.languageId) &&
dLang.confidence > 0.1
);
if (filteredLanguages.length)
this.editorMode = this.availableLanguages.find(lang => lang.id === filteredLanguages[0].languageId).slug;
})();
}
}
},
methods: {
@ -383,7 +444,7 @@ export default {
return bufferToBase64(val);
},
editON (event, content, field) {
if (!this.isEditable) return;
if (!this.isEditable || this.editingType === 'none') return;
window.addEventListener('keydown', this.onKey);
@ -399,6 +460,15 @@ export default {
return;
}
if (SPATIAL.includes(type)) {
if (content) {
this.isMultiSpatial = IS_MULTI_SPATIAL.includes(type);
this.isMapModal = true;
this.editingContent = this.$options.filters.typeFormat(content, type);
}
return;
}
if (BLOB.includes(type)) {
this.isBlobEditor = true;
this.editingContent = content || '';
@ -470,6 +540,8 @@ export default {
hideEditorModal () {
this.isTextareaEditor = false;
this.isBlobEditor = false;
this.isMapModal = false;
this.isMultiSpatial = false;
},
downloadFile () {
const downloadLink = document.createElement('a');
@ -506,7 +578,7 @@ export default {
return this.keyUsage.find(key => key.field === keyName);
},
openContext (event, payload) {
payload.field = this.fields[payload.field].name;// Ensures field name only
payload.field = this.fields[payload.orgField].name;// Ensures field name only
payload.isEditable = this.isEditable;
this.$emit('contextmenu', event, payload);
},

View File

@ -85,7 +85,7 @@
@click="showFakerModal"
>
<i class="mdi mdi-24px mdi-playlist-plus mr-1" />
<span>{{ $t('message.tableFiller') }}</span>
<span>{{ $tc('message.insertRow', 2) }}</span>
</button>
<div class="dropdown table-dropdown pr-2">
@ -120,7 +120,12 @@
{{ $t('word.results') }}: <b>{{ results[0].rows.length | localeString }}</b>
</div>
<div v-if="hasApproximately || (page > 1 && approximateCount)">
{{ $t('word.total') }}: <b :title="$t('word.approximately')"> {{ approximateCount | localeString }}</b>
{{ $t('word.total') }}: <b
:title="!customizations.tableRealCount ? $t('word.approximately') : ''"
>
<span v-if="!customizations.tableRealCount"></span>
{{ approximateCount | localeString }}
</b>
</div>
<div class="d-flex" :title="$t('word.schema')">
<i class="mdi mdi-18px mdi-database mr-1" /><b>{{ schema }}</b>
@ -231,6 +236,9 @@ export default {
workspace () {
return this.getWorkspace(this.connection.uid);
},
customizations () {
return this.workspace.customizations;
},
isTable () {
return !!this.workspace.breadcrumbs.table;
},