mirror of
https://github.com/MrUnknownDE/VRCX.git
synced 2026-05-05 22:36:05 +02:00
replace dropdown
This commit is contained in:
@@ -1,40 +1,46 @@
|
||||
<template>
|
||||
<el-dropdown trigger="hover" size="small" style="margin-left: 5px" :persistent="false">
|
||||
<div>
|
||||
<DropdownMenu v-model:open="moveDropdownOpen" style="margin-left: 5px">
|
||||
<DropdownMenuTrigger as-child>
|
||||
<el-button type="default" :icon="Back" size="small" circle></el-button>
|
||||
</div>
|
||||
<template #dropdown>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent class="favorites-dropdown">
|
||||
<span style="font-weight: bold; display: block; text-align: center">
|
||||
{{ t(tooltipContent) }}
|
||||
</span>
|
||||
<el-dropdown-menu>
|
||||
<template v-for="groupAPI in favoriteGroup" :key="groupAPI.name">
|
||||
<el-dropdown-item
|
||||
v-if="isLocalFavorite || groupAPI.name !== currentGroup?.name"
|
||||
style="display: block; margin: 10px 0"
|
||||
:disabled="groupAPI.count >= groupAPI.capacity"
|
||||
@click="handleDropdownItemClick(groupAPI)">
|
||||
{{ groupAPI.displayName }} ({{ groupAPI.count }} / {{ groupAPI.capacity }})
|
||||
</el-dropdown-item>
|
||||
</template>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<DropdownMenuSeparator />
|
||||
<DropdownMenuItem
|
||||
v-for="groupAPI in favoriteGroupList"
|
||||
:key="groupAPI.name"
|
||||
v-if="isLocalFavorite || groupAPI?.name !== currentGroup?.name"
|
||||
style="display: block; margin: 10px 0"
|
||||
:disabled="groupAPI.count >= groupAPI.capacity"
|
||||
@click="handleDropdownItemClick(groupAPI)">
|
||||
{{ groupAPI.displayName }} ({{ groupAPI.count }} / {{ groupAPI.capacity }})
|
||||
</DropdownMenuItem>
|
||||
</DropdownMenuContent>
|
||||
</DropdownMenu>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, ref } from 'vue';
|
||||
import { Back } from '@element-plus/icons-vue';
|
||||
import { computed } from 'vue';
|
||||
import { toast } from 'vue-sonner';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
import {
|
||||
DropdownMenu,
|
||||
DropdownMenuContent,
|
||||
DropdownMenuItem,
|
||||
DropdownMenuSeparator,
|
||||
DropdownMenuTrigger
|
||||
} from '../../../components/ui/dropdown-menu';
|
||||
import { favoriteRequest } from '../../../api';
|
||||
|
||||
const { t } = useI18n();
|
||||
|
||||
const props = defineProps({
|
||||
favoriteGroup: {
|
||||
type: Object,
|
||||
type: [Array, Object],
|
||||
required: true
|
||||
},
|
||||
currentGroup: {
|
||||
@@ -58,8 +64,15 @@
|
||||
const tooltipContent = computed(() =>
|
||||
props.isLocalFavorite ? t('view.favorite.copy_tooltip') : t('view.favorite.move_tooltip')
|
||||
);
|
||||
const favoriteGroupList = computed(() => {
|
||||
const rawGroup = props.favoriteGroup;
|
||||
const source = Array.isArray(rawGroup) ? rawGroup : Array.isArray(rawGroup?.value) ? rawGroup.value : [];
|
||||
return source.filter((entry) => entry && typeof entry === 'object' && typeof entry.name === 'string');
|
||||
});
|
||||
const moveDropdownOpen = ref(false);
|
||||
|
||||
function handleDropdownItemClick(groupAPI) {
|
||||
moveDropdownOpen.value = false;
|
||||
if (props.isLocalFavorite) {
|
||||
if (props.type === 'world') {
|
||||
addFavoriteWorld(groupAPI);
|
||||
|
||||
Reference in New Issue
Block a user