MrUnknownDE/VRCX
1
0
Fork 0
mirror of https://github.com/MrUnknownDE/VRCX.git synced 2026-04-18 22:33:50 +02:00
Code Issues Packages Projects Releases Wiki Activity

split FavoritesMoveDropdown

Browse Source
This commit is contained in:
pa
2025-10-28 18:06:11 +09:00
committed by Natsumi
parent 27d65646f7
commit a3f5f938b2
5 changed files with 145 additions and 196 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
src/views/Favorites/components/FavoritesAvatarItem.vue
View File

@@ -10,27 +10,11 @@
<span class="extra" v-text="localFavFakeRef.authorName"></span>
</div>
<div class="editing">
<el-dropdown trigger="hover" size="small" style="margin-left: 5px" :persistent="false">
<div>
<el-button type="default" :icon="Back" size="small" circle></el-button>
</div>
<template #dropdown>
<span style="font-weight: bold; display: block; text-align: center">
{{ t(tooltipContent) }}
</span>
<el-dropdown-menu>
<template v-for="groupAPI in favoriteAvatarGroups" :key="groupAPI.name">
<el-dropdown-item
v-if="isLocalFavorite || groupAPI.name !== group.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>
<FavoritesMoveDropdown
:favoriteGroup="favoriteAvatarGroups"
:currentFavorite="props.favorite"
:currentGroup="group"
type="avatar" />
<el-button v-if="!isLocalFavorite" type="text" size="small" style="margin-left: 5px" @click.stop>
<el-checkbox v-model="isSelected"></el-checkbox>
</el-button>
@@ -147,8 +131,7 @@
</template>
<script setup>
import { Back, Check, Close, Star, Warning } from '@element-plus/icons-vue';
import { ElMessage } from 'element-plus';
import { Check, Close, Star, Warning } from '@element-plus/icons-vue';
import { computed } from 'vue';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
@@ -156,6 +139,8 @@
import { useAvatarStore, useFavoriteStore, useUiStore, useUserStore } from '../../../stores';
import { favoriteRequest } from '../../../api';
import FavoritesMoveDropdown from './FavoritesMoveDropdown.vue';
const props = defineProps({
favorite: Object,
group: [Object, String],
@@ -176,9 +161,7 @@
set: (value) => emit('handle-select', value)
});
const localFavFakeRef = computed(() => (props.isLocalFavorite ? props.favorite : props.favorite.ref));
const tooltipContent = computed(() =>
t(props.isLocalFavorite ? 'view.favorite.copy_tooltip' : 'view.favorite.move_tooltip')
);
const smallThumbnail = computed(
() => localFavFakeRef.value.thumbnailImageUrl?.replace('256', '128') || localFavFakeRef.value.thumbnailImageUrl
);
@@ -190,41 +173,7 @@
}
});
function moveFavorite(ref, group, type) {
favoriteRequest.deleteFavorite({ objectId: ref.id }).then(() => {
favoriteRequest.addFavorite({
type,
favoriteId: ref.id,
tags: group.name
});
});
}
function deleteFavorite(objectId) {
favoriteRequest.deleteFavorite({ objectId });
}
function addFavoriteAvatar(groupAPI) {
return favoriteRequest
.addFavorite({
type: 'avatar',
favoriteId: props.favorite.id,
tags: groupAPI.name
})
.then((args) => {
ElMessage({
message: 'Avatar added to favorites',
type: 'success'
});
return args;
});
}
function handleDropdownItemClick(groupAPI) {
if (props.isLocalFavorite) {
addFavoriteAvatar(groupAPI);
} else {
moveFavorite(props.favorite.ref, groupAPI, 'avatar');
}
}
</script>

40
src/views/Favorites/components/FavoritesFriendItem.vue
View File

@@ -19,27 +19,11 @@
<span v-else v-text="favorite.ref.statusDescription"></span>
</div>
<div class="editing">
<el-dropdown trigger="hover" size="small" style="margin-left: 5px" :persistent="false">
<div>
<el-button type="default" :icon="Back" size="small" circle></el-button>
</div>
<template #dropdown>
<span style="font-weight: bold; display: block; text-align: center">
{{ t('view.favorite.move_tooltip') }}
</span>
<el-dropdown-menu>
<template v-for="groupAPI in favoriteFriendGroups" :key="groupAPI.name">
<el-dropdown-item
v-if="groupAPI.name !== group.name"
style="display: block; margin: 10px 0"
:disabled="groupAPI.count >= groupAPI.capacity"
@click="moveFavorite(favorite.ref, groupAPI, 'friend')">
{{ groupAPI.displayName }} ({{ groupAPI.count }} / {{ groupAPI.capacity }})
</el-dropdown-item>
</template>
</el-dropdown-menu>
</template>
</el-dropdown>
<FavoritesMoveDropdown
:favoriteGroup="favoriteFriendGroups"
:currentGroup="group"
:currentFavorite="favorite"
type="friend" />
<el-button type="text" size="small" style="margin-left: 5px" @click.stop>
<el-checkbox v-model="favorite.$selected"></el-checkbox>
</el-button>
@@ -81,7 +65,7 @@
</template>
<script setup>
import { Back, Close, Star } from '@element-plus/icons-vue';
import { Close, Star } from '@element-plus/icons-vue';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
@@ -89,6 +73,8 @@
import { userImage, userStatusClass } from '../../../shared/utils';
import { favoriteRequest } from '../../../api';
import FavoritesMoveDropdown from './FavoritesMoveDropdown.vue';
defineProps({
favorite: { type: Object, required: true },
group: { type: Object, required: true }
@@ -101,16 +87,6 @@
const { shiftHeld } = storeToRefs(useUiStore());
const { t } = useI18n();
function moveFavorite(ref, group, type) {
favoriteRequest.deleteFavorite({ objectId: ref.id }).then(() => {
favoriteRequest.addFavorite({
type,
favoriteId: ref.id,
tags: group.name
});
});
}
function deleteFavorite(objectId) {
favoriteRequest.deleteFavorite({ objectId });
}

112
src/views/Favorites/components/FavoritesMoveDropdown.vue Normal file
View File

@@ -0,0 +1,112 @@
<template>
<el-dropdown trigger="hover" size="small" style="margin-left: 5px" :persistent="false">
<div>
<el-button type="default" :icon="Back" size="small" circle></el-button>
</div>
<template #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>
</template>
<script setup>
import { Back } from '@element-plus/icons-vue';
import { ElMessage } from 'element-plus';
import { computed } from 'vue';
import { useI18n } from 'vue-i18n';
import { favoriteRequest } from '../../../api';
const { t } = useI18n();
const props = defineProps({
favoriteGroup: {
type: Object,
required: true
},
currentGroup: {
type: [Object, String],
required: false
},
currentFavorite: {
type: Object,
required: true
},
isLocalFavorite: {
type: Boolean,
required: false
},
type: {
type: String,
required: true
}
});
const tooltipContent = computed(() =>
props.isLocalFavorite ? t('view.favorite.copy_tooltip') : t('view.favorite.move_tooltip')
);
function handleDropdownItemClick(groupAPI) {
if (props.isLocalFavorite) {
if (props.type === 'world') {
addFavoriteWorld(groupAPI);
} else if (props.type === 'avatar') {
addFavoriteAvatar(groupAPI);
}
} else {
moveFavorite(props.currentFavorite.ref, groupAPI, props.type);
}
}
function moveFavorite(ref, group, type) {
favoriteRequest.deleteFavorite({ objectId: ref.id }).then(() => {
favoriteRequest.addFavorite({
type,
favoriteId: ref.id,
tags: group.name
});
});
}
function addFavoriteAvatar(groupAPI) {
return favoriteRequest
.addFavorite({
type: 'avatar',
favoriteId: props.currentFavorite.id,
tags: groupAPI.name
})
.then((args) => {
ElMessage({
message: 'Avatar added to favorites',
type: 'success'
});
return args;
});
}
function addFavoriteWorld(groupAPI) {
return favoriteRequest
.addFavorite({
type: 'world',
favoriteId: props.currentFavorite.id,
tags: groupAPI.name
})
.then((args) => {
ElMessage({ message: 'World added to favorites', type: 'success' });
return args;
});
}
</script>

68
src/views/Favorites/components/FavoritesWorldItem.vue
View File

@@ -13,27 +13,11 @@
<span v-else class="extra">{{ props.favorite.ref.authorName }}</span>
</div>
<div class="editing">
<el-dropdown trigger="hover" size="small" style="margin-left: 5px" :persistent="false">
<div>
<el-button type="default" :icon="Back" size="small" circle></el-button>
</div>
<template #dropdown>
<span style="font-weight: bold; display: block; text-align: center">
{{ t(tooltipContent) }}
</span>
<el-dropdown-menu>
<template v-for="groupAPI in favoriteWorldGroups" :key="groupAPI.name">
<el-dropdown-item
v-if="groupAPI.name !== group.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>
<FavoritesMoveDropdown
:favoriteGroup="favoriteWorldGroups"
:currentFavorite="props.favorite"
:currentGroup="group"
type="world" />
<el-button type="text" size="small" @click.stop style="margin-left: 5px">
<el-checkbox v-model="isSelected"></el-checkbox>
</el-button>
@@ -111,8 +95,7 @@
</template>
<script setup>
import { Back, Close, Message, Star, Warning } from '@element-plus/icons-vue';
import { ElMessage } from 'element-plus';
import { Close, Message, Star, Warning } from '@element-plus/icons-vue';
import { computed } from 'vue';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
@@ -120,6 +103,8 @@
import { useFavoriteStore, useInviteStore, useUiStore } from '../../../stores';
import { favoriteRequest } from '../../../api';
import FavoritesMoveDropdown from './FavoritesMoveDropdown.vue';
const props = defineProps({
group: [Object, String],
favorite: Object,
@@ -139,23 +124,11 @@
set: (value) => emit('handle-select', value)
});
const tooltipContent = computed(() =>
t(props.isLocalFavorite ? 'view.favorite.copy_tooltip' : 'view.favorite.move_tooltip')
);
const smallThumbnail = computed(() => {
const url = props.favorite.ref.thumbnailImageUrl?.replace('256', '128');
return url || props.favorite.ref.thumbnailImageUrl;
});
function handleDropdownItemClick(groupAPI) {
if (props.isLocalFavorite) {
addFavoriteWorld(props.favorite.ref, groupAPI, true);
} else {
moveFavorite(props.favorite.ref, groupAPI, 'world');
}
}
function handleDeleteFavorite() {
if (props.isLocalFavorite) {
emit('remove-local-world-favorite', props.favorite.id, props.group);
@@ -164,34 +137,9 @@
}
}
function moveFavorite(refObj, group, type) {
favoriteRequest.deleteFavorite({ objectId: refObj.id }).then(() => {
favoriteRequest.addFavorite({
type,
favoriteId: refObj.id,
tags: group.name
});
});
}
function deleteFavorite(objectId) {
favoriteRequest.deleteFavorite({ objectId });
}
function addFavoriteWorld(refObj, group, message) {
return favoriteRequest
.addFavorite({
type: 'world',
favoriteId: refObj.id,
tags: group.name
})
.then((args) => {
if (message) {
ElMessage({ message: 'World added to favorites', type: 'success' });
}
return args;
});
}
</script>
<style scoped>

52
src/views/Favorites/components/FavoritesWorldLocalItem.vue
View File

@@ -13,26 +13,11 @@
<span v-else class="extra">{{ props.favorite.authorName }}</span>
</div>
<div class="editing">
<el-dropdown trigger="hover" size="small" style="margin-left: 5px" :persistent="false">
<div>
<el-button type="default" :icon="Back" size="small" circle></el-button>
</div>
<template #dropdown>
<span style="font-weight: bold; display: block; text-align: center">
{{ t(tooltipContent) }}
</span>
<el-dropdown-menu>
<template v-for="groupAPI in favoriteWorldGroups" :key="groupAPI.name">
<el-dropdown-item
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>
<FavoritesMoveDropdown
:favoriteGroup="favoriteWorldGroups"
:currentFavorite="props.favorite"
isLocalFavorite
type="world" />
</div>
<div class="default">
<el-tooltip placement="left">
@@ -86,14 +71,14 @@
</template>
<script setup>
import { Back, Close, Message, Star } from '@element-plus/icons-vue';
import { ElMessage } from 'element-plus';
import { Close, Message, Star } from '@element-plus/icons-vue';
import { computed } from 'vue';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
import { useFavoriteStore, useInviteStore, useUiStore } from '../../../stores';
import { favoriteRequest } from '../../../api';
import FavoritesMoveDropdown from './FavoritesMoveDropdown.vue';
const props = defineProps({
group: [Object, String],
@@ -108,35 +93,14 @@
const { t } = useI18n();
const { canOpenInstanceInGame } = useInviteStore();
const tooltipContent = computed(() => t('view.favorite.copy_tooltip'));
const smallThumbnail = computed(() => {
const url = props.favorite.thumbnailImageUrl?.replace('256', '128');
return url || props.favorite.thumbnailImageUrl;
});
function handleDropdownItemClick(groupAPI) {
addFavoriteWorld(props.favorite, groupAPI, true);
}
function handleDeleteFavorite() {
emit('remove-local-world-favorite', props.favorite.id, props.group);
}
function addFavoriteWorld(refObj, group, message) {
return favoriteRequest
.addFavorite({
type: 'world',
favoriteId: refObj.id,
tags: group.name
})
.then((args) => {
if (message) {
ElMessage({ message: 'World added to favorites', type: 'success' });
}
return args;
});
}
</script>
<style scoped>