mirror of
https://github.com/MrUnknownDE/VRCX.git
synced 2026-04-18 14:23:51 +02:00
replace el-button
This commit is contained in:
pa
Natsumi
@@ -338,16 +338,17 @@
|
||||
accept="image/*"
|
||||
style="display: none"
|
||||
@change="onFileChangeAvatarGallery" />
|
||||
<el-button
|
||||
<Button
|
||||
v-if="avatarDialog.ref.authorId === currentUser.id"
|
||||
variant="outline"
|
||||
size="sm"
|
||||
:disabled="avatarDialog.galleryLoading"
|
||||
size="small"
|
||||
:icon="Upload"
|
||||
:loading="avatarDialog.galleryLoading"
|
||||
style="margin-left: 5px"
|
||||
@click="displayAvatarGalleryUpload"
|
||||
>{{ t('dialog.screenshot_metadata.upload') }}</el-button
|
||||
>
|
||||
class="ml-1"
|
||||
@click="displayAvatarGalleryUpload">
|
||||
<Spinner v-if="avatarDialog.galleryLoading" />
|
||||
<Upload v-else />
|
||||
{{ t('dialog.screenshot_metadata.upload') }}
|
||||
</Button>
|
||||
<el-progress
|
||||
v-if="avatarDialog.galleryLoading"
|
||||
:show-text="false"
|
||||
@@ -544,6 +545,7 @@
|
||||
import { computed, defineAsyncComponent, nextTick, ref, watch } from 'vue';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { ElMessageBox } from 'element-plus';
|
||||
import { Spinner } from '@/components/ui/spinner';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { toast } from 'vue-sonner';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
@@ -22,15 +22,15 @@
|
||||
style="margin-bottom: 12px" />
|
||||
<span>{{ t('dialog.change_content_image.description') }}</span>
|
||||
<br />
|
||||
<el-button
|
||||
type="default"
|
||||
size="small"
|
||||
:icon="Upload"
|
||||
:loading="changeAvatarImageDialogLoading"
|
||||
<Button
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="changeAvatarImageDialogLoading"
|
||||
@click="uploadAvatarImage">
|
||||
<Spinner v-if="changeAvatarImageDialogLoading" />
|
||||
<Upload v-else />
|
||||
{{ t('dialog.change_content_image.upload') }}
|
||||
</el-button>
|
||||
</Button>
|
||||
<br />
|
||||
<div class="x-change-image-item">
|
||||
<img :src="previousImageUrl" class="img-size" loading="lazy" />
|
||||
@@ -40,6 +40,8 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Spinner } from '@/components/ui/spinner';
|
||||
import { Upload } from '@element-plus/icons-vue';
|
||||
import { ref } from 'vue';
|
||||
import { storeToRefs } from 'pinia';
|
||||
|
||||
@@ -144,50 +144,54 @@
|
||||
v-if="groupDialog.ref.myMember?.isRepresenting"
|
||||
side="top"
|
||||
:content="t('dialog.group.actions.unrepresent_tooltip')">
|
||||
<el-button
|
||||
type="warning"
|
||||
:icon="Star"
|
||||
size="large"
|
||||
circle
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="secondary"
|
||||
size="icon-lg"
|
||||
style="margin-left: 5px"
|
||||
@click="clearGroupRepresentation(groupDialog.id)"></el-button>
|
||||
@click="clearGroupRepresentation(groupDialog.id)">
|
||||
<Star />
|
||||
</Button>
|
||||
</TooltipWrapper>
|
||||
<TooltipWrapper v-else side="top" :content="t('dialog.group.actions.represent_tooltip')">
|
||||
<span>
|
||||
<el-button
|
||||
type="default"
|
||||
:icon="StarFilled"
|
||||
size="large"
|
||||
circle
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-lg"
|
||||
style="margin-left: 5px"
|
||||
:disabled="groupDialog.ref.privacy === 'private'"
|
||||
@click="setGroupRepresentation(groupDialog.id)"></el-button>
|
||||
@click="setGroupRepresentation(groupDialog.id)">
|
||||
<StarFilled />
|
||||
</Button>
|
||||
</span>
|
||||
</TooltipWrapper>
|
||||
</template>
|
||||
<template v-else-if="groupDialog.ref.myMember?.membershipStatus === 'requested'">
|
||||
<TooltipWrapper side="top" :content="t('dialog.group.actions.cancel_join_request_tooltip')">
|
||||
<span>
|
||||
<el-button
|
||||
type="default"
|
||||
:icon="Close"
|
||||
size="large"
|
||||
circle
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-lg"
|
||||
style="margin-left: 5px"
|
||||
@click="cancelGroupRequest(groupDialog.id)"></el-button>
|
||||
@click="cancelGroupRequest(groupDialog.id)">
|
||||
<Close />
|
||||
</Button>
|
||||
</span>
|
||||
</TooltipWrapper>
|
||||
</template>
|
||||
<template v-else-if="groupDialog.ref.myMember?.membershipStatus === 'invited'">
|
||||
<TooltipWrapper side="top" :content="t('dialog.group.actions.pending_request_tooltip')">
|
||||
<span>
|
||||
<el-button
|
||||
type="default"
|
||||
:icon="Check"
|
||||
size="large"
|
||||
circle
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-lg"
|
||||
style="margin-left: 5px"
|
||||
@click="joinGroup(groupDialog.id)"></el-button>
|
||||
@click="joinGroup(groupDialog.id)">
|
||||
<Check />
|
||||
</Button>
|
||||
</span>
|
||||
</TooltipWrapper>
|
||||
</template>
|
||||
@@ -196,49 +200,55 @@
|
||||
v-if="groupDialog.ref.joinState === 'request'"
|
||||
side="top"
|
||||
:content="t('dialog.group.actions.request_join_tooltip')">
|
||||
<el-button
|
||||
type="default"
|
||||
:icon="Message"
|
||||
size="large"
|
||||
circle
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-lg"
|
||||
style="margin-left: 5px"
|
||||
@click="joinGroup(groupDialog.id)"></el-button>
|
||||
@click="joinGroup(groupDialog.id)">
|
||||
<Message />
|
||||
</Button>
|
||||
</TooltipWrapper>
|
||||
<TooltipWrapper
|
||||
v-if="groupDialog.ref.joinState === 'invite'"
|
||||
side="top"
|
||||
:content="t('dialog.group.actions.invite_required_tooltip')">
|
||||
<span>
|
||||
<el-button
|
||||
type="default"
|
||||
:icon="Message"
|
||||
size="large"
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-lg"
|
||||
disabled
|
||||
circle
|
||||
style="margin-left: 5px"></el-button>
|
||||
style="margin-left: 5px">
|
||||
<Message />
|
||||
</Button>
|
||||
</span>
|
||||
</TooltipWrapper>
|
||||
<TooltipWrapper
|
||||
v-if="groupDialog.ref.joinState === 'open'"
|
||||
side="top"
|
||||
:content="t('dialog.group.actions.join_group_tooltip')">
|
||||
<el-button
|
||||
type="default"
|
||||
:icon="Check"
|
||||
size="large"
|
||||
circle
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-lg"
|
||||
style="margin-left: 5px"
|
||||
@click="joinGroup(groupDialog.id)"></el-button>
|
||||
@click="joinGroup(groupDialog.id)">
|
||||
<Check />
|
||||
</Button>
|
||||
</TooltipWrapper>
|
||||
</template>
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger as-child>
|
||||
<el-button
|
||||
:type="groupDialog.ref.membershipStatus === 'userblocked' ? 'danger' : 'default'"
|
||||
:icon="MoreFilled"
|
||||
size="large"
|
||||
style="margin-left: 5px"
|
||||
circle></el-button>
|
||||
<Button
|
||||
class="rounded-full"
|
||||
:variant="
|
||||
groupDialog.ref.membershipStatus === 'userblocked' ? 'destructive' : 'outline'
|
||||
"
|
||||
size="icon-lg"
|
||||
style="margin-left: 5px">
|
||||
<MoreFilled />
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent>
|
||||
<DropdownMenuItem @click="groupDialogCommand('Refresh')">
|
||||
@@ -1042,13 +1052,15 @@
|
||||
</template>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane name="Photos" :label="t('dialog.group.gallery.header')" lazy>
|
||||
<el-button
|
||||
type="default"
|
||||
size="small"
|
||||
:icon="Refresh"
|
||||
:loading="isGroupGalleryLoading"
|
||||
circle
|
||||
@click="getGroupGalleries" />
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="isGroupGalleryLoading"
|
||||
@click="getGroupGalleries">
|
||||
<Spinner v-if="isGroupGalleryLoading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
<el-tabs
|
||||
v-model="groupDialogGalleryCurrentName"
|
||||
v-loading="isGroupGalleryLoading"
|
||||
|
||||
@@ -10,13 +10,15 @@
|
||||
<el-tabs style="height: 100%">
|
||||
<el-tab-pane :label="t('dialog.group_member_moderation.members')">
|
||||
<div style="margin-top: 10px">
|
||||
<el-button
|
||||
type="default"
|
||||
size="small"
|
||||
:icon="Refresh"
|
||||
:loading="isGroupMembersLoading"
|
||||
circle
|
||||
@click="loadAllGroupMembers" />
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="isGroupMembersLoading"
|
||||
@click="loadAllGroupMembers">
|
||||
<Spinner v-if="isGroupMembersLoading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
<span style="font-size: 14px; margin-left: 5px; margin-right: 5px">
|
||||
{{ groupMemberModerationTable.data.length }}/{{
|
||||
groupMemberModeration.groupRef.memberCount
|
||||
@@ -34,8 +36,9 @@
|
||||
!hasGroupPermission(groupMemberModeration.groupRef, 'group-bans-manage')
|
||||
)
|
||||
">
|
||||
<el-button
|
||||
size="small"
|
||||
<Button
|
||||
size="sm"
|
||||
variant="outline"
|
||||
:disabled="
|
||||
Boolean(
|
||||
isGroupMembersLoading ||
|
||||
@@ -48,7 +51,7 @@
|
||||
{{ t(memberSortOrder.name) }}
|
||||
<el-icon style="margin-left: 5px"><ArrowDown /></el-icon>
|
||||
</span>
|
||||
</el-button>
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent>
|
||||
<DropdownMenuItem
|
||||
@@ -209,13 +212,15 @@
|
||||
:label="t('dialog.group_member_moderation.bans')"
|
||||
:disabled="!hasGroupPermission(groupMemberModeration.groupRef, 'group-bans-manage')">
|
||||
<div style="margin-top: 10px">
|
||||
<el-button
|
||||
type="default"
|
||||
size="small"
|
||||
:icon="Refresh"
|
||||
:loading="isGroupMembersLoading"
|
||||
circle
|
||||
@click="getAllGroupBans(groupMemberModeration.id)"></el-button>
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="isGroupMembersLoading"
|
||||
@click="getAllGroupBans(groupMemberModeration.id)">
|
||||
<Spinner v-if="isGroupMembersLoading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
<span style="font-size: 14px; margin-left: 5px; margin-right: 5px">{{
|
||||
groupBansModerationTable.data.length
|
||||
}}</span>
|
||||
@@ -321,13 +326,15 @@
|
||||
:label="t('dialog.group_member_moderation.invites')"
|
||||
:disabled="!hasGroupPermission(groupMemberModeration.groupRef, 'group-invites-manage')">
|
||||
<div style="margin-top: 10px">
|
||||
<el-button
|
||||
type="default"
|
||||
size="small"
|
||||
:icon="Refresh"
|
||||
:loading="isGroupMembersLoading"
|
||||
circle
|
||||
@click="getAllGroupInvitesAndJoinRequests(groupMemberModeration.id)"></el-button>
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="isGroupMembersLoading"
|
||||
@click="getAllGroupInvitesAndJoinRequests(groupMemberModeration.id)">
|
||||
<Spinner v-if="isGroupMembersLoading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
<br />
|
||||
<el-tabs>
|
||||
<el-tab-pane>
|
||||
@@ -602,13 +609,15 @@
|
||||
:label="t('dialog.group_member_moderation.logs')"
|
||||
:disabled="!hasGroupPermission(groupMemberModeration.groupRef, 'group-audit-view')">
|
||||
<div style="margin-top: 10px">
|
||||
<el-button
|
||||
type="default"
|
||||
size="small"
|
||||
:icon="Refresh"
|
||||
:loading="isGroupMembersLoading"
|
||||
circle
|
||||
@click="getAllGroupLogs(groupMemberModeration.id)"></el-button>
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="isGroupMembersLoading"
|
||||
@click="getAllGroupLogs(groupMemberModeration.id)">
|
||||
<Spinner v-if="isGroupMembersLoading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
<span style="font-size: 14px; margin-left: 5px; margin-right: 5px">{{
|
||||
groupLogsModerationTable.data.length
|
||||
}}</span>
|
||||
@@ -862,6 +871,7 @@
|
||||
import { ArrowDown, Loading, Refresh, Warning } from '@element-plus/icons-vue';
|
||||
import { reactive, ref, watch } from 'vue';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Spinner } from '@/components/ui/spinner';
|
||||
import { Trash2 } from 'lucide-vue-next';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { toast } from 'vue-sonner';
|
||||
|
||||
@@ -93,6 +93,7 @@
|
||||
|
||||
<script setup>
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { SquarePen } from 'lucide-vue-next';
|
||||
import { ref } from 'vue';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
@@ -66,18 +66,18 @@
|
||||
</div>
|
||||
</div>
|
||||
<template #footer>
|
||||
<el-button
|
||||
type="primary"
|
||||
<Button
|
||||
:disabled="inviteGroupDialog.loading || !inviteGroupDialog.userIds.length || !inviteGroupDialog.groupId"
|
||||
@click="sendGroupInvite">
|
||||
{{ t('dialog.invite_to_group.invite') }}
|
||||
</el-button>
|
||||
</Button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, nextTick, ref, watch } from 'vue';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Check as CheckIcon } from 'lucide-vue-next';
|
||||
import { ElMessageBox } from 'element-plus';
|
||||
import { storeToRefs } from 'pinia';
|
||||
|
||||
@@ -43,6 +43,7 @@
|
||||
|
||||
<script setup>
|
||||
import { ref, watch } from 'vue';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { InputGroupCharCount } from '@/components/ui/input-group';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
@@ -14,14 +14,15 @@
|
||||
:placeholder="t('dialog.pronouns.pronouns_placeholder')" />
|
||||
</div>
|
||||
<template #footer>
|
||||
<el-button type="primary" :disabled="pronounsDialog.loading" @click="savePronouns">
|
||||
<Button :disabled="pronounsDialog.loading" @click="savePronouns">
|
||||
{{ t('dialog.pronouns.update') }}
|
||||
</el-button>
|
||||
</Button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { InputGroupCharCount } from '@/components/ui/input-group';
|
||||
import { toast } from 'vue-sonner';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
@@ -76,9 +76,9 @@
|
||||
</div>
|
||||
|
||||
<template #footer>
|
||||
<el-button type="primary" :disabled="socialStatusDialog.loading" @click="saveSocialStatus">
|
||||
<Button :disabled="socialStatusDialog.loading" @click="saveSocialStatus">
|
||||
{{ t('dialog.social_status.update') }}
|
||||
</el-button>
|
||||
</Button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
@@ -555,14 +555,15 @@
|
||||
lazy>
|
||||
<div style="display: flex; align-items: center; justify-content: space-between">
|
||||
<div style="display: flex; align-items: center">
|
||||
<el-button
|
||||
type="default"
|
||||
:loading="userDialog.isMutualFriendsLoading"
|
||||
size="small"
|
||||
:icon="Refresh"
|
||||
circle
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="userDialog.isMutualFriendsLoading"
|
||||
@click="getUserMutualFriends(userDialog.id)">
|
||||
</el-button>
|
||||
<Spinner v-if="userDialog.isMutualFriendsLoading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
<span style="margin-left: 5px">{{
|
||||
t('dialog.user.groups.total_count', { count: userDialog.mutualFriends.length })
|
||||
}}</span>
|
||||
@@ -625,14 +626,15 @@
|
||||
<el-tab-pane name="Groups" :label="t('dialog.user.groups.header')" lazy>
|
||||
<div style="display: flex; align-items: center; justify-content: space-between">
|
||||
<div style="display: flex; align-items: center">
|
||||
<el-button
|
||||
type="default"
|
||||
:loading="userDialog.isGroupsLoading"
|
||||
size="small"
|
||||
:icon="Refresh"
|
||||
circle
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="userDialog.isGroupsLoading"
|
||||
@click="getUserGroups(userDialog.id)">
|
||||
</el-button>
|
||||
<Spinner v-if="userDialog.isGroupsLoading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
<span style="margin-left: 5px">{{
|
||||
t('dialog.user.groups.total_count', { count: userGroups.groups.length })
|
||||
}}</span>
|
||||
@@ -742,9 +744,9 @@
|
||||
</div>
|
||||
|
||||
<div style="margin-right: 3px; margin-left: 5px" @click.stop>
|
||||
<el-button
|
||||
size="small"
|
||||
:icon="DownloadIcon"
|
||||
<Button
|
||||
size="icon-sm"
|
||||
variant="outline"
|
||||
style="
|
||||
display: block;
|
||||
padding: 7px;
|
||||
@@ -753,27 +755,31 @@
|
||||
rotate: 180deg;
|
||||
"
|
||||
@click="moveGroupTop(group.id)">
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
:icon="DownloadIcon"
|
||||
<DownloadIcon />
|
||||
</Button>
|
||||
<Button
|
||||
size="icon-sm"
|
||||
variant="outline"
|
||||
style="display: block; padding: 7px; font-size: 9px; margin-left: 0"
|
||||
@click="moveGroupBottom(group.id)">
|
||||
</el-button>
|
||||
<DownloadIcon />
|
||||
</Button>
|
||||
</div>
|
||||
<div style="margin-right: 10px" @click.stop>
|
||||
<el-button
|
||||
size="small"
|
||||
:icon="Top"
|
||||
<Button
|
||||
size="icon-sm"
|
||||
variant="outline"
|
||||
style="display: block; padding: 7px; font-size: 9px; margin-left: 0"
|
||||
@click="moveGroupUp(group.id)">
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
:icon="Bottom"
|
||||
<Top />
|
||||
</Button>
|
||||
<Button
|
||||
size="icon-sm"
|
||||
variant="outline"
|
||||
style="display: block; padding: 7px; font-size: 9px; margin-left: 0"
|
||||
@click="moveGroupDown(group.id)">
|
||||
</el-button>
|
||||
<Bottom />
|
||||
</Button>
|
||||
</div>
|
||||
<div class="avatar">
|
||||
<img :src="group.iconUrl" loading="lazy" />
|
||||
@@ -1011,14 +1017,15 @@
|
||||
<el-tab-pane name="Worlds" :label="t('dialog.user.worlds.header')" lazy>
|
||||
<div style="display: flex; align-items: center; justify-content: space-between">
|
||||
<div style="display: flex; align-items: center">
|
||||
<el-button
|
||||
type="default"
|
||||
:loading="userDialog.isWorldsLoading"
|
||||
size="small"
|
||||
:icon="Refresh"
|
||||
circle
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="userDialog.isWorldsLoading"
|
||||
@click="refreshUserDialogWorlds()">
|
||||
</el-button>
|
||||
<Spinner v-if="userDialog.isWorldsLoading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
<span style="margin-left: 5px">{{
|
||||
t('dialog.user.worlds.total_count', { count: userDialog.worlds.length })
|
||||
}}</span>
|
||||
@@ -1149,24 +1156,26 @@
|
||||
<el-tab-pane name="Avatars" :label="t('dialog.user.avatars.header')" lazy>
|
||||
<div style="display: flex; align-items: center; justify-content: space-between">
|
||||
<div style="display: flex; align-items: center">
|
||||
<el-button
|
||||
<Button
|
||||
v-if="userDialog.ref.id === currentUser.id"
|
||||
type="default"
|
||||
:loading="userDialog.isAvatarsLoading"
|
||||
size="small"
|
||||
:icon="Refresh"
|
||||
circle
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="userDialog.isAvatarsLoading"
|
||||
@click="refreshUserDialogAvatars()">
|
||||
</el-button>
|
||||
<el-button
|
||||
<Spinner v-if="userDialog.isAvatarsLoading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
<Button
|
||||
v-else
|
||||
type="default"
|
||||
:loading="userDialog.isAvatarsLoading"
|
||||
size="small"
|
||||
:icon="Refresh"
|
||||
circle
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="userDialog.isAvatarsLoading"
|
||||
@click="setUserDialogAvatarsRemote(userDialog.id)">
|
||||
</el-button>
|
||||
<Spinner v-if="userDialog.isAvatarsLoading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
<span style="margin-left: 5px">{{
|
||||
t('dialog.user.avatars.total_count', { count: userDialogAvatars.length })
|
||||
}}</span>
|
||||
|
||||
@@ -22,15 +22,11 @@
|
||||
style="margin-bottom: 12px" />
|
||||
<span>{{ t('dialog.change_content_image.description') }}</span>
|
||||
<br />
|
||||
<el-button
|
||||
type="default"
|
||||
size="small"
|
||||
:icon="Upload"
|
||||
:loading="changeWorldImageDialogLoading"
|
||||
:disabled="changeWorldImageDialogLoading"
|
||||
@click="uploadWorldImage">
|
||||
<Button variant="outline" size="sm" :disabled="changeWorldImageDialogLoading" @click="uploadWorldImage">
|
||||
<Spinner v-if="changeWorldImageDialogLoading" />
|
||||
<Upload v-else />
|
||||
{{ t('dialog.change_content_image.upload') }}
|
||||
</el-button>
|
||||
</Button>
|
||||
<br />
|
||||
<div class="x-change-image-item">
|
||||
<img :src="previousImageUrl" class="img-size" loading="lazy" />
|
||||
@@ -40,6 +36,8 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Spinner } from '@/components/ui/spinner';
|
||||
import { Upload } from '@element-plus/icons-vue';
|
||||
import { ref } from 'vue';
|
||||
import { storeToRefs } from 'pinia';
|
||||
|
||||
@@ -13,9 +13,10 @@
|
||||
</Button>
|
||||
</TooltipWrapper>
|
||||
<TooltipWrapper :content="fetchButtonLabel" side="top">
|
||||
<el-button type="primary" :disabled="fetchButtonDisabled" :loading="isFetching" @click="startFetch">
|
||||
<Button :disabled="fetchButtonDisabled" @click="startFetch">
|
||||
<Spinner v-if="isFetching" />
|
||||
{{ fetchButtonLabel }}
|
||||
</el-button>
|
||||
</Button>
|
||||
</TooltipWrapper>
|
||||
<TooltipWrapper
|
||||
v-if="isFetching"
|
||||
@@ -130,6 +131,7 @@
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { ElMessageBox } from 'element-plus';
|
||||
import { Settings } from 'lucide-vue-next';
|
||||
import { Spinner } from '@/components/ui/spinner';
|
||||
import { onBeforeRouteLeave } from 'vue-router';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { toast } from 'vue-sonner';
|
||||
|
||||
@@ -80,12 +80,15 @@
|
||||
<div class="group-section__header">
|
||||
<span>{{ t('view.favorite.avatars.vrchat_favorites') }}</span>
|
||||
<TooltipWrapper side="bottom" :content="t('view.favorite.refresh_favorites_tooltip')">
|
||||
<el-button
|
||||
:loading="isFavoriteLoading"
|
||||
size="small"
|
||||
:icon="Refresh"
|
||||
circle
|
||||
@click.stop="handleRefreshFavorites" />
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="isFavoriteLoading"
|
||||
@click.stop="handleRefreshFavorites">
|
||||
<Spinner v-if="isFavoriteLoading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
</TooltipWrapper>
|
||||
</div>
|
||||
<div class="group-section__list">
|
||||
@@ -112,12 +115,9 @@
|
||||
handleGroupMenuVisible(remoteGroupMenuKey(group.key), $event)
|
||||
">
|
||||
<PopoverTrigger asChild>
|
||||
<el-button
|
||||
text
|
||||
size="small"
|
||||
:icon="MoreFilled"
|
||||
circle
|
||||
@click.stop></el-button>
|
||||
<Button class="rounded-full" variant="ghost" size="icon-sm" @click.stop>
|
||||
<MoreFilled />
|
||||
</Button>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent side="right" class="w-55 p-1 rounded-lg">
|
||||
<div class="favorites-group-menu">
|
||||
@@ -515,6 +515,8 @@
|
||||
import { MoreFilled, Plus, Refresh } from '@element-plus/icons-vue';
|
||||
import { Ellipsis, RefreshCcw } from 'lucide-vue-next';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Loader } from 'lucide-vue-next';
|
||||
import { Spinner } from '@/components/ui/spinner';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { toast } from 'vue-sonner';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
@@ -80,12 +80,15 @@
|
||||
<div class="group-section__header">
|
||||
<span>{{ t('view.favorite.worlds.vrchat_favorites') }}</span>
|
||||
<TooltipWrapper side="bottom" :content="t('view.favorite.refresh_favorites_tooltip')">
|
||||
<el-button
|
||||
:loading="isFavoriteLoading"
|
||||
size="small"
|
||||
:icon="Refresh"
|
||||
circle
|
||||
@click.stop="handleRefreshFavorites" />
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="isFavoriteLoading"
|
||||
@click.stop="handleRefreshFavorites">
|
||||
<Spinner v-if="isFavoriteLoading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
</TooltipWrapper>
|
||||
</div>
|
||||
<div class="group-section__list">
|
||||
@@ -112,12 +115,9 @@
|
||||
handleGroupMenuVisible(remoteGroupMenuKey(group.key), $event)
|
||||
">
|
||||
<PopoverTrigger asChild>
|
||||
<el-button
|
||||
text
|
||||
size="small"
|
||||
:icon="MoreFilled"
|
||||
circle
|
||||
@click.stop></el-button>
|
||||
<Button class="rounded-full" variant="ghost" size="icon-sm" @click.stop>
|
||||
<MoreFilled />
|
||||
</Button>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent side="right" class="w-55 p-1 rounded-lg">
|
||||
<div class="favorites-group-menu">
|
||||
@@ -299,6 +299,7 @@
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { ElMessageBox } from 'element-plus';
|
||||
import { Ellipsis } from 'lucide-vue-next';
|
||||
import { Spinner } from '@/components/ui/spinner';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { toast } from 'vue-sonner';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
@@ -80,12 +80,15 @@
|
||||
<div class="group-section__header">
|
||||
<span>{{ t('view.favorite.worlds.vrchat_favorites') }}</span>
|
||||
<TooltipWrapper side="bottom" :content="t('view.favorite.refresh_favorites_tooltip')">
|
||||
<el-button
|
||||
:loading="isFavoriteLoading"
|
||||
size="small"
|
||||
:icon="Refresh"
|
||||
circle
|
||||
@click.stop="handleRefreshFavorites" />
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="isFavoriteLoading"
|
||||
@click.stop="handleRefreshFavorites">
|
||||
<Spinner v-if="isFavoriteLoading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
</TooltipWrapper>
|
||||
</div>
|
||||
<div class="group-section__list">
|
||||
@@ -112,12 +115,9 @@
|
||||
handleGroupMenuVisible(remoteGroupMenuKey(group.key), $event)
|
||||
">
|
||||
<PopoverTrigger asChild>
|
||||
<el-button
|
||||
text
|
||||
size="small"
|
||||
:icon="MoreFilled"
|
||||
circle
|
||||
@click.stop></el-button>
|
||||
<Button class="rounded-full" variant="ghost" size="icon-sm" @click.stop>
|
||||
<MoreFilled />
|
||||
</Button>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent side="right" class="w-50 p-1 rounded-lg">
|
||||
<div class="favorites-group-menu">
|
||||
@@ -429,6 +429,7 @@
|
||||
import { Ellipsis, RefreshCcw } from 'lucide-vue-next';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { ElMessageBox } from 'element-plus';
|
||||
import { Spinner } from '@/components/ui/spinner';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { toast } from 'vue-sonner';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
@@ -52,14 +52,13 @@
|
||||
? t('view.favorite.delete_tooltip')
|
||||
: t('view.favorite.unfavorite_tooltip')
|
||||
">
|
||||
<el-button
|
||||
size="small"
|
||||
circle
|
||||
class="favorites-search-card__action-btn"
|
||||
:type="isLocalFavorite ? 'default' : 'default'"
|
||||
<Button
|
||||
size="icon-sm"
|
||||
variant="outline"
|
||||
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
|
||||
@click.stop="handlePrimaryDeleteAction">
|
||||
<i class="ri-delete-bin-line"></i>
|
||||
</el-button>
|
||||
</Button>
|
||||
</TooltipWrapper>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -32,14 +32,13 @@
|
||||
type="world" />
|
||||
</div>
|
||||
<div class="favorites-search-card__action">
|
||||
<el-button
|
||||
size="small"
|
||||
circle
|
||||
class="favorites-search-card__action-btn"
|
||||
:type="deleteButtonType"
|
||||
<Button
|
||||
size="icon-sm"
|
||||
:variant="shiftHeld ? 'destructive' : 'outline'"
|
||||
class="favorites-search-card__action-btn rounded-full text-xs h-6 w-6"
|
||||
@click.stop="handlePrimaryDeleteAction">
|
||||
<i class="ri-delete-bin-line"></i>
|
||||
</el-button>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -142,8 +141,6 @@
|
||||
return url || props.favorite.thumbnailImageUrl;
|
||||
});
|
||||
|
||||
const deleteButtonType = computed(() => (shiftHeld.value ? 'danger' : 'default'));
|
||||
|
||||
const inviteOrLaunchText = computed(() => {
|
||||
return canOpenInstanceInGame
|
||||
? t('dialog.world.actions.new_instance_and_open_ingame')
|
||||
|
||||
@@ -19,12 +19,15 @@
|
||||
:placeholder="t('view.moderation.search_placeholder')"
|
||||
class="filter-input" />
|
||||
<TooltipWrapper side="bottom" :content="t('view.moderation.refresh_tooltip')">
|
||||
<el-button
|
||||
type="default"
|
||||
:loading="playerModerationTable.loading"
|
||||
@click="refreshPlayerModerations()"
|
||||
:icon="Refresh"
|
||||
circle />
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="playerModerationTable.loading"
|
||||
@click="refreshPlayerModerations()">
|
||||
<Spinner v-if="playerModerationTable.loading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
</TooltipWrapper>
|
||||
</div>
|
||||
|
||||
@@ -40,8 +43,10 @@
|
||||
|
||||
<script setup>
|
||||
import { computed, ref, watch } from 'vue';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { ElMessageBox } from 'element-plus';
|
||||
import { Refresh } from '@element-plus/icons-vue';
|
||||
import { Spinner } from '@/components/ui/spinner';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
|
||||
@@ -49,13 +49,16 @@
|
||||
class="flex-[0.4]"
|
||||
style="margin: 0 10px" />
|
||||
<TooltipWrapper side="bottom" :content="t('view.notification.refresh_tooltip')">
|
||||
<el-button
|
||||
type="default"
|
||||
:loading="isNotificationsLoading"
|
||||
:icon="Refresh"
|
||||
circle
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="isNotificationsLoading"
|
||||
style="flex: none"
|
||||
@click="refreshNotifications()" />
|
||||
@click="refreshNotifications()">
|
||||
<Spinner v-if="isNotificationsLoading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
</TooltipWrapper>
|
||||
</div>
|
||||
</template>
|
||||
@@ -71,8 +74,10 @@
|
||||
|
||||
<script setup>
|
||||
import { computed, ref, watch } from 'vue';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { ElMessageBox } from 'element-plus';
|
||||
import { Refresh } from '@element-plus/icons-vue';
|
||||
import { Spinner } from '@/components/ui/spinner';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { toast } from 'vue-sonner';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
@@ -158,14 +158,15 @@
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<TooltipWrapper side="bottom" :content="t('view.search.avatar.refresh_tooltip')">
|
||||
<el-button
|
||||
type="default"
|
||||
:loading="userDialog.isAvatarsLoading"
|
||||
size="small"
|
||||
:icon="Refresh"
|
||||
class="ml-1"
|
||||
circle
|
||||
@click="refreshUserDialogAvatars"></el-button>
|
||||
<Button
|
||||
class="rounded-full ml-1"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="userDialog.isAvatarsLoading"
|
||||
@click="refreshUserDialogAvatars">
|
||||
<Spinner v-if="userDialog.isAvatarsLoading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
</TooltipWrapper>
|
||||
<span style="font-size: 14px; margin-left: 5px; margin-right: 5px">{{
|
||||
t('view.search.avatar.result_count', {
|
||||
@@ -346,6 +347,7 @@
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { ButtonGroup } from '@/components/ui/button-group';
|
||||
import { Checkbox } from '@/components/ui/checkbox';
|
||||
import { Spinner } from '@/components/ui/spinner';
|
||||
import { Trash2 } from 'lucide-vue-next';
|
||||
import { ref } from 'vue';
|
||||
import { storeToRefs } from 'pinia';
|
||||
|
||||
@@ -17,14 +17,16 @@
|
||||
<span v-text="totalCacheSize"></span>
|
||||
<span>GB</span>
|
||||
<TooltipWrapper side="top" :content="t('dialog.config_json.refresh')">
|
||||
<el-button
|
||||
type="default"
|
||||
:loading="VRChatCacheSizeLoading"
|
||||
size="small"
|
||||
:icon="Refresh"
|
||||
circle
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="VRChatCacheSizeLoading"
|
||||
style="margin-left: 5px"
|
||||
@click="getVRChatCacheSize"></el-button>
|
||||
@click="getVRChatCacheSize">
|
||||
<Spinner v-if="VRChatCacheSizeLoading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
</TooltipWrapper>
|
||||
|
||||
<div style="margin-top: 10px">
|
||||
@@ -173,6 +175,7 @@
|
||||
import { Checkbox } from '@/components/ui/checkbox';
|
||||
import { ElMessageBox } from 'element-plus';
|
||||
import { Refresh } from '@element-plus/icons-vue';
|
||||
import { Spinner } from '@/components/ui/spinner';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { toast } from 'vue-sonner';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
@@ -42,14 +42,16 @@
|
||||
</el-select>
|
||||
<div>
|
||||
<TooltipWrapper side="bottom" :content="t('side_panel.refresh_tooltip')">
|
||||
<el-button
|
||||
type="default"
|
||||
:loading="isRefreshFriendsLoading"
|
||||
size="small"
|
||||
:icon="Refresh"
|
||||
circle
|
||||
<Button
|
||||
class="rounded-full"
|
||||
variant="outline"
|
||||
size="icon-sm"
|
||||
:disabled="isRefreshFriendsLoading"
|
||||
style="margin-right: 10px"
|
||||
@click="refreshFriendsList"></el-button>
|
||||
@click="refreshFriendsList">
|
||||
<Spinner v-if="isRefreshFriendsLoading" />
|
||||
<Refresh v-else />
|
||||
</Button>
|
||||
</TooltipWrapper>
|
||||
</div>
|
||||
</div>
|
||||
@@ -74,7 +76,9 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Refresh } from '@element-plus/icons-vue';
|
||||
import { Spinner } from '@/components/ui/spinner';
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
|
||||
@@ -15,14 +15,16 @@
|
||||
</template>
|
||||
|
||||
<el-descriptions-item>
|
||||
<el-button type="default" :icon="Calendar" size="small" @click="openCalendarEvent(event)">{{
|
||||
t('dialog.group_calendar.event_card.export_to_calendar')
|
||||
}}</el-button>
|
||||
<Button variant="outline" size="sm" @click="openCalendarEvent(event)">
|
||||
<Calendar />
|
||||
{{ t('dialog.group_calendar.event_card.export_to_calendar') }}
|
||||
</Button>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item>
|
||||
<el-button type="default" :icon="Download" size="small" @click="downloadEventIcs(event)">{{
|
||||
t('dialog.group_calendar.event_card.download_ics')
|
||||
}}</el-button>
|
||||
<Button variant="outline" size="sm" @click="downloadEventIcs(event)">
|
||||
<Download />
|
||||
{{ t('dialog.group_calendar.event_card.download_ics') }}
|
||||
</Button>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item :label="t('dialog.group_calendar.event_card.category')">
|
||||
{{ capitalizeFirst(event.category) }}
|
||||
@@ -72,6 +74,7 @@
|
||||
|
||||
<script setup>
|
||||
import { Calendar, Download, Share, Star, StarFilled } from '@element-plus/icons-vue';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { computed } from 'vue';
|
||||
import { toast } from 'vue-sonner';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
@@ -16,15 +16,20 @@
|
||||
{{ t('dialog.note_export.description8') }} <br />
|
||||
</div>
|
||||
|
||||
<el-button size="small" :disabled="loading" style="margin-top: 10px" @click="updateNoteExportDialog">
|
||||
<Button
|
||||
size="sm"
|
||||
variant="outline"
|
||||
:disabled="loading"
|
||||
style="margin-top: 10px"
|
||||
@click="updateNoteExportDialog">
|
||||
{{ t('dialog.note_export.refresh') }}
|
||||
</el-button>
|
||||
<el-button size="small" :disabled="loading" style="margin-top: 10px" @click="exportNoteExport">
|
||||
</Button>
|
||||
<Button size="sm" variant="outline" :disabled="loading" style="margin-top: 10px" @click="exportNoteExport">
|
||||
{{ t('dialog.note_export.export') }}
|
||||
</el-button>
|
||||
<el-button v-if="loading" size="small" style="margin-top: 10px" @click="cancelNoteExport">
|
||||
</Button>
|
||||
<Button v-if="loading" size="sm" variant="outline" style="margin-top: 10px" @click="cancelNoteExport">
|
||||
{{ t('dialog.note_export.cancel') }}
|
||||
</el-button>
|
||||
</Button>
|
||||
<span v-if="loading" style="margin: 10px">
|
||||
<el-icon style="margin-right: 5px"><Loading /></el-icon>
|
||||
{{ t('dialog.note_export.progress') }} {{ progress }}/{{ progressTotal }}
|
||||
|
||||
Reference in New Issue
Block a user