mirror of
https://github.com/MrUnknownDE/VRCX.git
synced 2026-04-27 02:33:48 +02:00
refactor: app.js (#1291)
* refactor: frontend * Fix avatar gallery sort * Update .NET dependencies * Update npm dependencies electron v37.1.0 * bulkRefreshFriends * fix dark theme * Remove crowdin * Fix config.json dialog not updating * VRCX log file fixes & add Cef log * Remove SharedVariable, fix startup * Revert init theme change * Logging date not working? Fix WinformThemer designer error * Add Cef request hander, no more escaping main page * clean * fix * fix * clean * uh * Apply thememode at startup, fixes random user colours * Split database into files * Instance info remove empty lines * Open external VRC links with VRCX * Electron fixes * fix userdialog style * ohhhh * fix store * fix store * fix: load all group members after kicking a user * fix: world dialog favorite button style * fix: Clear VRCX Cache Timer input value * clean * Fix VR overlay * Fix VR overlay 2 * Fix Discord discord rich presence for RPC worlds * Clean up age verified user tags * Fix playerList being occupied after program reload * no `this` * Fix login stuck loading * writable: false * Hide dialogs on logout * add flush sync option * rm LOGIN event * rm LOGOUT event * remove duplicate event listeners * remove duplicate event listeners * clean * remove duplicate event listeners * clean * fix theme style * fix t * clearable * clean * fix ipcEvent * Small changes * Popcorn Palace support * Remove checkActiveFriends * Clean up * Fix dragEnterCef * Block API requests when not logged in * Clear state on login & logout * Fix worldDialog instances not updating * use <script setup> * Fix avatar change event, CheckGameRunning at startup * Fix image dragging * fix * Remove PWI * fix updateLoop * add webpack-dev-server to dev environment * rm unnecessary chunks * use <script setup> * webpack-dev-server changes * use <script setup> * use <script setup> * Fix UGC text size * Split login event * t * use <script setup> * fix * Update .gitignore and enable checkJs in jsconfig * fix i18n t * use <script setup> * use <script setup> * clean * global types * fix * use checkJs for debugging * Add watchState for login watchers * fix .vue template * type fixes * rm Vue.filter * Cef v138.0.170, VC++ 2022 * Settings fixes * Remove 'USER:CURRENT' * clean up 2FA callbacks * remove userApply * rm i18n import * notification handling to use notification store methods * refactor favorite handling to use favorite store methods and clean up event emissions * refactor moderation handling to use dedicated functions for player moderation events * refactor friend handling to use dedicated functions for friend events * Fix program startup, move lang init * Fix friend state * Fix status change error * Fix user notes diff * fix * rm group event * rm auth event * rm avatar event * clean * clean * getUser * getFriends * getFavoriteWorlds, getFavoriteAvatars * AvatarGalleryUpload btn style & package.json update * Fix friend requests * Apply user * Apply world * Fix note diff * Fix VR overlay * Fixes * Update build scripts * Apply avatar * Apply instance * Apply group * update hidden VRC+ badge * Fix sameInstance "private" * fix 502/504 API errors * fix 502/504 API errors * clean * Fix friend in same instance on orange showing twice in friends list * Add back in broken friend state repair methods * add types --------- Co-authored-by: Natsumi <cmcooper123@hotmail.com>
This commit is contained in:
pa
GitHub
112
src/views/Sidebar/Sidebar.vue
Normal file
112
src/views/Sidebar/Sidebar.vue
Normal file
@@ -0,0 +1,112 @@
|
||||
<template>
|
||||
<div v-show="isSideBarTabShow" id="aside" class="x-aside-container" :style="{ width: `${asideWidth}px` }">
|
||||
<div style="display: flex; align-items: baseline">
|
||||
<el-select
|
||||
value=""
|
||||
clearable
|
||||
:placeholder="$t('side_panel.search_placeholder')"
|
||||
filterable
|
||||
remote
|
||||
:remote-method="quickSearchRemoteMethod"
|
||||
popper-class="x-quick-search"
|
||||
style="flex: 1; padding: 10px"
|
||||
@change="quickSearchChange">
|
||||
<el-option v-for="item in quickSearchItems" :key="item.value" :value="item.value" :label="item.label">
|
||||
<div class="x-friend-item">
|
||||
<template v-if="item.ref">
|
||||
<div class="detail">
|
||||
<span class="name" :style="{ color: item.ref.$userColour }">{{
|
||||
item.ref.displayName
|
||||
}}</span>
|
||||
<span v-if="!item.ref.isFriend" class="extra"></span>
|
||||
<span v-else-if="item.ref.state === 'offline'" class="extra">{{
|
||||
$t('side_panel.search_result_active')
|
||||
}}</span>
|
||||
<span v-else-if="item.ref.state === 'active'" class="extra">{{
|
||||
$t('side_panel.search_result_offline')
|
||||
}}</span>
|
||||
<Location
|
||||
v-else
|
||||
class="extra"
|
||||
:location="item.ref.location"
|
||||
:traveling="item.ref.travelingToLocation"
|
||||
:link="false" />
|
||||
</div>
|
||||
<img v-lazy="userImage(item.ref)" class="avatar" />
|
||||
</template>
|
||||
<span v-else>
|
||||
{{ $t('side_panel.search_result_more') }}
|
||||
<span style="font-weight: bold">{{ item.label }}</span>
|
||||
</span>
|
||||
</div>
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-tooltip placement="bottom" :content="$t('side_panel.direct_access_tooltip')" :disabled="hideTooltips">
|
||||
<el-button
|
||||
type="default"
|
||||
size="mini"
|
||||
icon="el-icon-discover"
|
||||
circle
|
||||
@click="directAccessPaste"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip placement="bottom" :content="$t('side_panel.refresh_tooltip')" :disabled="hideTooltips">
|
||||
<el-button
|
||||
type="default"
|
||||
:loading="isRefreshFriendsLoading"
|
||||
size="mini"
|
||||
icon="el-icon-refresh"
|
||||
circle
|
||||
style="margin-right: 10px"
|
||||
@click="refreshFriendsList" />
|
||||
</el-tooltip>
|
||||
</div>
|
||||
<el-tabs class="zero-margin-tabs" stretch style="height: calc(100% - 60px); margin-top: 5px">
|
||||
<el-tab-pane>
|
||||
<template slot="label">
|
||||
<span>{{ $t('side_panel.friends') }}</span>
|
||||
<span style="color: #909399; font-size: 12px; margin-left: 10px">
|
||||
({{ onlineFriendCount }}/{{ friends.size }})
|
||||
</span>
|
||||
</template>
|
||||
<el-backtop target=".zero-margin-tabs .el-tabs__content" :bottom="20" :right="20"></el-backtop>
|
||||
<FriendsSidebar @confirm-delete-friend="confirmDeleteFriend" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane lazy>
|
||||
<template slot="label">
|
||||
<span>{{ $t('side_panel.groups') }}</span>
|
||||
<span style="color: #909399; font-size: 12px; margin-left: 10px">
|
||||
({{ groupInstances.length }})
|
||||
</span>
|
||||
</template>
|
||||
<GroupsSidebar :group-instances="groupInstances" :group-order="inGameGroupOrder" />
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { storeToRefs } from 'pinia';
|
||||
import { computed } from 'vue';
|
||||
import { userImage } from '../../shared/utils';
|
||||
import {
|
||||
useAppearanceSettingsStore,
|
||||
useFriendStore,
|
||||
useGroupStore,
|
||||
useSearchStore,
|
||||
useUiStore
|
||||
} from '../../stores';
|
||||
import FriendsSidebar from './components/FriendsSidebar.vue';
|
||||
import GroupsSidebar from './components/GroupsSidebar.vue';
|
||||
|
||||
const { friends, isRefreshFriendsLoading, onlineFriendCount } = storeToRefs(useFriendStore());
|
||||
const { refreshFriendsList, confirmDeleteFriend } = useFriendStore();
|
||||
const { hideTooltips, asideWidth } = storeToRefs(useAppearanceSettingsStore());
|
||||
const { menuActiveIndex } = storeToRefs(useUiStore());
|
||||
const { quickSearchRemoteMethod, quickSearchChange, directAccessPaste } = useSearchStore();
|
||||
const { quickSearchItems } = storeToRefs(useSearchStore());
|
||||
const { inGameGroupOrder, groupInstances } = storeToRefs(useGroupStore());
|
||||
|
||||
const isSideBarTabShow = computed(() => {
|
||||
return !(menuActiveIndex.value === 'friendList' || menuActiveIndex.value === 'charts');
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user