mirror of
https://github.com/MrUnknownDE/VRCX.git
synced 2026-05-05 06:16:05 +02:00
UI/UX and Performance Improvement (#1122)
* wip * wip * ui improve and fix * fix
This commit is contained in:
pa
GitHub
+33
-30
@@ -1,33 +1,32 @@
|
||||
mixin feedTab
|
||||
.x-container(v-show='$refs.menu && $refs.menu.activeIndex === \'feed\'')
|
||||
data-tables(v-bind='feedTable' v-loading='feedTable.loading')
|
||||
template(#tool)
|
||||
div(style='margin: 0 0 10px; display: flex; align-items: center')
|
||||
div(style='flex: none; margin-right: 10px; display: flex; align-items: center')
|
||||
el-tooltip(
|
||||
placement='bottom'
|
||||
:content='$t("view.feed.favorites_only_tooltip")'
|
||||
:disabled='hideTooltips')
|
||||
el-switch(v-model='feedTable.vip' @change='feedTableLookup' active-color='#13ce66')
|
||||
el-select(
|
||||
v-model='feedTable.filter'
|
||||
@change='feedTableLookup'
|
||||
multiple
|
||||
clearable
|
||||
style='flex: 1; height: 40px'
|
||||
:placeholder='$t("view.feed.filter_placeholder")')
|
||||
el-option(
|
||||
v-for='type in ["GPS", "Online", "Offline", "Status", "Avatar", "Bio"]'
|
||||
:key='type'
|
||||
:label='$t("view.feed.filters." + type)'
|
||||
:value='type')
|
||||
el-input(
|
||||
v-model='feedTable.search'
|
||||
:placeholder='$t("view.feed.search_placeholder")'
|
||||
@keyup.native.13='feedTableLookup'
|
||||
@change='feedTableLookup'
|
||||
clearable
|
||||
style='flex: none; width: 150px; margin: 0 10px')
|
||||
div(style='margin: 0 0 10px; display: flex; align-items: center')
|
||||
div(style='flex: none; margin-right: 10px; display: flex; align-items: center')
|
||||
el-tooltip(
|
||||
placement='bottom'
|
||||
:content='$t("view.feed.favorites_only_tooltip")'
|
||||
:disabled='hideTooltips')
|
||||
el-switch(v-model='feedTable.vip' @change='feedTableLookup' active-color='#13ce66')
|
||||
el-select(
|
||||
v-model='feedTable.filter'
|
||||
@change='feedTableLookup'
|
||||
multiple
|
||||
clearable
|
||||
style='flex: 1; height: 40px'
|
||||
:placeholder='$t("view.feed.filter_placeholder")')
|
||||
el-option(
|
||||
v-for='type in ["GPS", "Online", "Offline", "Status", "Avatar", "Bio"]'
|
||||
:key='type'
|
||||
:label='$t("view.feed.filters." + type)'
|
||||
:value='type')
|
||||
el-input(
|
||||
v-model='feedTable.search'
|
||||
:placeholder='$t("view.feed.search_placeholder")'
|
||||
@keyup.native.13='feedTableLookup'
|
||||
@change='feedTableLookup'
|
||||
clearable
|
||||
style='flex: none; width: 150px; margin: 0 10px')
|
||||
data-tables(v-bind='feedTable' v-loading='feedTable.loading' lazy)
|
||||
el-table-column(type='expand' width='20')
|
||||
template(#default='scope')
|
||||
div(style='position: relative; font-size: 14px')
|
||||
@@ -58,7 +57,9 @@ mixin feedTab
|
||||
template(v-else-if='scope.row.type === "Avatar"')
|
||||
div(style='display: flex; align-items: center')
|
||||
el-popover(placement='right' width='500px' trigger='click')
|
||||
div(slot='reference' style='display: inline-block; vertical-align: top; width: 160px')
|
||||
div(
|
||||
slot='reference'
|
||||
style='display: inline-block; vertical-align: top; width: 160px')
|
||||
template(v-if='scope.row.previousCurrentAvatarThumbnailImageUrl')
|
||||
img.x-link(
|
||||
v-lazy='scope.row.previousCurrentAvatarThumbnailImageUrl'
|
||||
@@ -77,7 +78,9 @@ mixin feedTab
|
||||
span(style='position: relative; margin: 0 10px')
|
||||
i.el-icon-right
|
||||
el-popover(placement='right' width='500px' trigger='click')
|
||||
div(slot='reference' style='display: inline-block; vertical-align: top; width: 160px')
|
||||
div(
|
||||
slot='reference'
|
||||
style='display: inline-block; vertical-align: top; width: 160px')
|
||||
template(v-if='scope.row.currentAvatarThumbnailImageUrl')
|
||||
img.x-link(
|
||||
v-lazy='scope.row.currentAvatarThumbnailImageUrl'
|
||||
|
||||
@@ -79,6 +79,7 @@ mixin friendsListTab
|
||||
data-tables(
|
||||
v-bind='friendsListTable'
|
||||
@row-click='selectFriendsListRow'
|
||||
:table-props='{ height: "calc(100vh - 170px)", size: "mini" }'
|
||||
style='margin-top: 10px; cursor: pointer')
|
||||
el-table-column(
|
||||
width='55'
|
||||
@@ -129,8 +130,10 @@ mixin friendsListTab
|
||||
sortable
|
||||
:sort-method='(a, b) => sortStatus(a.status, b.status)')
|
||||
template(#default='scope')
|
||||
i.x-user-status(v-if='scope.row.status !== "offline"' :class='statusClass(scope.row.status)')
|
||||
span
|
||||
i.x-user-status(
|
||||
v-if='scope.row.status !== "offline"'
|
||||
:class='statusClass(scope.row.status)'
|
||||
style='margin-right: 3px')
|
||||
span(v-text='scope.row.statusDescription')
|
||||
el-table-column(
|
||||
:label='$t("table.friendList.language")'
|
||||
@@ -142,7 +145,9 @@ mixin friendsListTab
|
||||
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-right: 5px')
|
||||
span.flags(
|
||||
:class='languageClass(item.key)'
|
||||
style='display: inline-block; margin-right: 5px')
|
||||
el-table-column(:label='$t("table.friendList.bioLink")' width='100' prop='bioLinks')
|
||||
template(#default='scope')
|
||||
el-tooltip(v-if='link' v-for='(link, index) in scope.row.bioLinks' :key='index')
|
||||
|
||||
@@ -448,8 +448,7 @@ mixin playerListTab
|
||||
el-table-column(:label='$t("table.playerList.status")' min-width='180' prop='ref.status')
|
||||
template(#default='scope')
|
||||
template(v-if='scope.row.ref.status')
|
||||
i.x-user-status(:class='statusClass(scope.row.ref.status)')
|
||||
span
|
||||
i.x-user-status(:class='statusClass(scope.row.ref.status)' style='margin-right: 3px')
|
||||
span(v-text='scope.row.ref.statusDescription')
|
||||
//- el-table-column(label="Group" min-width="180" prop="groupOnNameplate" sortable)
|
||||
//- template(v-once #default="scope")
|
||||
|
||||
Reference in New Issue
Block a user