mirror of https://github.com/Fabio286/antares.git
feat(UI): query tab name based on content
This commit is contained in:
parent
1573de5b1f
commit
065de3a0a2
|
@ -27,7 +27,7 @@
|
||||||
<a v-if="tab.type === 'query'" class="tab-link">
|
<a v-if="tab.type === 'query'" class="tab-link">
|
||||||
<i class="mdi mdi-18px mdi-code-tags mr-1" />
|
<i class="mdi mdi-18px mdi-code-tags mr-1" />
|
||||||
<span>
|
<span>
|
||||||
Query #{{ tab.index }}
|
<span>{{ tab.content || 'Query' | cutText }} #{{ tab.index }}</span>
|
||||||
<span
|
<span
|
||||||
class="btn btn-clear"
|
class="btn btn-clear"
|
||||||
:title="$t('word.close')"
|
:title="$t('word.close')"
|
||||||
|
@ -44,7 +44,7 @@
|
||||||
>
|
>
|
||||||
<i class="mdi mdi-18px mr-1" :class="tab.elementType === 'view' ? 'mdi-table-eye' : 'mdi-table'" />
|
<i class="mdi mdi-18px mr-1" :class="tab.elementType === 'view' ? 'mdi-table-eye' : 'mdi-table'" />
|
||||||
<span :title="`${$t('word.data').toUpperCase()}: ${$tc(`word.${tab.elementType}`)}`">
|
<span :title="`${$t('word.data').toUpperCase()}: ${$tc(`word.${tab.elementType}`)}`">
|
||||||
<span class=" text-italic">{{ tab.elementName }}</span>
|
<span class=" text-italic">{{ tab.elementName | cutText }}</span>
|
||||||
<span
|
<span
|
||||||
class="btn btn-clear"
|
class="btn btn-clear"
|
||||||
:title="$t('word.close')"
|
:title="$t('word.close')"
|
||||||
|
@ -57,7 +57,7 @@
|
||||||
<a v-else-if="tab.type === 'data'" class="tab-link">
|
<a v-else-if="tab.type === 'data'" class="tab-link">
|
||||||
<i class="mdi mdi-18px mr-1" :class="tab.elementType === 'view' ? 'mdi-table-eye' : 'mdi-table'" />
|
<i class="mdi mdi-18px mr-1" :class="tab.elementType === 'view' ? 'mdi-table-eye' : 'mdi-table'" />
|
||||||
<span :title="`${$t('word.data').toUpperCase()}: ${$tc(`word.${tab.elementType}`)}`">
|
<span :title="`${$t('word.data').toUpperCase()}: ${$tc(`word.${tab.elementType}`)}`">
|
||||||
{{ tab.elementName }}
|
{{ tab.elementName | cutText }}
|
||||||
<span
|
<span
|
||||||
class="btn btn-clear"
|
class="btn btn-clear"
|
||||||
:title="$t('word.close')"
|
:title="$t('word.close')"
|
||||||
|
@ -74,7 +74,7 @@
|
||||||
>
|
>
|
||||||
<i class="mdi mdi-tune-vertical-variant mdi-18px mr-1" />
|
<i class="mdi mdi-tune-vertical-variant mdi-18px mr-1" />
|
||||||
<span :title="`${$t('word.settings').toUpperCase()}: ${$tc(`word.${tab.elementType}`)}`">
|
<span :title="`${$t('word.settings').toUpperCase()}: ${$tc(`word.${tab.elementType}`)}`">
|
||||||
{{ tab.elementName }}
|
{{ tab.elementName | cutText }}
|
||||||
<span
|
<span
|
||||||
class="btn btn-clear"
|
class="btn btn-clear"
|
||||||
:title="$t('word.close')"
|
:title="$t('word.close')"
|
||||||
|
@ -91,7 +91,7 @@
|
||||||
>
|
>
|
||||||
<i class="mdi mdi-tune-vertical-variant mdi-18px mr-1" />
|
<i class="mdi mdi-tune-vertical-variant mdi-18px mr-1" />
|
||||||
<span :title="`${$t('word.settings').toUpperCase()}: ${$tc(`word.${tab.elementType}`)}`">
|
<span :title="`${$t('word.settings').toUpperCase()}: ${$tc(`word.${tab.elementType}`)}`">
|
||||||
{{ tab.elementName }}
|
{{ tab.elementName | cutText }}
|
||||||
<span
|
<span
|
||||||
class="btn btn-clear"
|
class="btn btn-clear"
|
||||||
:title="$t('word.close')"
|
:title="$t('word.close')"
|
||||||
|
@ -109,7 +109,7 @@
|
||||||
>
|
>
|
||||||
<i class="mdi mdi-18px mdi-tune-vertical-variant mr-1" />
|
<i class="mdi mdi-18px mdi-tune-vertical-variant mr-1" />
|
||||||
<span :title="`${$t('word.settings').toUpperCase()}: ${$tc(`word.${tab.elementType}`)}`">
|
<span :title="`${$t('word.settings').toUpperCase()}: ${$tc(`word.${tab.elementType}`)}`">
|
||||||
<span class=" text-italic">{{ tab.elementName }}</span>
|
<span class=" text-italic">{{ tab.elementName | cutText }}</span>
|
||||||
<span
|
<span
|
||||||
class="btn btn-clear"
|
class="btn btn-clear"
|
||||||
:title="$t('word.close')"
|
:title="$t('word.close')"
|
||||||
|
@ -126,7 +126,7 @@
|
||||||
>
|
>
|
||||||
<i class="mdi mdi-18px mdi-tune-vertical-variant mr-1" />
|
<i class="mdi mdi-18px mdi-tune-vertical-variant mr-1" />
|
||||||
<span :title="`${$t('word.settings').toUpperCase()}: ${$tc(`word.${tab.elementType}`)}`">
|
<span :title="`${$t('word.settings').toUpperCase()}: ${$tc(`word.${tab.elementType}`)}`">
|
||||||
{{ tab.elementName }}
|
{{ tab.elementName | cutText }}
|
||||||
<span
|
<span
|
||||||
class="btn btn-clear"
|
class="btn btn-clear"
|
||||||
:title="$t('word.close')"
|
:title="$t('word.close')"
|
||||||
|
@ -312,6 +312,15 @@ export default {
|
||||||
ModalProcessesList,
|
ModalProcessesList,
|
||||||
ModalDiscardChanges
|
ModalDiscardChanges
|
||||||
},
|
},
|
||||||
|
filters: {
|
||||||
|
cutText (string) {
|
||||||
|
const limit = 20;
|
||||||
|
const escapedString = string.replace(/\s{2,}/g, ' ');
|
||||||
|
if (escapedString.length > limit)
|
||||||
|
return `${escapedString.substr(0, limit)}...`;
|
||||||
|
return escapedString;
|
||||||
|
}
|
||||||
|
},
|
||||||
props: {
|
props: {
|
||||||
connection: Object
|
connection: Object
|
||||||
},
|
},
|
||||||
|
|
|
@ -473,7 +473,8 @@ export default {
|
||||||
line-height: 1.2;
|
line-height: 1.2;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
&:hover {
|
&:hover,
|
||||||
|
&.selected {
|
||||||
border-radius: $border-radius;
|
border-radius: $border-radius;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue