Files
VRCX/html/src/mixins/tabs/friendsList.pug
T
2023-07-19 11:11:34 +12:00

84 lines
8.1 KiB
Plaintext
Raw Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
mixin friendsListTab()
.x-container(v-show="$refs.menu && $refs.menu.activeIndex === 'friendsList'" v-if="$refs.menu && $refs.menu.activeIndex === 'friendsList'")
div.options-container(style="margin-top:0")
span.header {{ $t('view.friend_list.header') }}
div(style="float:right;font-size:13px")
div(v-if="friendsListBulkUnfriendMode" style="display:inline-block;margin-right:10px")
el-button(size="small" @click="showBulkUnfriendSelectionConfirm") {{ $t('view.friend_list.bulk_unfriend_selection') }}
//- el-button(size="small" @click="showBulkUnfriendAllConfirm" style="margin-right:5px") Bulk Unfriend All
div(style="display:inline-block;margin-right:10px")
span.name {{ $t('view.friend_list.bulk_unfriend') }}
el-switch(v-model="friendsListBulkUnfriendMode" style="margin-left:5px")
span {{ $t('view.friend_list.load') }}
template(v-if="friendsListLoading")
span(v-text="friendsListLoadingProgress" style="margin-left:5px")
el-tooltip(placement="top" :content="$t('view.friend_list.cancel_tooltip')" :disabled="hideTooltips")
el-button(@click="friendsListLoading = false" size="mini" icon="el-icon-loading" circle style="margin-left:5px")
template(v-else)
el-tooltip(placement="top" :content="$t('view.friend_list.load_tooltip')" :disabled="hideTooltips")
el-button(@click="friendsListLoadUsers" size="mini" icon="el-icon-refresh-left" circle style="margin-left:5px")
div(style="margin:10px 0 0 10px;display:flex;align-items:center")
div(style="flex:none;margin-right:10px")
el-tooltip(placement="bottom" :content="$t('view.friend_list.favorites_only_tooltip')" :disabled="hideTooltips")
el-switch(v-model="friendsListSearchFilterVIP" @change="friendsListSearchChange" active-color="#13ce66")
el-input(v-model="friendsListSearch" :placeholder="$t('view.friend_list.search_placeholder')" @change="friendsListSearchChange" clearable style="flex:1")
el-select(v-model="friendsListSearchFilters" multiple clearable collapse-tags style="flex:none;width:200px;margin:0 10px" @change="friendsListSearchChange" :placeholder="$t('view.friend_list.filter_placeholder')")
el-option(v-once v-for="type in ['Display Name', 'User Name', 'Rank', 'Status', 'Bio', 'Memo']" :key="type" :label="type" :value="type")
el-tooltip(placement="top" :content="$t('view.friend_list.refresh_tooltip')" :disabled="hideTooltips")
el-button(type="default" @click="friendsListSearchChange" icon="el-icon-refresh" circle style="flex:none")
el-tooltip(placement="top" :content="$t('view.friend_list.clear_tooltip')" :disabled="hideTooltips")
el-button(type="default" @click="friendsListTable.data = []" icon="el-icon-delete" circle style="flex:none;margin-left:5px")
data-tables(v-bind="friendsListTable" @row-click="selectFriendsListRow" style="margin-top:10px;cursor:pointer")
el-table-column(v-if="friendsListBulkUnfriendMode" width="55" prop="$selected")
template(v-once #default="scope")
el-button(type="text" size="mini" @click.stop)
el-checkbox(v-model="scope.row.$selected")
el-table-column(:label="$t('table.friendList.no')" width="70" prop="$friendNum" sortable="custom")
el-table-column(:label="$t('table.friendList.avatar')" width="70" prop="photo")
template(v-once #default="scope")
el-popover(placement="right" height="500px" trigger="hover")
img.friends-list-avatar(slot="reference" v-lazy="userImage(scope.row)")
img.friends-list-avatar(v-lazy="userImageFull(scope.row)" style="height:500px;cursor:pointer" @click="showFullscreenImageDialog(userImageFull(scope.row))")
el-table-column(:label="$t('table.friendList.displayName')" min-width="140" prop="displayName" sortable :sort-method="(a, b) => sortAlphabetically(a, b, 'displayName')")
template(v-once #default="scope")
span.name(v-if="randomUserColours" v-text="scope.row.displayName" :style="{'color':scope.row.$userColour}")
span.name(v-else v-text="scope.row.displayName")
el-table-column(:label="$t('table.friendList.rank')" width="110" prop="$trustSortNum" sortable="custom")
template(v-once #default="scope")
span.name(v-if="randomUserColours" v-text="scope.row.$trustLevel" :class="scope.row.$trustClass")
span.name(v-else v-text="scope.row.$trustLevel" :style="{'color':scope.row.$userColour}")
el-table-column(:label="$t('table.friendList.status')" min-width="180" prop="status" sortable :sort-method="(a, b) => sortStatus(a.status, b.status)")
template(v-once #default="scope")
i.x-user-status(v-if="scope.row.status !== 'offline'" :class="statusClass(scope.row.status)")
span
span(v-text="scope.row.statusDescription")
el-table-column(:label="$t('table.friendList.language')" width="110" prop="$languages" sortable :sort-method="(a, b) => sortLanguages(a, b)")
template(v-once #default="scope")
el-tooltip(v-for="item in scope.row.$languages" :key="item.key" placement="top")
template(#content)
span {{ item.value }} ({{ item.key }})
span.flags(:class="languageClass(item.key)" style="display:inline-block;margin-left:5px")
el-table-column(:label="$t('table.friendList.bioLink')" width="100" prop="bioLinks")
template(v-once #default="scope")
el-tooltip(v-if="link" v-for="(link, index) in scope.row.bioLinks" :key="index")
template(#content)
span(v-text="link")
img(:src="getFaviconUrl(link)" style="width:16px;height:16px;vertical-align:middle;margin-right:5px;cursor:pointer" @click.stop="openExternalLink(link)")
el-table-column(:label="$t('table.friendList.joinCount')" width="120" prop="$joinCount" sortable)
el-table-column(:label="$t('table.friendList.timeTogether')" width="140" prop="$timeSpent" sortable)
template(v-once #default="scope")
span(v-if="scope.row.$timeSpent") {{ scope.row.$timeSpent | timeToText }}
el-table-column(:label="$t('table.friendList.lastSeen')" width="170" prop="$lastSeen" sortable :sort-method="(a, b) => sortAlphabetically(a, b, '$lastSeen')")
template(v-once #default="scope")
span {{ scope.row.$lastSeen | formatDate('long') }}
el-table-column(:label="$t('table.friendList.lastActivity')" width="170" prop="last_activity" sortable :sort-method="(a, b) => sortAlphabetically(a, b, 'last_activity')")
template(v-once #default="scope")
span {{ scope.row.last_activity | formatDate('long') }}
el-table-column(:label="$t('table.friendList.lastLogin')" width="170" prop="last_login" sortable :sort-method="(a, b) => sortAlphabetically(a, b, 'last_login')")
template(v-once #default="scope")
span {{ scope.row.last_login | formatDate('long') }}
el-table-column(:label="$t('table.friendList.dateJoined')" width="120" prop="date_joined" sortable :sort-method="(a, b) => sortAlphabetically(a, b, 'date_joined')")
el-table-column(:label="$t('table.friendList.unfriend')" width="80")
template(v-once #default="scope")
el-button(type="text" icon="el-icon-close" size="mini" @click.stop="confirmDeleteFriend(scope.row.id)")