MrUnknownDE/VRCX
1
0
Fork 0
mirror of https://github.com/MrUnknownDE/VRCX.git synced 2026-05-07 06:56:04 +02:00
Code Issues Packages Projects Releases Wiki Activity

replace clickable el-popover with Popover components

Browse Source
This commit is contained in:
pa
2026-01-07 19:59:33 +09:00
committed by Natsumi
parent 738d22461e
commit acbc0ca0fc
12 changed files with 517 additions and 395 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/Favorites/FavoritesFriend.vue
+56 -58
View File
@@ -95,71 +95,68 @@
<Badge variant="outline">
{{ formatVisibility(group.visibility) }}
</Badge>
<el-popover
:visible="activeGroupMenu === remoteGroupMenuKey(group.key)"
@update:visible="
<Popover
:open="activeGroupMenu === remoteGroupMenuKey(group.key)"
@update:open="
handleGroupMenuVisible(remoteGroupMenuKey(group.key), $event)
"
placement="right"
trigger="click"
:hide-after="0"
:width="220"
popper-style="padding: 4px; border-radius: 8px;">
<template #reference>
">
<PopoverTrigger asChild>
<el-button
text
size="small"
:icon="MoreFilled"
circle
@click.stop></el-button>
</template>
<div class="favorites-group-menu">
<button
type="button"
class="favorites-group-menu__item"
@click="handleRemoteRename(group)">
<span>{{ t('view.favorite.rename_tooltip') }}</span>
</button>
<el-popover
placement="right"
trigger="hover"
:width="180"
popper-style="padding: 4px; border-radius: 8px;">
<div class="group-visibility-menu">
<button
v-for="visibility in friendGroupVisibilityOptions"
:key="visibility"
type="button"
:class="[
'group-visibility-menu__item',
{ 'is-active': group.visibility === visibility }
]"
@click="handleVisibilitySelection(group, visibility)">
<span>{{ formatVisibility(visibility) }}</span>
<span
v-if="group.visibility === visibility"
class="group-visibility-menu__check">
<i class="ri-check-line"></i>
</span>
</button>
</div>
<template #reference>
<button
type="button"
class="favorites-group-menu__item favorites-group-menu__item--submenu">
<span>{{ t('view.favorite.visibility_tooltip') }}</span>
<span class="favorites-group-menu__arrow">›</span>
</button>
</template>
</el-popover>
<button
type="button"
class="favorites-group-menu__item favorites-group-menu__item--danger"
@click="handleRemoteClear(group)">
<span>{{ t('view.favorite.clear') }}</span>
</button>
</div>
</el-popover>
</PopoverTrigger>
<PopoverContent side="right" class="w-[220px] p-1 rounded-lg">
<div class="favorites-group-menu">
<button
type="button"
class="favorites-group-menu__item"
@click="handleRemoteRename(group)">
<span>{{ t('view.favorite.rename_tooltip') }}</span>
</button>
<el-popover
placement="right"
trigger="hover"
:width="180"
popper-style="padding: 4px; border-radius: 8px;">
<div class="group-visibility-menu">
<button
v-for="visibility in friendGroupVisibilityOptions"
:key="visibility"
type="button"
:class="[
'group-visibility-menu__item',
{ 'is-active': group.visibility === visibility }
]"
@click="handleVisibilitySelection(group, visibility)">
<span>{{ formatVisibility(visibility) }}</span>
<span
v-if="group.visibility === visibility"
class="group-visibility-menu__check">
<i class="ri-check-line"></i>
</span>
</button>
</div>
<template #reference>
<button
type="button"
class="favorites-group-menu__item favorites-group-menu__item--submenu">
<span>{{ t('view.favorite.visibility_tooltip') }}</span>
<span class="favorites-group-menu__arrow">›</span>
</button>
</template>
</el-popover>
<button
type="button"
class="favorites-group-menu__item favorites-group-menu__item--danger"
@click="handleRemoteClear(group)">
<span>{{ t('view.favorite.clear') }}</span>
</button>
</div>
</PopoverContent>
</Popover>
</div>
</div>
</template>
@@ -287,6 +284,7 @@
import { toast } from 'vue-sonner';
import { useI18n } from 'vue-i18n';
import { Popover, PopoverContent, PopoverTrigger } from '../../components/ui/popover';
import { useAppearanceSettingsStore, useFavoriteStore, useUserStore } from '../../stores';
import { Badge } from '../../components/ui/badge';
import { favoriteRequest } from '../../api';