2020-05-14 15:21:57 +02:00
|
|
|
<template>
|
2020-06-06 16:27:42 +02:00
|
|
|
<div v-show="isSelected" class="workspace column columns col-gapless">
|
2021-07-08 15:06:20 +02:00
|
|
|
<WorkspaceExploreBar
|
2022-04-21 14:39:24 +02:00
|
|
|
v-if="workspace?.connectionStatus === 'connected'"
|
2021-07-08 15:06:20 +02:00
|
|
|
:connection="connection"
|
|
|
|
:is-selected="isSelected"
|
|
|
|
/>
|
2022-04-21 14:39:24 +02:00
|
|
|
<div v-if="workspace?.connectionStatus === 'connected'" class="workspace-tabs column columns col-gapless">
|
2021-07-14 20:30:54 +02:00
|
|
|
<Draggable
|
2020-10-26 09:28:29 +01:00
|
|
|
ref="tabWrap"
|
2021-07-14 20:30:54 +02:00
|
|
|
v-model="draggableTabs"
|
|
|
|
tag="ul"
|
2022-04-22 17:49:13 +02:00
|
|
|
item-key="uid"
|
2021-07-14 20:30:54 +02:00
|
|
|
group="tabs"
|
2020-10-26 09:28:29 +01:00
|
|
|
class="tab tab-block column col-12"
|
2021-07-14 20:30:54 +02:00
|
|
|
draggable=".tab-draggable"
|
2022-04-21 14:39:24 +02:00
|
|
|
@mouseover="addWheelEvent"
|
2020-10-26 09:28:29 +01:00
|
|
|
>
|
2022-04-21 14:39:24 +02:00
|
|
|
<template #item="{element}">
|
|
|
|
<li
|
|
|
|
class="tab-item tab-draggable"
|
|
|
|
:draggable="true"
|
|
|
|
:class="{'active': selectedTab === element.uid}"
|
|
|
|
@mousedown.left="selectTab({uid: workspace.uid, tab: element.uid})"
|
|
|
|
@mouseup.middle="closeTab(element)"
|
2022-02-13 10:27:10 +01:00
|
|
|
>
|
2022-04-21 14:39:24 +02:00
|
|
|
<a
|
|
|
|
v-if="element.type === 'query'"
|
|
|
|
class="tab-link"
|
|
|
|
:class="{'badge': element.isChanged}"
|
|
|
|
>
|
|
|
|
<i class="mdi mdi-18px mdi-code-tags mr-1" />
|
|
|
|
<span>
|
|
|
|
<span>{{ cutText(element.content || 'Query') }} #{{ element.index }}</span>
|
|
|
|
<span
|
|
|
|
class="btn btn-clear"
|
|
|
|
:title="$t('word.close')"
|
|
|
|
@mousedown.left.stop
|
|
|
|
@click.stop="closeTab(element)"
|
|
|
|
/>
|
|
|
|
</span>
|
|
|
|
</a>
|
2021-07-13 16:53:47 +02:00
|
|
|
|
2022-04-21 14:39:24 +02:00
|
|
|
<a
|
|
|
|
v-else-if="element.type === 'temp-data'"
|
|
|
|
class="tab-link"
|
|
|
|
@dblclick="openAsPermanentTab(element)"
|
|
|
|
>
|
|
|
|
<i class="mdi mdi-18px mr-1" :class="element.elementType === 'view' ? 'mdi-table-eye' : 'mdi-table'" />
|
|
|
|
<span :title="`${$t('word.data').toUpperCase()}: ${$tc(`word.${element.elementType}`)}`">
|
|
|
|
<span class=" text-italic">{{ cutText(element.elementName) }}</span>
|
|
|
|
<span
|
|
|
|
class="btn btn-clear"
|
|
|
|
:title="$t('word.close')"
|
|
|
|
@mousedown.left.stop
|
|
|
|
@click.stop="closeTab(element)"
|
|
|
|
/>
|
|
|
|
</span>
|
|
|
|
</a>
|
2021-07-13 19:23:02 +02:00
|
|
|
|
2022-04-21 14:39:24 +02:00
|
|
|
<a v-else-if="element.type === 'data'" class="tab-link">
|
|
|
|
<i class="mdi mdi-18px mr-1" :class="element.elementType === 'view' ? 'mdi-table-eye' : 'mdi-table'" />
|
|
|
|
<span :title="`${$t('word.data').toUpperCase()}: ${$tc(`word.${element.elementType}`)}`">
|
|
|
|
{{ cutText(element.elementName) }}
|
|
|
|
<span
|
|
|
|
class="btn btn-clear"
|
|
|
|
:title="$t('word.close')"
|
|
|
|
@mousedown.left.stop
|
|
|
|
@click.stop="closeTab(element)"
|
|
|
|
/>
|
|
|
|
</span>
|
|
|
|
</a>
|
2021-07-15 19:51:18 +02:00
|
|
|
|
2022-04-21 14:39:24 +02:00
|
|
|
<a
|
|
|
|
v-else-if="element.type === 'new-table'"
|
|
|
|
class="tab-link"
|
|
|
|
:class="{'badge': element.isChanged}"
|
|
|
|
>
|
|
|
|
<i class="mdi mdi-shape-square-plus mdi-18px mr-1" />
|
|
|
|
<span :title="`${$t('word.new').toUpperCase()}: ${$tc(`word.${element.elementType}`)}`">
|
|
|
|
{{ $t('message.newTable') }}
|
|
|
|
<span
|
|
|
|
class="btn btn-clear"
|
|
|
|
:title="$t('word.close')"
|
|
|
|
@mousedown.left.stop
|
|
|
|
@click.stop="closeTab(element)"
|
|
|
|
/>
|
|
|
|
</span>
|
|
|
|
</a>
|
2021-08-13 16:50:59 +02:00
|
|
|
|
2022-04-21 14:39:24 +02:00
|
|
|
<a
|
|
|
|
v-else-if="element.type === 'table-props'"
|
|
|
|
class="tab-link"
|
|
|
|
:class="{'badge': element.isChanged}"
|
|
|
|
>
|
|
|
|
<i class="mdi mdi-tune-vertical-variant mdi-18px mr-1" />
|
|
|
|
<span :title="`${$t('word.settings').toUpperCase()}: ${$tc(`word.${element.elementType}`)}`">
|
|
|
|
{{ cutText(element.elementName) }}
|
|
|
|
<span
|
|
|
|
class="btn btn-clear"
|
|
|
|
:title="$t('word.close')"
|
|
|
|
@mousedown.left.stop
|
|
|
|
@click.stop="closeTab(element)"
|
|
|
|
/>
|
|
|
|
</span>
|
|
|
|
</a>
|
2021-07-16 18:52:18 +02:00
|
|
|
|
2022-04-21 14:39:24 +02:00
|
|
|
<a
|
|
|
|
v-else-if="element.type === 'view-props'"
|
|
|
|
class="tab-link"
|
|
|
|
:class="{'badge': element.isChanged}"
|
|
|
|
>
|
|
|
|
<i class="mdi mdi-tune-vertical-variant mdi-18px mr-1" />
|
|
|
|
<span :title="`${$t('word.settings').toUpperCase()}: ${$tc(`word.view`)}`">
|
|
|
|
{{ cutText(element.elementName) }}
|
|
|
|
<span
|
|
|
|
class="btn btn-clear"
|
|
|
|
:title="$t('word.close')"
|
|
|
|
@mousedown.left.stop
|
|
|
|
@click.stop="closeTab(element)"
|
|
|
|
/>
|
|
|
|
</span>
|
|
|
|
</a>
|
2021-09-06 17:29:34 +02:00
|
|
|
|
2022-04-21 14:39:24 +02:00
|
|
|
<a
|
|
|
|
v-else-if="element.type === 'new-view'"
|
|
|
|
class="tab-link"
|
|
|
|
:class="{'badge': element.isChanged}"
|
|
|
|
>
|
|
|
|
<i class="mdi mdi-shape-square-plus mdi-18px mr-1" />
|
|
|
|
<span :title="`${$t('word.new').toUpperCase()}: ${$tc(`word.${element.elementType}`)}`">
|
|
|
|
{{ $t('message.newView') }}
|
|
|
|
<span
|
|
|
|
class="btn btn-clear"
|
|
|
|
:title="$t('word.close')"
|
|
|
|
@mousedown.left.stop
|
|
|
|
@click.stop="closeTab(element)"
|
|
|
|
/>
|
|
|
|
</span>
|
|
|
|
</a>
|
2021-08-18 17:28:41 +02:00
|
|
|
|
2022-04-21 14:39:24 +02:00
|
|
|
<a
|
|
|
|
v-else-if="element.type === 'new-trigger'"
|
|
|
|
class="tab-link"
|
|
|
|
:class="{'badge': element.isChanged}"
|
|
|
|
>
|
|
|
|
<i class="mdi mdi-shape-square-plus mdi-18px mr-1" />
|
|
|
|
<span :title="`${$t('word.new').toUpperCase()}: ${$tc(`word.${element.elementType}`)}`">
|
|
|
|
{{ $t('message.newTrigger') }}
|
|
|
|
<span
|
|
|
|
class="btn btn-clear"
|
|
|
|
:title="$t('word.close')"
|
|
|
|
@mousedown.left.stop
|
|
|
|
@click.stop="closeTab(element)"
|
|
|
|
/>
|
|
|
|
</span>
|
|
|
|
</a>
|
2021-09-02 18:08:23 +02:00
|
|
|
|
2022-04-21 14:39:24 +02:00
|
|
|
<a
|
|
|
|
v-else-if="element.type === 'new-routine'"
|
|
|
|
class="tab-link"
|
|
|
|
:class="{'badge': element.isChanged}"
|
|
|
|
>
|
|
|
|
<i class="mdi mdi-shape-square-plus mdi-18px mr-1" />
|
|
|
|
<span :title="`${$t('word.new').toUpperCase()}: ${$tc(`word.${element.elementType}`)}`">
|
|
|
|
{{ $t('message.newRoutine') }}
|
|
|
|
<span
|
|
|
|
class="btn btn-clear"
|
|
|
|
:title="$t('word.close')"
|
|
|
|
@mousedown.left.stop
|
|
|
|
@click.stop="closeTab(element)"
|
|
|
|
/>
|
|
|
|
</span>
|
|
|
|
</a>
|
2021-07-17 13:10:54 +02:00
|
|
|
|
2022-04-21 14:39:24 +02:00
|
|
|
<a
|
|
|
|
v-else-if="element.type === 'new-function'"
|
|
|
|
class="tab-link"
|
|
|
|
:class="{'badge': element.isChanged}"
|
|
|
|
>
|
|
|
|
<i class="mdi mdi-shape-square-plus mdi-18px mr-1" />
|
|
|
|
<span :title="`${$t('word.new').toUpperCase()}: ${$tc(`word.${element.elementType}`)}`">
|
|
|
|
{{ $t('message.newFunction') }}
|
|
|
|
<span
|
|
|
|
class="btn btn-clear"
|
|
|
|
:title="$t('word.close')"
|
|
|
|
@mousedown.left.stop
|
|
|
|
@click.stop="closeTab(element)"
|
|
|
|
/>
|
|
|
|
</span>
|
|
|
|
</a>
|
2021-09-07 18:20:45 +02:00
|
|
|
|
2022-04-21 14:39:24 +02:00
|
|
|
<a
|
|
|
|
v-else-if="element.type === 'new-trigger-function'"
|
|
|
|
class="tab-link"
|
|
|
|
:class="{'badge': element.isChanged}"
|
|
|
|
>
|
|
|
|
<i class="mdi mdi-shape-square-plus mdi-18px mr-1" />
|
|
|
|
<span :title="`${$t('word.new').toUpperCase()}: ${$tc(`word.${element.elementType}`)}`">
|
|
|
|
{{ $t('message.newTriggerFunction') }}
|
|
|
|
<span
|
|
|
|
class="btn btn-clear"
|
|
|
|
:title="$t('word.close')"
|
|
|
|
@mousedown.left.stop
|
|
|
|
@click.stop="closeTab(element)"
|
|
|
|
/>
|
|
|
|
</span>
|
|
|
|
</a>
|
2021-09-11 10:24:21 +02:00
|
|
|
|
2022-04-21 14:39:24 +02:00
|
|
|
<a
|
|
|
|
v-else-if="element.type === 'new-scheduler'"
|
|
|
|
class="tab-link"
|
|
|
|
:class="{'badge': element.isChanged}"
|
|
|
|
>
|
|
|
|
<i class="mdi mdi-shape-square-plus mdi-18px mr-1" />
|
|
|
|
<span :title="`${$t('word.new').toUpperCase()}: ${$tc(`word.${element.elementType}`)}`">
|
|
|
|
{{ $t('message.newScheduler') }}
|
|
|
|
<span
|
|
|
|
class="btn btn-clear"
|
|
|
|
:title="$t('word.close')"
|
|
|
|
@mousedown.left.stop
|
|
|
|
@click.stop="closeTab(element)"
|
|
|
|
/>
|
|
|
|
</span>
|
|
|
|
</a>
|
2021-09-10 18:23:32 +02:00
|
|
|
|
2022-04-21 14:39:24 +02:00
|
|
|
<a
|
|
|
|
v-else-if="element.type.includes('temp-')"
|
|
|
|
class="tab-link"
|
|
|
|
:class="{'badge': element.isChanged}"
|
|
|
|
@dblclick="openAsPermanentTab(element)"
|
|
|
|
>
|
|
|
|
<i class="mdi mdi-18px mdi-tune-vertical-variant mr-1" />
|
|
|
|
<span :title="`${$t('word.settings').toUpperCase()}: ${$tc(`word.${element.elementType}`)}`">
|
|
|
|
<span class=" text-italic">{{ cutText(element.elementName) }}</span>
|
|
|
|
<span
|
|
|
|
class="btn btn-clear"
|
|
|
|
:title="$t('word.close')"
|
|
|
|
@mousedown.left.stop
|
|
|
|
@click.stop="closeTab(element)"
|
|
|
|
/>
|
|
|
|
</span>
|
|
|
|
</a>
|
2021-07-17 13:10:54 +02:00
|
|
|
|
2022-04-21 14:39:24 +02:00
|
|
|
<a
|
|
|
|
v-else
|
|
|
|
class="tab-link"
|
|
|
|
:class="{'badge': element.isChanged}"
|
|
|
|
>
|
|
|
|
<i class="mdi mdi-18px mdi-tune-vertical-variant mr-1" />
|
|
|
|
<span :title="`${$t('word.settings').toUpperCase()}: ${$tc(`word.${element.elementType}`)}`">
|
|
|
|
{{ cutText(element.elementName) }}
|
|
|
|
<span
|
|
|
|
class="btn btn-clear"
|
|
|
|
:title="$t('word.close')"
|
|
|
|
@mousedown.left.stop
|
|
|
|
@click.stop="closeTab(element)"
|
|
|
|
/>
|
|
|
|
</span>
|
|
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</template>
|
2021-12-10 17:34:44 +01:00
|
|
|
<template #header>
|
|
|
|
<li
|
|
|
|
v-if="workspace.customizations.processesList"
|
|
|
|
class="tab-item dropdown tools-dropdown"
|
2021-07-14 20:30:54 +02:00
|
|
|
>
|
2021-12-10 17:34:44 +01:00
|
|
|
<a
|
|
|
|
class="tab-link workspace-tools-link dropdown-toggle"
|
|
|
|
tabindex="0"
|
|
|
|
:title="$t('word.tools')"
|
2021-07-14 20:30:54 +02:00
|
|
|
>
|
2021-12-10 17:34:44 +01:00
|
|
|
<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"
|
2021-07-14 20:30:54 +02:00
|
|
|
>
|
2021-12-10 17:34:44 +01:00
|
|
|
<i class="mdi mdi-24px mdi-plus" />
|
|
|
|
</a>
|
|
|
|
</li>
|
|
|
|
</template>
|
2021-07-14 20:30:54 +02:00
|
|
|
</Draggable>
|
2021-07-18 16:10:36 +02:00
|
|
|
<WorkspaceEmptyState v-if="!workspace.tabs.length" @new-tab="addQueryTab" />
|
2021-07-13 09:09:25 +02:00
|
|
|
<template v-for="tab of workspace.tabs">
|
2021-08-12 09:54:13 +02:00
|
|
|
<WorkspaceTabQuery
|
2021-07-12 19:18:29 +02:00
|
|
|
v-if="tab.type==='query'"
|
|
|
|
:key="tab.uid"
|
2022-04-30 17:15:33 +02:00
|
|
|
:tab-uid="tab.uid"
|
2021-07-12 19:18:29 +02:00
|
|
|
:tab="tab"
|
|
|
|
:is-selected="selectedTab === tab.uid"
|
|
|
|
:connection="connection"
|
|
|
|
/>
|
2021-08-12 09:54:13 +02:00
|
|
|
<WorkspaceTabTable
|
2021-07-13 19:23:02 +02:00
|
|
|
v-else-if="['temp-data', 'data'].includes(tab.type)"
|
2021-07-13 09:09:25 +02:00
|
|
|
:key="tab.uid"
|
2022-04-30 17:15:33 +02:00
|
|
|
:tab-uid="tab.uid"
|
2021-07-12 19:18:29 +02:00
|
|
|
:connection="connection"
|
2021-07-13 09:09:25 +02:00
|
|
|
:is-selected="selectedTab === tab.uid"
|
2021-07-16 18:52:18 +02:00
|
|
|
:table="tab.elementName"
|
2021-07-12 19:18:29 +02:00
|
|
|
:schema="tab.schema"
|
2021-07-17 10:46:24 +02:00
|
|
|
:element-type="tab.elementType"
|
2021-07-12 19:18:29 +02:00
|
|
|
/>
|
2021-08-13 16:50:59 +02:00
|
|
|
<WorkspaceTabNewTable
|
|
|
|
v-else-if="tab.type === 'new-table'"
|
|
|
|
:key="tab.uid"
|
2022-04-30 17:15:33 +02:00
|
|
|
:tab-uid="tab.uid"
|
2021-08-13 16:50:59 +02:00
|
|
|
:tab="tab"
|
|
|
|
:connection="connection"
|
|
|
|
:is-selected="selectedTab === tab.uid"
|
|
|
|
:schema="tab.schema"
|
|
|
|
/>
|
2021-08-12 09:54:13 +02:00
|
|
|
<WorkspaceTabPropsTable
|
2021-07-15 19:51:18 +02:00
|
|
|
v-else-if="tab.type === 'table-props'"
|
|
|
|
:key="tab.uid"
|
2022-04-30 17:15:33 +02:00
|
|
|
:tab-uid="tab.uid"
|
2021-07-15 19:51:18 +02:00
|
|
|
:connection="connection"
|
|
|
|
:is-selected="selectedTab === tab.uid"
|
2021-07-16 18:52:18 +02:00
|
|
|
:table="tab.elementName"
|
|
|
|
:schema="tab.schema"
|
|
|
|
/>
|
2021-08-18 17:28:41 +02:00
|
|
|
<WorkspaceTabNewView
|
|
|
|
v-else-if="tab.type === 'new-view'"
|
|
|
|
:key="tab.uid"
|
2022-04-30 17:15:33 +02:00
|
|
|
:tab-uid="tab.uid"
|
2021-08-18 17:28:41 +02:00
|
|
|
:tab="tab"
|
|
|
|
:connection="connection"
|
|
|
|
:is-selected="selectedTab === tab.uid"
|
|
|
|
:schema="tab.schema"
|
|
|
|
/>
|
2021-08-12 09:54:13 +02:00
|
|
|
<WorkspaceTabPropsView
|
2021-07-16 18:52:18 +02:00
|
|
|
v-else-if="tab.type === 'view-props'"
|
|
|
|
:key="tab.uid"
|
2022-04-30 17:15:33 +02:00
|
|
|
:tab-uid="tab.uid"
|
2021-07-16 18:52:18 +02:00
|
|
|
:is-selected="selectedTab === tab.uid"
|
|
|
|
:connection="connection"
|
|
|
|
:view="tab.elementName"
|
2021-07-15 19:51:18 +02:00
|
|
|
:schema="tab.schema"
|
|
|
|
/>
|
2021-09-02 18:08:23 +02:00
|
|
|
<WorkspaceTabNewTrigger
|
|
|
|
v-else-if="tab.type === 'new-trigger'"
|
|
|
|
:key="tab.uid"
|
2022-04-30 17:15:33 +02:00
|
|
|
:tab-uid="tab.uid"
|
2021-09-02 18:08:23 +02:00
|
|
|
:tab="tab"
|
|
|
|
:connection="connection"
|
|
|
|
:is-selected="selectedTab === tab.uid"
|
|
|
|
:trigger="tab.elementName"
|
|
|
|
:schema="tab.schema"
|
|
|
|
/>
|
2021-08-12 09:54:13 +02:00
|
|
|
<WorkspaceTabPropsTrigger
|
2021-07-17 13:10:54 +02:00
|
|
|
v-else-if="['temp-trigger-props', 'trigger-props'].includes(tab.type)"
|
|
|
|
:key="tab.uid"
|
2022-04-30 17:15:33 +02:00
|
|
|
:tab-uid="tab.uid"
|
2021-07-17 13:10:54 +02:00
|
|
|
:connection="connection"
|
|
|
|
:is-selected="selectedTab === tab.uid"
|
|
|
|
:trigger="tab.elementName"
|
|
|
|
:schema="tab.schema"
|
|
|
|
/>
|
2021-09-11 10:24:21 +02:00
|
|
|
<WorkspaceTabNewTriggerFunction
|
|
|
|
v-else-if="tab.type === 'new-trigger-function'"
|
|
|
|
:key="tab.uid"
|
2022-04-30 17:15:33 +02:00
|
|
|
:tab-uid="tab.uid"
|
2021-09-11 10:24:21 +02:00
|
|
|
:tab="tab"
|
|
|
|
:connection="connection"
|
|
|
|
:is-selected="selectedTab === tab.uid"
|
|
|
|
:trigger="tab.elementName"
|
|
|
|
:schema="tab.schema"
|
|
|
|
/>
|
2021-08-12 09:54:13 +02:00
|
|
|
<WorkspaceTabPropsTriggerFunction
|
2021-07-19 22:38:56 +02:00
|
|
|
v-else-if="['temp-trigger-function-props', 'trigger-function-props'].includes(tab.type)"
|
|
|
|
:key="tab.uid"
|
2022-04-30 17:15:33 +02:00
|
|
|
:tab-uid="tab.uid"
|
2021-07-19 22:38:56 +02:00
|
|
|
:connection="connection"
|
|
|
|
:is-selected="selectedTab === tab.uid"
|
|
|
|
:function="tab.elementName"
|
|
|
|
:schema="tab.schema"
|
|
|
|
/>
|
2021-09-06 17:29:34 +02:00
|
|
|
<WorkspaceTabNewRoutine
|
|
|
|
v-else-if="tab.type === 'new-routine'"
|
|
|
|
:key="tab.uid"
|
2022-04-30 17:15:33 +02:00
|
|
|
:tab-uid="tab.uid"
|
2021-09-06 17:29:34 +02:00
|
|
|
:tab="tab"
|
|
|
|
:connection="connection"
|
|
|
|
:is-selected="selectedTab === tab.uid"
|
|
|
|
:trigger="tab.elementName"
|
|
|
|
:schema="tab.schema"
|
|
|
|
/>
|
2021-08-12 09:54:13 +02:00
|
|
|
<WorkspaceTabPropsRoutine
|
2021-07-20 16:59:59 +02:00
|
|
|
v-else-if="['temp-routine-props', 'routine-props'].includes(tab.type)"
|
|
|
|
:key="tab.uid"
|
2022-04-30 17:15:33 +02:00
|
|
|
:tab-uid="tab.uid"
|
2021-07-20 16:59:59 +02:00
|
|
|
:connection="connection"
|
|
|
|
:is-selected="selectedTab === tab.uid"
|
|
|
|
:routine="tab.elementName"
|
|
|
|
:schema="tab.schema"
|
|
|
|
/>
|
2021-09-07 18:20:45 +02:00
|
|
|
<WorkspaceTabNewFunction
|
|
|
|
v-else-if="tab.type === 'new-function'"
|
|
|
|
:key="tab.uid"
|
2022-04-30 17:15:33 +02:00
|
|
|
:tab-uid="tab.uid"
|
2021-09-07 18:20:45 +02:00
|
|
|
:tab="tab"
|
|
|
|
:connection="connection"
|
|
|
|
:is-selected="selectedTab === tab.uid"
|
|
|
|
:trigger="tab.elementName"
|
|
|
|
:schema="tab.schema"
|
|
|
|
/>
|
2021-08-12 09:54:13 +02:00
|
|
|
<WorkspaceTabPropsFunction
|
2021-07-20 16:59:59 +02:00
|
|
|
v-else-if="['temp-function-props', 'function-props'].includes(tab.type)"
|
|
|
|
:key="tab.uid"
|
2022-04-30 17:15:33 +02:00
|
|
|
:tab-uid="tab.uid"
|
2021-07-20 16:59:59 +02:00
|
|
|
:connection="connection"
|
|
|
|
:is-selected="selectedTab === tab.uid"
|
|
|
|
:function="tab.elementName"
|
|
|
|
:schema="tab.schema"
|
|
|
|
/>
|
2021-09-10 18:23:32 +02:00
|
|
|
<WorkspaceTabNewScheduler
|
|
|
|
v-else-if="tab.type === 'new-scheduler'"
|
|
|
|
:key="tab.uid"
|
2022-04-30 17:15:33 +02:00
|
|
|
:tab-uid="tab.uid"
|
2021-09-10 18:23:32 +02:00
|
|
|
:tab="tab"
|
|
|
|
:connection="connection"
|
|
|
|
:is-selected="selectedTab === tab.uid"
|
|
|
|
:trigger="tab.elementName"
|
|
|
|
:schema="tab.schema"
|
|
|
|
/>
|
2021-08-12 09:54:13 +02:00
|
|
|
<WorkspaceTabPropsScheduler
|
2021-07-20 16:59:59 +02:00
|
|
|
v-else-if="['temp-scheduler-props', 'scheduler-props'].includes(tab.type)"
|
|
|
|
:key="tab.uid"
|
2022-04-30 17:15:33 +02:00
|
|
|
:tab-uid="tab.uid"
|
2021-07-20 16:59:59 +02:00
|
|
|
:connection="connection"
|
|
|
|
:is-selected="selectedTab === tab.uid"
|
|
|
|
:scheduler="tab.elementName"
|
|
|
|
:schema="tab.schema"
|
|
|
|
/>
|
2021-07-13 09:09:25 +02:00
|
|
|
</template>
|
2020-05-14 15:21:57 +02:00
|
|
|
</div>
|
2022-03-24 17:34:24 +01:00
|
|
|
<div v-else class="connection-panel-wrapper">
|
|
|
|
<WorkspaceEditConnectionPanel :connection="connection" />
|
|
|
|
</div>
|
2021-03-03 19:31:05 +01:00
|
|
|
<ModalProcessesList
|
|
|
|
v-if="isProcessesModal"
|
|
|
|
:connection="connection"
|
|
|
|
@close="hideProcessesModal"
|
|
|
|
/>
|
2021-07-16 23:24:55 +02:00
|
|
|
|
|
|
|
<ModalDiscardChanges
|
|
|
|
v-if="unsavedTab"
|
|
|
|
@confirm="closeTab(unsavedTab, true)"
|
|
|
|
@close="unsavedTab = null"
|
|
|
|
/>
|
2020-05-14 15:21:57 +02:00
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
2022-04-30 00:47:37 +02:00
|
|
|
import { storeToRefs } from 'pinia';
|
2021-07-14 20:30:54 +02:00
|
|
|
import Draggable from 'vuedraggable';
|
2020-05-14 15:21:57 +02:00
|
|
|
import Connection from '@/ipc-api/Connection';
|
2022-04-30 00:47:37 +02:00
|
|
|
import { useWorkspacesStore } from '@/stores/workspaces';
|
|
|
|
|
2021-07-18 16:10:36 +02:00
|
|
|
import WorkspaceEmptyState from '@/components/WorkspaceEmptyState';
|
2020-06-03 20:56:44 +02:00
|
|
|
import WorkspaceExploreBar from '@/components/WorkspaceExploreBar';
|
2021-07-08 15:06:20 +02:00
|
|
|
import WorkspaceEditConnectionPanel from '@/components/WorkspaceEditConnectionPanel';
|
2021-08-12 09:54:13 +02:00
|
|
|
import WorkspaceTabQuery from '@/components/WorkspaceTabQuery';
|
|
|
|
import WorkspaceTabTable from '@/components/WorkspaceTabTable';
|
2021-08-13 16:50:59 +02:00
|
|
|
|
|
|
|
import WorkspaceTabNewTable from '@/components/WorkspaceTabNewTable';
|
2021-08-18 17:28:41 +02:00
|
|
|
import WorkspaceTabNewView from '@/components/WorkspaceTabNewView';
|
2021-09-02 18:08:23 +02:00
|
|
|
import WorkspaceTabNewTrigger from '@/components/WorkspaceTabNewTrigger';
|
2021-09-06 17:29:34 +02:00
|
|
|
import WorkspaceTabNewRoutine from '@/components/WorkspaceTabNewRoutine';
|
2021-09-07 18:20:45 +02:00
|
|
|
import WorkspaceTabNewFunction from '@/components/WorkspaceTabNewFunction';
|
2021-09-10 18:23:32 +02:00
|
|
|
import WorkspaceTabNewScheduler from '@/components/WorkspaceTabNewScheduler';
|
2021-09-11 10:24:21 +02:00
|
|
|
import WorkspaceTabNewTriggerFunction from '@/components/WorkspaceTabNewTriggerFunction';
|
2021-08-13 16:50:59 +02:00
|
|
|
|
2021-08-12 09:54:13 +02:00
|
|
|
import WorkspaceTabPropsTable from '@/components/WorkspaceTabPropsTable';
|
|
|
|
import WorkspaceTabPropsView from '@/components/WorkspaceTabPropsView';
|
|
|
|
import WorkspaceTabPropsTrigger from '@/components/WorkspaceTabPropsTrigger';
|
|
|
|
import WorkspaceTabPropsTriggerFunction from '@/components/WorkspaceTabPropsTriggerFunction';
|
|
|
|
import WorkspaceTabPropsRoutine from '@/components/WorkspaceTabPropsRoutine';
|
|
|
|
import WorkspaceTabPropsFunction from '@/components/WorkspaceTabPropsFunction';
|
|
|
|
import WorkspaceTabPropsScheduler from '@/components/WorkspaceTabPropsScheduler';
|
2021-03-03 19:31:05 +01:00
|
|
|
import ModalProcessesList from '@/components/ModalProcessesList';
|
2021-07-16 23:24:55 +02:00
|
|
|
import ModalDiscardChanges from '@/components/ModalDiscardChanges';
|
2020-05-14 15:21:57 +02:00
|
|
|
|
|
|
|
export default {
|
2020-06-03 20:56:44 +02:00
|
|
|
name: 'Workspace',
|
2020-05-14 15:21:57 +02:00
|
|
|
components: {
|
2021-07-14 20:30:54 +02:00
|
|
|
Draggable,
|
2021-07-18 16:10:36 +02:00
|
|
|
WorkspaceEmptyState,
|
2020-06-05 21:00:15 +02:00
|
|
|
WorkspaceExploreBar,
|
2021-07-08 15:06:20 +02:00
|
|
|
WorkspaceEditConnectionPanel,
|
2021-08-12 09:54:13 +02:00
|
|
|
WorkspaceTabQuery,
|
|
|
|
WorkspaceTabTable,
|
2021-08-13 16:50:59 +02:00
|
|
|
WorkspaceTabNewTable,
|
2021-08-12 09:54:13 +02:00
|
|
|
WorkspaceTabPropsTable,
|
2021-09-02 18:08:23 +02:00
|
|
|
WorkspaceTabNewView,
|
2021-08-12 09:54:13 +02:00
|
|
|
WorkspaceTabPropsView,
|
2021-09-02 18:08:23 +02:00
|
|
|
WorkspaceTabNewTrigger,
|
2021-08-12 09:54:13 +02:00
|
|
|
WorkspaceTabPropsTrigger,
|
2021-09-11 10:24:21 +02:00
|
|
|
WorkspaceTabNewTriggerFunction,
|
2021-08-12 09:54:13 +02:00
|
|
|
WorkspaceTabPropsTriggerFunction,
|
2021-09-06 17:29:34 +02:00
|
|
|
WorkspaceTabNewRoutine,
|
2021-09-07 18:20:45 +02:00
|
|
|
WorkspaceTabNewFunction,
|
2021-08-12 09:54:13 +02:00
|
|
|
WorkspaceTabPropsRoutine,
|
|
|
|
WorkspaceTabPropsFunction,
|
2021-09-10 18:23:32 +02:00
|
|
|
WorkspaceTabNewScheduler,
|
2021-08-12 09:54:13 +02:00
|
|
|
WorkspaceTabPropsScheduler,
|
2021-07-16 23:24:55 +02:00
|
|
|
ModalProcessesList,
|
|
|
|
ModalDiscardChanges
|
2020-05-14 15:21:57 +02:00
|
|
|
},
|
|
|
|
props: {
|
|
|
|
connection: Object
|
|
|
|
},
|
2022-04-30 00:47:37 +02:00
|
|
|
setup () {
|
|
|
|
const workspacesStore = useWorkspacesStore();
|
|
|
|
|
|
|
|
const { getSelected: selectedWorkspace } = storeToRefs(workspacesStore);
|
|
|
|
|
|
|
|
const {
|
|
|
|
getWorkspace,
|
|
|
|
addWorkspace,
|
|
|
|
connectWorkspace,
|
|
|
|
removeConnected,
|
|
|
|
selectTab,
|
|
|
|
newTab,
|
|
|
|
removeTab,
|
|
|
|
updateTabs
|
|
|
|
} = workspacesStore;
|
|
|
|
|
|
|
|
return {
|
|
|
|
selectedWorkspace,
|
|
|
|
getWorkspace,
|
|
|
|
addWorkspace,
|
|
|
|
connectWorkspace,
|
|
|
|
removeConnected,
|
|
|
|
selectTab,
|
|
|
|
newTab,
|
|
|
|
removeTab,
|
|
|
|
updateTabs
|
|
|
|
};
|
|
|
|
},
|
2020-10-26 09:28:29 +01:00
|
|
|
data () {
|
|
|
|
return {
|
2021-03-03 19:31:05 +01:00
|
|
|
hasWheelEvent: false,
|
2021-07-16 23:24:55 +02:00
|
|
|
isProcessesModal: false,
|
|
|
|
unsavedTab: null
|
2020-10-26 09:28:29 +01:00
|
|
|
};
|
|
|
|
},
|
2020-05-14 15:21:57 +02:00
|
|
|
computed: {
|
2020-05-20 18:00:14 +02:00
|
|
|
workspace () {
|
|
|
|
return this.getWorkspace(this.connection.uid);
|
2020-06-02 19:13:57 +02:00
|
|
|
},
|
2021-07-14 20:30:54 +02:00
|
|
|
draggableTabs: {
|
|
|
|
get () {
|
|
|
|
return this.workspace.tabs;
|
|
|
|
},
|
|
|
|
set (val) {
|
|
|
|
this.updateTabs({ uid: this.connection.uid, tabs: val });
|
|
|
|
}
|
|
|
|
},
|
2020-06-02 19:13:57 +02:00
|
|
|
isSelected () {
|
|
|
|
return this.selectedWorkspace === this.connection.uid;
|
2020-06-05 21:00:15 +02:00
|
|
|
},
|
2021-03-16 18:42:03 +01:00
|
|
|
isSettingSupported () {
|
|
|
|
if (this.workspace.breadcrumbs.table && this.workspace.customizations.tableSettings) return true;
|
|
|
|
if (this.workspace.breadcrumbs.view && this.workspace.customizations.viewSettings) return true;
|
|
|
|
if (this.workspace.breadcrumbs.trigger && this.workspace.customizations.triggerSettings) return true;
|
|
|
|
if (this.workspace.breadcrumbs.procedure && this.workspace.customizations.routineSettings) return true;
|
|
|
|
if (this.workspace.breadcrumbs.function && this.workspace.customizations.functionSettings) return true;
|
2021-07-03 11:29:14 +02:00
|
|
|
if (this.workspace.breadcrumbs.triggerFunction && this.workspace.customizations.functionSettings) return true;
|
2021-03-16 18:42:03 +01:00
|
|
|
if (this.workspace.breadcrumbs.scheduler && this.workspace.customizations.schedulerSettings) return true;
|
|
|
|
return false;
|
|
|
|
},
|
2020-06-05 21:00:15 +02:00
|
|
|
selectedTab () {
|
2021-08-06 14:38:25 +02:00
|
|
|
return this.workspace ? this.workspace.selectedTab : null;
|
2020-06-12 18:10:45 +02:00
|
|
|
},
|
|
|
|
queryTabs () {
|
2022-01-09 12:28:01 +01:00
|
|
|
return this.workspace ? this.workspace.tabs.filter(tab => tab.type === 'query') : [];
|
2020-12-26 15:37:34 +01:00
|
|
|
},
|
|
|
|
schemaChild () {
|
|
|
|
for (const key in this.workspace.breadcrumbs) {
|
|
|
|
if (key === 'schema') continue;
|
|
|
|
if (this.workspace.breadcrumbs[key]) return this.workspace.breadcrumbs[key];
|
|
|
|
}
|
|
|
|
return false;
|
2021-11-24 09:19:42 +01:00
|
|
|
},
|
|
|
|
hasTools () {
|
2022-04-30 16:11:44 +02:00
|
|
|
if (!this.workspace.customizations) return false;
|
|
|
|
else {
|
|
|
|
return this.workspace.customizations.processesList ||
|
2021-11-24 09:19:42 +01:00
|
|
|
this.workspace.customizations.usersManagement ||
|
|
|
|
this.workspace.customizations.variables;
|
2022-04-30 16:11:44 +02:00
|
|
|
}
|
2020-05-20 18:00:14 +02:00
|
|
|
}
|
2020-05-14 15:21:57 +02:00
|
|
|
},
|
2021-08-05 13:44:48 +02:00
|
|
|
watch: {
|
2022-04-21 14:39:24 +02:00
|
|
|
queryTabs: {
|
|
|
|
handler (newVal, oldVal) {
|
|
|
|
if (newVal.length > oldVal.length) {
|
|
|
|
setTimeout(() => {
|
|
|
|
const scroller = this.$refs.tabWrap;
|
|
|
|
if (scroller) scroller.$el.scrollLeft = scroller.$el.scrollWidth;
|
|
|
|
}, 0);
|
|
|
|
}
|
|
|
|
},
|
|
|
|
deep: true
|
2021-08-05 13:44:48 +02:00
|
|
|
}
|
|
|
|
},
|
2020-05-14 15:21:57 +02:00
|
|
|
async created () {
|
2021-10-16 17:05:26 +02:00
|
|
|
window.addEventListener('keydown', this.onKey);
|
2020-06-05 21:00:15 +02:00
|
|
|
await this.addWorkspace(this.connection.uid);
|
2020-05-17 19:34:56 +02:00
|
|
|
const isInitiated = await Connection.checkConnection(this.connection.uid);
|
2020-05-19 18:06:05 +02:00
|
|
|
if (isInitiated)
|
|
|
|
this.connectWorkspace(this.connection);
|
2020-05-14 15:21:57 +02:00
|
|
|
},
|
2022-04-21 14:39:24 +02:00
|
|
|
beforeUnmount () {
|
2021-10-16 17:05:26 +02:00
|
|
|
window.removeEventListener('keydown', this.onKey);
|
|
|
|
},
|
2020-05-14 15:21:57 +02:00
|
|
|
methods: {
|
2021-07-12 19:18:29 +02:00
|
|
|
addQueryTab () {
|
|
|
|
this.newTab({ uid: this.connection.uid, type: 'query' });
|
2021-07-13 19:23:02 +02:00
|
|
|
},
|
2021-10-16 17:05:26 +02:00
|
|
|
getSelectedTab () {
|
|
|
|
return this.workspace.tabs.find(tab => tab.uid === this.selectedTab);
|
|
|
|
},
|
|
|
|
onKey (e) {
|
|
|
|
e.stopPropagation();
|
|
|
|
|
|
|
|
if (!this.isSelected)
|
|
|
|
return;
|
|
|
|
|
2021-10-16 18:43:23 +02:00
|
|
|
if ((e.ctrlKey || e.metaKey) && e.keyCode === 84 && !e.altKey) { // CTRL|Command + t
|
2021-10-16 17:05:26 +02:00
|
|
|
this.addQueryTab();
|
|
|
|
}
|
|
|
|
|
2021-10-16 18:43:23 +02:00
|
|
|
if ((e.ctrlKey || e.metaKey) && e.keyCode === 87 && !e.altKey) { // CTRL|Command + w
|
2021-10-16 17:05:26 +02:00
|
|
|
const currentTab = this.getSelectedTab();
|
|
|
|
if (currentTab)
|
|
|
|
this.closeTab(currentTab);
|
|
|
|
}
|
|
|
|
},
|
2021-07-17 13:10:54 +02:00
|
|
|
openAsPermanentTab (tab) {
|
|
|
|
const permanentTabs = {
|
|
|
|
table: 'data',
|
|
|
|
view: 'data',
|
2021-07-19 22:38:56 +02:00
|
|
|
trigger: 'trigger-props',
|
2021-07-21 14:40:29 +02:00
|
|
|
triggerFunction: 'trigger-function-props',
|
|
|
|
function: 'function-props',
|
|
|
|
routine: 'routine-props',
|
|
|
|
scheduler: 'scheduler-props'
|
2021-07-17 13:10:54 +02:00
|
|
|
};
|
|
|
|
|
|
|
|
this.newTab({
|
|
|
|
uid: this.connection.uid,
|
|
|
|
schema: tab.schema,
|
|
|
|
elementName: tab.elementName,
|
|
|
|
type: permanentTabs[tab.elementType],
|
|
|
|
elementType: tab.elementType
|
|
|
|
});
|
2020-08-19 18:20:57 +02:00
|
|
|
},
|
2021-07-16 23:24:55 +02:00
|
|
|
closeTab (tab, force) {
|
|
|
|
this.unsavedTab = null;
|
2021-07-18 16:10:36 +02:00
|
|
|
// if (tab.type === 'query' && this.queryTabs.length === 1) return;
|
2021-07-16 23:24:55 +02:00
|
|
|
if (!force && tab.isChanged) {
|
|
|
|
this.unsavedTab = tab;
|
|
|
|
return;
|
|
|
|
}
|
2021-07-13 16:53:47 +02:00
|
|
|
|
|
|
|
this.removeTab({ uid: this.connection.uid, tab: tab.uid });
|
2021-03-03 19:31:05 +01:00
|
|
|
},
|
|
|
|
showProcessesModal () {
|
|
|
|
this.isProcessesModal = true;
|
|
|
|
},
|
|
|
|
hideProcessesModal () {
|
|
|
|
this.isProcessesModal = false;
|
2021-07-13 19:23:02 +02:00
|
|
|
},
|
|
|
|
addWheelEvent () {
|
|
|
|
if (!this.hasWheelEvent) {
|
2021-07-14 20:30:54 +02:00
|
|
|
this.$refs.tabWrap.$el.addEventListener('wheel', e => {
|
|
|
|
if (e.deltaY > 0) this.$refs.tabWrap.$el.scrollLeft += 50;
|
|
|
|
else this.$refs.tabWrap.$el.scrollLeft -= 50;
|
2021-07-13 19:23:02 +02:00
|
|
|
});
|
|
|
|
this.hasWheelEvent = true;
|
|
|
|
}
|
2022-04-21 14:39:24 +02:00
|
|
|
},
|
|
|
|
cutText (string) {
|
|
|
|
const limit = 20;
|
|
|
|
const escapedString = string.replace(/\s{2,}/g, ' ');
|
|
|
|
if (escapedString.length > limit)
|
|
|
|
return `${escapedString.substr(0, limit)}...`;
|
|
|
|
return escapedString;
|
2020-08-19 18:20:57 +02:00
|
|
|
}
|
2020-05-14 15:21:57 +02:00
|
|
|
}
|
|
|
|
};
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<style lang="scss">
|
2020-07-31 18:16:28 +02:00
|
|
|
.workspace {
|
|
|
|
padding: 0;
|
|
|
|
margin: 0;
|
|
|
|
|
|
|
|
.workspace-tabs {
|
2020-08-20 10:38:18 +02:00
|
|
|
overflow: hidden;
|
2020-07-31 18:16:28 +02:00
|
|
|
height: calc(100vh - #{$excluding-size});
|
|
|
|
|
|
|
|
.tab-block {
|
|
|
|
margin-top: 0;
|
2020-08-20 10:38:18 +02:00
|
|
|
flex-direction: row;
|
|
|
|
align-items: flex-start;
|
|
|
|
flex-wrap: nowrap;
|
|
|
|
overflow: auto;
|
2020-12-23 18:07:50 +01:00
|
|
|
margin-bottom: 0;
|
2020-08-20 10:38:18 +02:00
|
|
|
|
|
|
|
&::-webkit-scrollbar {
|
|
|
|
width: 2px;
|
|
|
|
height: 2px;
|
|
|
|
}
|
2020-07-31 18:16:28 +02:00
|
|
|
|
|
|
|
.tab-item {
|
|
|
|
width: fit-content;
|
|
|
|
flex: initial;
|
|
|
|
|
|
|
|
> a {
|
2021-07-14 16:10:34 +02:00
|
|
|
padding: 0.2rem 0.6rem;
|
2020-07-31 18:16:28 +02:00
|
|
|
cursor: pointer;
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
opacity: 0.7;
|
|
|
|
transition: opacity 0.2s;
|
|
|
|
|
2021-07-16 23:24:55 +02:00
|
|
|
&.badge::after {
|
|
|
|
position: absolute;
|
|
|
|
right: 35px;
|
|
|
|
top: 25px;
|
|
|
|
}
|
|
|
|
|
2021-07-14 16:10:34 +02:00
|
|
|
.btn-clear {
|
|
|
|
margin-left: 0.5rem;
|
|
|
|
opacity: 0;
|
|
|
|
transition: opacity 0.2s;
|
|
|
|
}
|
|
|
|
|
2020-07-31 18:16:28 +02:00
|
|
|
&:hover {
|
|
|
|
opacity: 1;
|
2021-07-14 16:10:34 +02:00
|
|
|
|
|
|
|
.btn-clear {
|
|
|
|
opacity: 1;
|
|
|
|
}
|
2020-07-31 18:16:28 +02:00
|
|
|
}
|
|
|
|
|
2020-08-19 18:20:57 +02:00
|
|
|
&.tab-add {
|
|
|
|
padding: 0.2rem 0.4rem;
|
2020-08-20 10:38:18 +02:00
|
|
|
margin-top: 2px;
|
2020-08-19 18:20:57 +02:00
|
|
|
border: 0;
|
|
|
|
}
|
|
|
|
|
2020-07-31 18:16:28 +02:00
|
|
|
> span {
|
|
|
|
overflow: hidden;
|
|
|
|
white-space: nowrap;
|
|
|
|
text-overflow: ellipsis;
|
2020-08-19 18:20:57 +02:00
|
|
|
padding: 0 0.2rem;
|
2020-07-31 18:16:28 +02:00
|
|
|
}
|
|
|
|
}
|
2020-08-10 16:06:11 +02:00
|
|
|
|
|
|
|
&.active a {
|
|
|
|
opacity: 1;
|
2021-07-14 16:10:34 +02:00
|
|
|
|
|
|
|
.btn-clear {
|
|
|
|
opacity: 1;
|
|
|
|
}
|
2020-08-10 16:06:11 +02:00
|
|
|
}
|
2020-10-24 14:47:35 +02:00
|
|
|
|
2021-03-03 19:31:05 +01:00
|
|
|
&.tools-dropdown {
|
2021-07-14 20:30:54 +02:00
|
|
|
height: 34px;
|
|
|
|
|
2021-03-03 19:31:05 +01:00
|
|
|
.tab-link:focus {
|
|
|
|
opacity: 1;
|
|
|
|
outline: 0;
|
|
|
|
box-shadow: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
.menu {
|
|
|
|
min-width: 100%;
|
|
|
|
|
|
|
|
.menu-item a {
|
2021-06-24 21:49:46 +02:00
|
|
|
border-radius: $border-radius;
|
2021-03-03 19:31:05 +01:00
|
|
|
color: inherit;
|
|
|
|
display: block;
|
|
|
|
margin: 0 -0.4rem;
|
|
|
|
padding: 0.2rem 0.4rem;
|
|
|
|
text-decoration: none;
|
|
|
|
white-space: nowrap;
|
|
|
|
border: 0;
|
|
|
|
|
|
|
|
.tool-icon {
|
|
|
|
line-height: 1;
|
|
|
|
display: inline-block;
|
|
|
|
font-size: 20px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
z-index: 9;
|
|
|
|
position: absolute;
|
|
|
|
}
|
|
|
|
|
|
|
|
&.tools-dropdown + .tab-item {
|
|
|
|
margin-left: 56px;
|
|
|
|
}
|
|
|
|
|
2020-10-24 14:47:35 +02:00
|
|
|
.workspace-tools-link {
|
|
|
|
padding-bottom: 0;
|
|
|
|
padding-top: 0.3rem;
|
|
|
|
}
|
2020-07-31 18:16:28 +02:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2020-06-05 21:00:15 +02:00
|
|
|
}
|
2020-05-14 15:21:57 +02:00
|
|
|
</style>
|