Moved some button to tools tab

This commit is contained in:
pa
2025-09-22 19:54:39 +09:00
committed by Natsumi
parent ee70e61293
commit 215b988261
22 changed files with 333 additions and 189 deletions

View File

@@ -49,29 +49,29 @@
size="small"
:icon="Picture"
style="margin-left: 0; margin-right: 5px; margin-top: 10px"
@click="showGalleryDialog()"
@click="redirectToToolsTab"
>{{ t('view.profile.profile.manage_gallery_inventory_icon') }}</el-button
>
<el-button
size="small"
:icon="ChatDotRound"
style="margin-left: 0; margin-right: 5px; margin-top: 10px"
@click="showDiscordNamesDialog()"
>{{ t('view.profile.profile.discord_names') }}</el-button
@click="redirectToToolsTab"
>{{ t('view.tools.export.discord_names') }}</el-button
>
<el-button
size="small"
:icon="Printer"
style="margin-left: 0; margin-right: 5px; margin-top: 10px"
@click="showExportFriendsListDialog()"
>{{ t('view.profile.profile.export_friend_list') }}</el-button
@click="redirectToToolsTab"
>{{ t('view.tools.export.export_friend_list') }}</el-button
>
<el-button
size="small"
:icon="User"
style="margin-left: 0; margin-right: 5px; margin-top: 10px"
@click="showExportAvatarsListDialog()"
>{{ t('view.profile.profile.export_own_avatars') }}</el-button
@click="redirectToToolsTab"
>{{ t('view.tools.export.export_own_avatars') }}</el-button
>
</div>
</div>
@@ -481,11 +481,6 @@
</template>
</el-tree>
</div>
<DiscordNamesDialog v-model:discordNamesDialogVisible="discordNamesDialogVisible" :friends="friends" />
<ExportFriendsListDialog
v-model:isExportFriendsListDialogVisible="isExportFriendsListDialogVisible"
:friends="friends" />
<ExportAvatarsListDialog v-model:isExportAvatarsListDialogVisible="isExportAvatarsListDialogVisible" />
</div>
</template>
@@ -506,20 +501,11 @@
parseUserUrl,
formatDateFilter
} from '../../shared/utils';
import { redirectToToolsTab } from '../../shared/utils/base/ui';
import { useAuthStore } from '../../stores';
import DiscordNamesDialog from './dialogs/DiscordNamesDialog.vue';
import ExportFriendsListDialog from './dialogs/ExportFriendsListDialog.vue';
import ExportAvatarsListDialog from './dialogs/ExportAvatarsListDialog.vue';
import {
useSearchStore,
useFriendStore,
useUserStore,
useAvatarStore,
useInviteStore,
useUiStore
} from '../../stores';
const { friends } = storeToRefs(useFriendStore());
import { useSearchStore, useUserStore, useAvatarStore, useInviteStore, useUiStore } from '../../stores';
const { pastDisplayNameTable, currentUser } = storeToRefs(useUserStore());
const { showUserDialog, lookupUser, getCurrentUser } = useUserStore();
const { showAvatarDialog } = useAvatarStore();
@@ -542,17 +528,8 @@
const currentUserTreeData = ref([]);
const currentUserFeedbackData = ref([]);
const discordNamesDialogVisible = ref(false);
const isExportFriendsListDialogVisible = ref(false);
const isExportAvatarsListDialogVisible = ref(false);
const visits = ref(0);
// redirect to tools tab
function showGalleryDialog() {
menuActiveIndex.value = 'tools';
}
function getVisits() {
miscRequest.getVisits().then((args) => {
visits.value = args.json;
@@ -563,17 +540,6 @@
miscRequest.getVRChatCredits().then((args) => (vrchatCredit.value = args.json?.balance));
}
function showDiscordNamesDialog() {
discordNamesDialogVisible.value = true;
}
function showExportFriendsListDialog() {
isExportFriendsListDialogVisible.value = true;
}
function showExportAvatarsListDialog() {
isExportAvatarsListDialogVisible.value = true;
}
function promptUsernameDialog() {
ElMessageBox.prompt(t('prompt.direct_access_username.description'), t('prompt.direct_access_username.header'), {
distinguishCancelAndClose: true,

View File

@@ -637,7 +637,7 @@
size="small"
:icon="DocumentCopy"
style="margin-top: 5px"
@click="showNoteExportDialog"
@click="redirectToToolsTab"
>{{ t('view.settings.appearance.user_dialog.export_notes') }}</el-button
>
</div>
@@ -1270,7 +1270,7 @@
<span class="header">{{ t('view.settings.category.pictures') }}</span>
<div class="options-container-item" style="margin-top: 15px">
<el-button-group
><el-button size="small" :icon="Picture" @click="showScreenshotMetadataDialog()">{{
><el-button size="small" :icon="Picture" @click="redirectToToolsTab">{{
t('view.settings.advanced.advanced.screenshot_metadata')
}}</el-button>
</el-button-group>
@@ -1279,14 +1279,14 @@
<!-- redirect to tools tab end -->
<div class="options-container">
<span class="header">{{ t('view.settings.pictures.pictures.open_folder') }}</span>
<span class="header">{{ t('view.tools.pictures.pictures.open_folder') }}</span>
<div class="options-container-item" style="margin-top: 15px">
<el-button-group>
<el-button size="small" :icon="Folder" @click="openVrcPhotosFolder()">{{
t('view.settings.pictures.pictures.vrc_photos')
<el-button size="small" :icon="Folder" @click="redirectToToolsTab">{{
t('view.tools.pictures.pictures.vrc_photos')
}}</el-button>
<el-button size="small" :icon="Folder" @click="openVrcScreenshotsFolder()">{{
t('view.settings.pictures.pictures.steam_screenshots')
<el-button size="small" :icon="Folder" @click="redirectToToolsTab">{{
t('view.tools.pictures.pictures.steam_screenshots')
}}</el-button>
</el-button-group>
</div>
@@ -1488,7 +1488,7 @@
" />
<!--//- Sentry Error Reporting (Nightly Only)-->
<div v-if="isNightlyBuild">
<div v-if="branch === 'Nightly'">
<span class="sub-header">Anonymous Error Reporting (Nightly Only)</span>
<simple-switch
label="Help improve VRCX by sending anonymous error reports. Only collects crash and error information, no personal data or VRChat information is collected."
@@ -1932,6 +1932,7 @@
import FeedFiltersDialog from './dialogs/FeedFiltersDialog.vue';
import AvatarProviderDialog from './dialogs/AvatarProviderDialog.vue';
import { openExternalLink } from '../../shared/utils';
import { redirectToToolsTab } from '../../shared/utils/base/ui';
import { THEME_CONFIG } from '../../shared/constants';
const OpenSourceSoftwareNoticeDialog = defineAsyncComponent(
@@ -2003,6 +2004,7 @@
const { saveOpenVROption, updateVRLastLocation, updateOpenVR, updateVRConfigVars } = useVrStore();
const { clearVRCXCache, showRegistryBackupDialog } = useVrcxStore();
const { setLocalFavoriteFriendsGroups } = useGeneralSettingsStore();
const { branch } = storeToRefs(useVRCXUpdaterStore());
const {
isStartAtWindowsStartup,
@@ -2176,8 +2178,7 @@
notificationOpacity,
autoDeleteOldPrints,
saveInstanceEmoji,
sentryErrorReporting,
isNightlyBuild
sentryErrorReporting
} = storeToRefs(advancedSettingsStore);
const {
@@ -2274,20 +2275,10 @@
feedFiltersDialogMode.value = 'wrist';
}
// redirect to tools tab
function showNoteExportDialog() {
menuActiveIndex.value = 'tools';
}
function showNotificationPositionDialog() {
isNotificationPositionDialogVisible.value = true;
}
// redirect to tools tab
function showScreenshotMetadataDialog() {
menuActiveIndex.value = 'tools';
}
function openVrcxAppDataFolder() {
AppApi.OpenVrcxAppDataFolder().then((result) => {
if (result) {
@@ -2320,38 +2311,6 @@
});
}
function openVrcPhotosFolder() {
AppApi.OpenVrcPhotosFolder().then((result) => {
if (result) {
ElMessage({
message: 'Folder opened',
type: 'success'
});
} else {
ElMessage({
message: "Folder dosn't exist",
type: 'error'
});
}
});
}
function openVrcScreenshotsFolder() {
AppApi.OpenVrcScreenshotsFolder().then((result) => {
if (result) {
ElMessage({
message: 'Folder opened',
type: 'success'
});
} else {
ElMessage({
message: "Folder dosn't exist",
type: 'error'
});
}
});
}
function openCrashVrcCrashDumps() {
AppApi.OpenCrashVrcCrashDumps().then((result) => {
if (result) {

View File

@@ -31,7 +31,7 @@
<el-icon class="rotation-transition" :class="{ 'is-rotated': !categoryCollapsed['image'] }"
><ArrowRight
/></el-icon>
<span class="category-title">{{ t('view.tools.image.header') }}</span>
<span class="category-title">{{ t('view.tools.pictures.header') }}</span>
</div>
<div class="tools-grid" v-show="!categoryCollapsed['image']">
<el-card :body-style="{ padding: '0px' }" class="tool-card">
@@ -40,8 +40,10 @@
<i class="ri-screenshot-2-line"></i>
</div>
<div class="tool-info">
<div class="tool-name">{{ t('view.tools.image.screenshot') }}</div>
<div class="tool-description">{{ t('view.tools.image.screenshot_description') }}</div>
<div class="tool-name">{{ t('view.tools.pictures.screenshot') }}</div>
<div class="tool-description">
{{ t('view.tools.pictures.screenshot_description') }}
</div>
</div>
</div>
</el-card>
@@ -51,8 +53,38 @@
<i class="ri-multi-image-line"></i>
</div>
<div class="tool-info">
<div class="tool-name">{{ t('view.tools.image.inventory') }}</div>
<div class="tool-description">{{ t('view.tools.image.inventory_description') }}</div>
<div class="tool-name">{{ t('view.tools.pictures.inventory') }}</div>
<div class="tool-description">
{{ t('view.tools.pictures.inventory_description') }}
</div>
</div>
</div>
</el-card>
<el-card :body-style="{ padding: '0px' }" class="tool-card">
<div class="tool-content" @click="openVrcPhotosFolder">
<div class="tool-icon">
<i class="ri-folder-image-line"></i>
</div>
<div class="tool-info">
<div class="tool-name">{{ t('view.tools.pictures.pictures.vrc_photos') }}</div>
<div class="tool-description">
{{ t('view.tools.pictures.pictures.vrc_photos_description') }}
</div>
</div>
</div>
</el-card>
<el-card :body-style="{ padding: '0px' }" class="tool-card">
<div class="tool-content" @click="openVrcScreenshotsFolder">
<div class="tool-icon">
<i class="ri-folder-image-line"></i>
</div>
<div class="tool-info">
<div class="tool-name">
{{ t('view.tools.pictures.pictures.steam_screenshots') }}
</div>
<div class="tool-description">
{{ t('view.tools.pictures.pictures.steam_screenshots_description') }}
</div>
</div>
</div>
</el-card>
@@ -64,17 +96,60 @@
<el-icon class="rotation-transition" :class="{ 'is-rotated': !categoryCollapsed['user'] }"
><ArrowRight
/></el-icon>
<span class="category-title">{{ t('view.tools.user.header') }}</span>
<span class="category-title">{{ t('view.tools.export.header') }}</span>
</div>
<div class="tools-grid" v-show="!categoryCollapsed['user']">
<el-card :body-style="{ padding: '0px' }" class="tool-card">
<div class="tool-content" @click="showExportDiscordNamesDialog">
<div class="tool-icon">
<i class="ri-discord-line"></i>
</div>
<div class="tool-info">
<div class="tool-name">{{ t('view.tools.export.discord_names') }}</div>
<div class="tool-description">
{{ t('view.tools.user.discord_names_description') }}
</div>
</div>
</div>
</el-card>
<el-card :body-style="{ padding: '0px' }" class="tool-card">
<div class="tool-content" @click="showNoteExportDialog">
<div class="tool-icon">
<i class="ri-user-shared-line"></i>
</div>
<div class="tool-info">
<div class="tool-name">{{ t('view.tools.user.export_notes') }}</div>
<div class="tool-description">{{ t('view.tools.user.export_notes_description') }}</div>
<div class="tool-name">{{ t('view.tools.export.export_notes') }}</div>
<div class="tool-description">
{{ t('view.tools.export.export_notes_description') }}
</div>
</div>
</div>
</el-card>
<el-card :body-style="{ padding: '0px' }" class="tool-card">
<div class="tool-content" @click="showExportFriendsListDialog">
<div class="tool-icon">
<i class="ri-user-shared-line"></i>
</div>
<div class="tool-info">
<div class="tool-name">{{ t('view.tools.export.export_friend_list') }}</div>
<div class="tool-description">
{{ t('view.tools.user.export_friend_list_description') }}
</div>
</div>
</div>
</el-card>
<el-card :body-style="{ padding: '0px' }" class="tool-card">
<div class="tool-content" @click="showExportAvatarsListDialog">
<div class="tool-icon">
<i class="ri-user-shared-line"></i>
</div>
<div class="tool-info">
<div class="tool-name">{{ t('view.tools.export.export_own_avatars') }}</div>
<div class="tool-description">
{{ t('view.tools.user.export_own_avatars_description') }}
</div>
</div>
</div>
</el-card>
@@ -93,27 +168,40 @@
:isNoteExportDialogVisible="isNoteExportDialogVisible"
@close="isNoteExportDialogVisible = false" />
<GalleryDialog />
<ExportDiscordNamesDialog
v-model:discordNamesDialogVisible="isExportDiscordNamesDialogVisible"
:friends="friends" />
<ExportFriendsListDialog
v-model:isExportFriendsListDialogVisible="isExportFriendsListDialogVisible"
:friends="friends" />
<ExportAvatarsListDialog v-model:isExportAvatarsListDialogVisible="isExportAvatarsListDialogVisible" />
</template>
</div>
</template>
<script setup>
import { ArrowRight } from '@element-plus/icons-vue';
import { ElMessage } from 'element-plus';
import { ref, defineAsyncComponent, computed } from 'vue';
import { useI18n } from 'vue-i18n';
import { storeToRefs } from 'pinia';
import { useUiStore, useGalleryStore } from '../../stores';
import { useUiStore, useGalleryStore, useFriendStore } from '../../stores';
const GroupCalendarDialog = defineAsyncComponent(() => import('./dialogs/GroupCalendarDialog.vue'));
const ScreenshotMetadataDialog = defineAsyncComponent(() => import('./dialogs/ScreenshotMetadataDialog.vue'));
const NoteExportDialog = defineAsyncComponent(() => import('./dialogs/NoteExportDialog.vue'));
const GalleryDialog = defineAsyncComponent(() => import('./dialogs/GalleryDialog.vue'));
const ExportDiscordNamesDialog = defineAsyncComponent(() => import('./dialogs/ExportDiscordNamesDialog.vue'));
const ExportFriendsListDialog = defineAsyncComponent(() => import('./dialogs/ExportFriendsListDialog.vue'));
const ExportAvatarsListDialog = defineAsyncComponent(() => import('./dialogs/ExportAvatarsListDialog.vue'));
const { t } = useI18n();
const uiStore = useUiStore();
const { showGalleryDialog } = useGalleryStore();
const { menuActiveIndex } = storeToRefs(uiStore);
const { friends } = storeToRefs(useFriendStore());
const categoryCollapsed = ref({
group: false,
@@ -124,6 +212,9 @@
const isGroupCalendarDialogVisible = ref(false);
const isScreenshotMetadataDialogVisible = ref(false);
const isNoteExportDialogVisible = ref(false);
const isExportDiscordNamesDialogVisible = ref(false);
const isExportFriendsListDialogVisible = ref(false);
const isExportAvatarsListDialogVisible = ref(false);
const isShowToolsTab = computed(() => menuActiveIndex.value === 'tools');
@@ -142,6 +233,50 @@
const toggleCategory = (category) => {
categoryCollapsed.value[category] = !categoryCollapsed.value[category];
};
function showExportDiscordNamesDialog() {
isExportDiscordNamesDialogVisible.value = true;
}
function showExportFriendsListDialog() {
isExportFriendsListDialogVisible.value = true;
}
function showExportAvatarsListDialog() {
isExportAvatarsListDialogVisible.value = true;
}
function openVrcPhotosFolder() {
AppApi.OpenVrcPhotosFolder().then((result) => {
if (result) {
ElMessage({
message: 'Folder opened',
type: 'success'
});
} else {
ElMessage({
message: "Folder dosn't exist",
type: 'error'
});
}
});
}
function openVrcScreenshotsFolder() {
AppApi.OpenVrcScreenshotsFolder().then((result) => {
if (result) {
ElMessage({
message: 'Folder opened',
type: 'success'
});
} else {
ElMessage({
message: "Folder dosn't exist",
type: 'error'
});
}
});
}
</script>
<style lang="scss" scoped>