btwedutech/hoppscotch
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 6 Wiki Activity

refactor(ui): popovers

Browse Source
This commit is contained in:
Liyas Thomas
2021-07-05 16:52:15 +00:00
committed by GitHub
parent 256d4b3e07
commit ed91486d53
42 changed files with 828 additions and 866 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
components/teams/Edit.vue
View File

@@ -55,7 +55,13 @@
</li>
<li>
<span class="select-wrapper">
<tippy tabindex="-1" trigger="click" theme="popover" arrow>
<tippy
ref="options"
tabindex="-1"
trigger="click"
theme="popover"
arrow
>
<template #trigger>
<input
class="input"
@@ -69,18 +75,27 @@
readonly
/>
</template>
<div>
<ButtonSecondary @click.native="updateRole(index, 'OWNER')" />
OWNER
</div>
<div>
<ButtonSecondary @click.native="updateRole(index, 'EDITOR')" />
EDITOR
</div>
<div>
<ButtonSecondary @click.native="updateRole(index, 'VIEWER')" />
VIEWER
</div>
<SmartItem
label="OWNER"
@click.native="
updateRole(index, 'OWNER')
$refs.options.tippy().hide()
"
/>
<SmartItem
label="EDITOR"
@click.native="
updateRole(index, 'EDITOR')
$refs.options.tippy().hide()
"
/>
<SmartItem
label="VIEWER"
@click.native="
updateRole(index, 'VIEWER')
$refs.options.tippy().hide()
"
/>
</tippy>
</span>
</li>
@@ -119,7 +134,13 @@
</li>
<li>
<span class="select-wrapper">
<tippy tabindex="-1" trigger="click" theme="popover" arrow>
<tippy
ref="memberOptions"
tabindex="-1"
trigger="click"
theme="popover"
arrow
>
<template #trigger>
<input
class="input"
@@ -133,18 +154,27 @@
readonly
/>
</template>
<div>
<ButtonSecondary @click.native="member.value = 'OWNER'" />
OWNER
</div>
<div>
<ButtonSecondary @click.native="member.value = 'EDITOR'" />
EDITOR
</div>
<div>
<ButtonSecondary @click.native="member.value = 'VIEWER'" />
VIEWER
</div>
<SmartItem
label="OWNER"
@click.native="
member.value = 'OWNER'
$refs.options.tippy().hide()
"
/>
<SmartItem
label="EDITOR"
@click.native="
member.value = 'EDITOR'
$refs.options.tippy().hide()
"
/>
<SmartItem
label="VIEWER"
@click.native="
member.value = 'VIEWER'
$refs.options.tippy().hide()
"
/>
</tippy>
</span>
</li>

69
components/teams/Team.vue
View File

@@ -9,46 +9,47 @@
@click.native="team.myRole === 'OWNER' ? $emit('edit-team') : ''"
/>
</div>
<tippy tabindex="-1" trigger="click" theme="popover" arrow>
<tippy ref="options" tabindex="-1" trigger="click" theme="popover" arrow>
<template #trigger>
<ButtonSecondary
<TabPrimary
v-tippy="{ theme: 'tooltip' }"
:title="$t('more')"
icon="more_vert"
/>
</template>
<div v-if="team.myRole === 'OWNER'">
<ButtonSecondary
icon="create"
:label="$t('edit')"
@click.native="$emit('edit-team')"
/>
</div>
<div v-if="team.myRole === 'OWNER'">
<ButtonSecondary
icon="delete"
:label="$t('delete')"
@click.native="deleteTeam"
/>
</div>
<div>
<ButtonSecondary
:disabled="team.myRole === 'OWNER' && team.ownersCount == 1"
icon="remove"
@click.native="exitTeam"
/>
<div
v-tippy="{ theme: 'tooltip' }"
title="{
content:
team.myRole === 'OWNER' && team.ownersCount == 1
? $t('disable_exit')
: '',
}"
>
<span>{{ $t("exit") }}</span>
</div>
</div>
<SmartItem
v-if="team.myRole === 'OWNER'"
icon="create"
:label="$t('edit')"
@click.native="
$emit('edit-team')
$refs.options.tippy().hide()
"
/>
<SmartItem
v-if="team.myRole === 'OWNER'"
icon="delete"
:label="$t('delete')"
@click.native="
deleteTeam
$refs.options.tippy().hide()
"
/>
<SmartItem
v-tippy="{ theme: 'tooltip' }"
:title="
team.myRole === 'OWNER' && team.ownersCount == 1
? $t('disable_exit')
: ''
"
:disabled="team.myRole === 'OWNER' && team.ownersCount == 1"
icon="remove"
:label="$t('exit')"
@click.native="
exitTeam
$refs.options.tippy().hide()
"
/>
</tippy>
</div>
</template>