mirror of
https://github.com/Fabio286/antares.git
synced 2025-06-05 21:59:22 +02:00
Additions
This commit is contained in:
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="workspace-explorebar column">
|
||||
<div class="workspace-explorebar-header">
|
||||
<span class="workspace-explorebar-title">{{ connection.ask ? '': connection.user+'@' }}{{ connection.host }}:{{ connection.port }}</span>
|
||||
<span class="workspace-explorebar-title">{{ connectionName }}</span>
|
||||
<span v-if="workspace.connected" class="workspace-explorebar-tools">
|
||||
<i
|
||||
class="material-icons md-18 c-hand"
|
||||
@ -17,6 +17,26 @@
|
||||
</span>
|
||||
</div>
|
||||
<DatabaseConnectPanel v-if="!workspace.connected" :connection="connection" />
|
||||
<div class="workspace-explorebar-body">
|
||||
<div
|
||||
v-for="db of workspace.structure"
|
||||
:key="db.dbName"
|
||||
>
|
||||
<div class="database-name">
|
||||
<i class="material-icons md-18 mr-1">view_agenda</i>{{ db.dbName }}
|
||||
</div>
|
||||
<div class="d-block ml-4">
|
||||
<div
|
||||
v-for="table of db.tables"
|
||||
:key="table.TABLE_NAME"
|
||||
>
|
||||
<div class="table-name">
|
||||
<i class="material-icons md-18 mr-1">view_headline</i>{{ table.TABLE_NAME }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -39,10 +59,14 @@ export default {
|
||||
},
|
||||
computed: {
|
||||
...mapGetters({
|
||||
getWorkspace: 'workspaces/getWorkspace'
|
||||
getWorkspace: 'workspaces/getWorkspace',
|
||||
getConnectionName: 'connections/getConnectionName'
|
||||
}),
|
||||
workspace () {
|
||||
return this.getWorkspace(this.connection.uid);
|
||||
},
|
||||
connectionName () {
|
||||
return this.getConnectionName(this.connection.uid);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@ -62,6 +86,8 @@ export default {
|
||||
<style lang="scss">
|
||||
.workspace-explorebar{
|
||||
width: $explorebar-width;
|
||||
height: calc(100vh - #{$footer-height});
|
||||
overflow: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
@ -112,5 +138,15 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.workspace-explorebar-body{
|
||||
width: 100%;
|
||||
|
||||
.database-name,
|
||||
.table-name{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -13,10 +13,22 @@
|
||||
<form class="form-horizontal">
|
||||
<fieldset class="m-0" :disabled="isTesting">
|
||||
<div class="form-group">
|
||||
<div class="col-3 col-sm-12">
|
||||
<div class="col-4 col-sm-12">
|
||||
<label class="form-label">{{ $t('word.connectionName') }}:</label>
|
||||
</div>
|
||||
<div class="col-8 col-sm-12">
|
||||
<input
|
||||
v-model="localConnection.name"
|
||||
class="form-input"
|
||||
type="text"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-4 col-sm-12">
|
||||
<label class="form-label">{{ $t('word.client') }}:</label>
|
||||
</div>
|
||||
<div class="col-9 col-sm-12">
|
||||
<div class="col-8 col-sm-12">
|
||||
<select v-model="localConnection.client" class="form-select">
|
||||
<option value="mysql">
|
||||
MySQL/MariaDB
|
||||
@ -34,10 +46,10 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-3 col-sm-12">
|
||||
<div class="col-4 col-sm-12">
|
||||
<label class="form-label">{{ $t('word.hostName') }}/IP:</label>
|
||||
</div>
|
||||
<div class="col-9 col-sm-12">
|
||||
<div class="col-8 col-sm-12">
|
||||
<input
|
||||
v-model="localConnection.host"
|
||||
class="form-input"
|
||||
@ -46,10 +58,10 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-3 col-sm-12">
|
||||
<div class="col-4 col-sm-12">
|
||||
<label class="form-label">{{ $t('word.port') }}:</label>
|
||||
</div>
|
||||
<div class="col-9 col-sm-12">
|
||||
<div class="col-8 col-sm-12">
|
||||
<input
|
||||
v-model="localConnection.port"
|
||||
class="form-input"
|
||||
@ -60,10 +72,10 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-3 col-sm-12">
|
||||
<div class="col-4 col-sm-12">
|
||||
<label class="form-label">{{ $t('word.user') }}:</label>
|
||||
</div>
|
||||
<div class="col-9 col-sm-12">
|
||||
<div class="col-8 col-sm-12">
|
||||
<input
|
||||
v-model="localConnection.user"
|
||||
class="form-input"
|
||||
@ -73,10 +85,10 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-3 col-sm-12">
|
||||
<div class="col-4 col-sm-12">
|
||||
<label class="form-label">{{ $t('word.password') }}:</label>
|
||||
</div>
|
||||
<div class="col-9 col-sm-12">
|
||||
<div class="col-8 col-sm-12">
|
||||
<input
|
||||
v-model="localConnection.password"
|
||||
class="form-input"
|
||||
@ -86,8 +98,8 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-3 col-sm-12" />
|
||||
<div class="col-9 col-sm-12">
|
||||
<div class="col-4 col-sm-12" />
|
||||
<div class="col-8 col-sm-12">
|
||||
<label class="form-checkbox form-inline">
|
||||
<input v-model="localConnection.ask" type="checkbox"><i class="form-icon" /> {{ $t('message.askCredentials') }}
|
||||
</label>
|
||||
|
||||
@ -13,10 +13,22 @@
|
||||
<form class="form-horizontal">
|
||||
<fieldset class="m-0" :disabled="isTesting">
|
||||
<div class="form-group">
|
||||
<div class="col-3 col-sm-12">
|
||||
<div class="col-4 col-sm-12">
|
||||
<label class="form-label">{{ $t('word.connectionName') }}:</label>
|
||||
</div>
|
||||
<div class="col-8 col-sm-12">
|
||||
<input
|
||||
v-model="connection.name"
|
||||
class="form-input"
|
||||
type="text"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-4 col-sm-12">
|
||||
<label class="form-label">{{ $t('word.client') }}:</label>
|
||||
</div>
|
||||
<div class="col-9 col-sm-12">
|
||||
<div class="col-8 col-sm-12">
|
||||
<select
|
||||
v-model="connection.client"
|
||||
class="form-select"
|
||||
@ -38,10 +50,10 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-3 col-sm-12">
|
||||
<div class="col-4 col-sm-12">
|
||||
<label class="form-label">{{ $t('word.hostName') }}/IP:</label>
|
||||
</div>
|
||||
<div class="col-9 col-sm-12">
|
||||
<div class="col-8 col-sm-12">
|
||||
<input
|
||||
v-model="connection.host"
|
||||
class="form-input"
|
||||
@ -50,10 +62,10 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-3 col-sm-12">
|
||||
<div class="col-4 col-sm-12">
|
||||
<label class="form-label">{{ $t('word.port') }}:</label>
|
||||
</div>
|
||||
<div class="col-9 col-sm-12">
|
||||
<div class="col-8 col-sm-12">
|
||||
<input
|
||||
v-model="connection.port"
|
||||
class="form-input"
|
||||
@ -64,10 +76,10 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-3 col-sm-12">
|
||||
<div class="col-4 col-sm-12">
|
||||
<label class="form-label">{{ $t('word.user') }}:</label>
|
||||
</div>
|
||||
<div class="col-9 col-sm-12">
|
||||
<div class="col-8 col-sm-12">
|
||||
<input
|
||||
v-model="connection.user"
|
||||
class="form-input"
|
||||
@ -77,10 +89,10 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-3 col-sm-12">
|
||||
<div class="col-4 col-sm-12">
|
||||
<label class="form-label">{{ $t('word.password') }}:</label>
|
||||
</div>
|
||||
<div class="col-9 col-sm-12">
|
||||
<div class="col-8 col-sm-12">
|
||||
<input
|
||||
v-model="connection.password"
|
||||
class="form-input"
|
||||
@ -90,8 +102,8 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-3 col-sm-12" />
|
||||
<div class="col-9 col-sm-12">
|
||||
<div class="col-4 col-sm-12" />
|
||||
<div class="col-8 col-sm-12">
|
||||
<label class="form-checkbox form-inline">
|
||||
<input v-model="connection.ask" type="checkbox"><i class="form-icon" /> {{ $t('message.askCredentials') }}
|
||||
</label>
|
||||
@ -146,6 +158,7 @@ export default {
|
||||
data () {
|
||||
return {
|
||||
connection: {
|
||||
name: '',
|
||||
client: 'mysql',
|
||||
host: '127.0.0.1',
|
||||
port: '3306',
|
||||
|
||||
@ -47,7 +47,10 @@
|
||||
<div class="col-6 col-sm-12">
|
||||
<div class="form-group">
|
||||
<div class="col-6 col-sm-12">
|
||||
<label class="form-label">{{ $t('word.language') }}:</label>
|
||||
<label class="form-label">
|
||||
<i class="material-icons md-18 mr-1">translate</i>
|
||||
{{ $t('word.language') }}:
|
||||
</label>
|
||||
</div>
|
||||
<div class="col-6 col-sm-12">
|
||||
<select
|
||||
@ -55,8 +58,12 @@
|
||||
class="form-select"
|
||||
@change="changeLocale(localLocale)"
|
||||
>
|
||||
<option v-for="(locale, key) in locales" :key="key">
|
||||
{{ locale }}
|
||||
<option
|
||||
v-for="(locale, key) in locales"
|
||||
:key="key"
|
||||
:value="locale.code"
|
||||
>
|
||||
{{ locale.name }}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
@ -72,7 +79,7 @@
|
||||
</div>
|
||||
<div v-if="selectedTab === 'about'" class="panel-body py-4">
|
||||
<div class="text-center">
|
||||
<img src="logo.svg" width="128">
|
||||
<img :src="require('@/images/logo.svg').default" width="128">
|
||||
<h4>{{ appName }}</h4>
|
||||
<p>
|
||||
{{ $t('word.version') }}: {{ appVersion }}<br>
|
||||
@ -88,6 +95,7 @@
|
||||
|
||||
<script>
|
||||
import { mapActions, mapGetters } from 'vuex';
|
||||
import localesNames from '@/i18n/supported-locales';
|
||||
const { shell } = require('electron');
|
||||
|
||||
export default {
|
||||
@ -103,14 +111,20 @@ export default {
|
||||
...mapGetters({
|
||||
appName: 'application/appName',
|
||||
appVersion: 'application/appVersion',
|
||||
selectedSettingTab: 'application/selectedSettingTab',
|
||||
selectedLocale: 'settings/getLocale'
|
||||
}),
|
||||
locales () {
|
||||
return this.$i18n.availableLocales;
|
||||
const locales = [];
|
||||
for (const locale of this.$i18n.availableLocales)
|
||||
locales.push({ code: locale, name: localesNames[locale] });
|
||||
|
||||
return locales;
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.localLocale = this.selectedLocale;
|
||||
this.selectedTab = this.selectedSettingTab;
|
||||
},
|
||||
methods: {
|
||||
...mapActions({
|
||||
@ -140,6 +154,11 @@ export default {
|
||||
.badge::after{
|
||||
background: #32b643;
|
||||
}
|
||||
|
||||
.form-label{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@ -20,7 +20,7 @@
|
||||
</template>
|
||||
<div :slot="'body'">
|
||||
<div class="mb-2">
|
||||
{{ $t('message.deleteConnectionCorfirm') }} <b>{{ contextConnection.user }}@{{ contextConnection.host }}:{{ contextConnection.port }}</b>?
|
||||
{{ $t('message.deleteConnectionCorfirm') }} <b>{{ connectionName }}</b>?
|
||||
</div>
|
||||
</div>
|
||||
</ConfirmModal>
|
||||
@ -28,7 +28,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapActions } from 'vuex';
|
||||
import { mapActions, mapGetters } from 'vuex';
|
||||
import BaseContextMenu from '@/components/BaseContextMenu';
|
||||
import ConfirmModal from '@/components/BaseConfirmModal';
|
||||
|
||||
@ -47,6 +47,14 @@ export default {
|
||||
isConfirmModal: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters({
|
||||
getConnectionName: 'connections/getConnectionName'
|
||||
}),
|
||||
connectionName () {
|
||||
return this.getConnectionName(this.contextConnection.uid);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
...mapActions({
|
||||
deleteConnection: 'connections/deleteConnection',
|
||||
|
||||
@ -3,17 +3,22 @@
|
||||
<div class="footer-left-elements">
|
||||
<ul class="footer-elements">
|
||||
<li class="footer-element">
|
||||
<i class="material-icons md-18">memory</i>
|
||||
<i class="material-icons md-18 mr-1">memory</i>
|
||||
<small>{{ appVersion }}</small>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="footer-right-elements">
|
||||
<ul class="footer-elements">
|
||||
<li class="footer-element">
|
||||
<i class="material-icons md-18">favorite</i>
|
||||
<li class="footer-element footer-link">
|
||||
<i class="material-icons md-18 mr-1">favorite</i>
|
||||
<small>{{ $t('word.donate') }}</small>
|
||||
</li>
|
||||
<li class="footer-element">
|
||||
<li class="footer-element footer-link">
|
||||
<i class="material-icons md-18">bug_report</i>
|
||||
</li>
|
||||
<li class="footer-element footer-link" @click="showSettingModal('about')">
|
||||
<i class="material-icons md-18">info_outline</i>
|
||||
</li>
|
||||
</ul>
|
||||
@ -22,9 +27,21 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapActions, mapGetters } from 'vuex';
|
||||
|
||||
export default {
|
||||
|
||||
name: 'TheFooter',
|
||||
computed: {
|
||||
...mapGetters({
|
||||
appName: 'application/appName',
|
||||
appVersion: 'application/appVersion'
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
...mapActions({
|
||||
showSettingModal: 'application/showSettingModal'
|
||||
})
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -46,9 +63,23 @@ export default {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.footer-element{
|
||||
height: $footer-height;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 .4rem;
|
||||
margin: 0;
|
||||
|
||||
&.footer-link{
|
||||
cursor: pointer;
|
||||
transition: background .2s;
|
||||
|
||||
&:hover{
|
||||
background: rgba($color: #fff, $alpha: .1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -15,7 +15,7 @@
|
||||
draggable="true"
|
||||
class="settingbar-element btn btn-link tooltip tooltip-right"
|
||||
:class="{'selected': connection.uid === selectedWorkspace}"
|
||||
:data-tooltip="`${connection.ask ? '': connection.user+'@'}${connection.host}:${connection.port}`"
|
||||
:data-tooltip="`${getConnectionName(connection.uid)}`"
|
||||
@click="selectWorkspace(connection.uid)"
|
||||
@contextmenu.prevent="contextMenu($event, connection)"
|
||||
>
|
||||
@ -37,7 +37,7 @@
|
||||
<li
|
||||
class="settingbar-element btn btn-link tooltip tooltip-right mb-2"
|
||||
:data-tooltip="$t('word.settings')"
|
||||
@click="showSettingModal"
|
||||
@click="showSettingModal('general')"
|
||||
>
|
||||
<i class="settingbar-element-icon material-icons text-light">settings</i>
|
||||
</li>
|
||||
@ -68,6 +68,7 @@ export default {
|
||||
computed: {
|
||||
...mapGetters({
|
||||
getConnections: 'connections/getConnections',
|
||||
getConnectionName: 'connections/getConnectionName',
|
||||
connected: 'workspaces/getConnected',
|
||||
selectedWorkspace: 'workspaces/getSelected'
|
||||
}),
|
||||
@ -91,6 +92,9 @@ export default {
|
||||
this.contextEvent = event;
|
||||
this.contextConnection = connection;
|
||||
this.isContext = true;
|
||||
},
|
||||
workspaceName (connection) {
|
||||
return connection.ask ? '' : `${connection.user + '@'}${connection.host}:${connection.port}`;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user