mirror of
https://github.com/MrUnknownDE/VRCX.git
synced 2026-05-07 14:56:06 +02:00
add row key to feed items and gamelog items
This commit is contained in:
pa
Natsumi
+2
-1
@@ -30,7 +30,8 @@ export const useFeedStore = defineStore('Feed', () => {
|
|||||||
defaultSort: {
|
defaultSort: {
|
||||||
prop: 'created_at',
|
prop: 'created_at',
|
||||||
order: 'descending'
|
order: 'descending'
|
||||||
}
|
},
|
||||||
|
rowKey: (row) => `${row.type}:${row.rowId ?? Math.random()}`
|
||||||
},
|
},
|
||||||
pageSize: 20,
|
pageSize: 20,
|
||||||
pageSizeLinked: true,
|
pageSizeLinked: true,
|
||||||
|
|||||||
@@ -69,7 +69,8 @@ export const useGameLogStore = defineStore('GameLog', () => {
|
|||||||
defaultSort: {
|
defaultSort: {
|
||||||
prop: 'created_at',
|
prop: 'created_at',
|
||||||
order: 'descending'
|
order: 'descending'
|
||||||
}
|
},
|
||||||
|
rowKey: (row) => `${row.type}:${row.rowId ?? Math.random()}`
|
||||||
},
|
},
|
||||||
pageSize: 20,
|
pageSize: 20,
|
||||||
pageSizeLinked: true,
|
pageSizeLinked: true,
|
||||||
|
|||||||
+5
-109
@@ -70,8 +70,6 @@
|
|||||||
</template>
|
</template>
|
||||||
<template v-else-if="scope.row.type === 'Avatar'">
|
<template v-else-if="scope.row.type === 'Avatar'">
|
||||||
<div style="display: flex; align-items: center">
|
<div style="display: flex; align-items: center">
|
||||||
<el-popover placement="right" :width="500" trigger="click">
|
|
||||||
<template #reference>
|
|
||||||
<div style="display: inline-block; vertical-align: top; width: 160px">
|
<div style="display: inline-block; vertical-align: top; width: 160px">
|
||||||
<template v-if="scope.row.previousCurrentAvatarThumbnailImageUrl">
|
<template v-if="scope.row.previousCurrentAvatarThumbnailImageUrl">
|
||||||
<img
|
<img
|
||||||
@@ -88,18 +86,10 @@
|
|||||||
:avatartags="scope.row.previousCurrentAvatarTags" />
|
:avatartags="scope.row.previousCurrentAvatarTags" />
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
|
||||||
<img
|
|
||||||
:src="scope.row.previousCurrentAvatarImageUrl"
|
|
||||||
:class="['x-link', 'x-popover-image']"
|
|
||||||
@click="showFullscreenImageDialog(scope.row.previousCurrentAvatarImageUrl)"
|
|
||||||
loading="lazy" />
|
|
||||||
</el-popover>
|
|
||||||
<span style="position: relative; margin: 0 10px">
|
<span style="position: relative; margin: 0 10px">
|
||||||
<el-icon><Right /></el-icon>
|
<el-icon><Right /></el-icon>
|
||||||
</span>
|
</span>
|
||||||
<el-popover placement="right" :width="500" trigger="click">
|
|
||||||
<template #reference>
|
|
||||||
<div style="display: inline-block; vertical-align: top; width: 160px">
|
<div style="display: inline-block; vertical-align: top; width: 160px">
|
||||||
<template v-if="scope.row.currentAvatarThumbnailImageUrl">
|
<template v-if="scope.row.currentAvatarThumbnailImageUrl">
|
||||||
<img
|
<img
|
||||||
@@ -116,60 +106,17 @@
|
|||||||
:avatartags="scope.row.currentAvatarTags" />
|
:avatartags="scope.row.currentAvatarTags" />
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
|
||||||
<img
|
|
||||||
:src="scope.row.currentAvatarImageUrl"
|
|
||||||
:class="['x-link', 'x-popover-image']"
|
|
||||||
@click="showFullscreenImageDialog(scope.row.currentAvatarImageUrl)"
|
|
||||||
loading="lazy" />
|
|
||||||
</el-popover>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="scope.row.type === 'Status'">
|
<template v-else-if="scope.row.type === 'Status'">
|
||||||
<el-tooltip placement="top">
|
|
||||||
<template #content>
|
|
||||||
<span v-if="scope.row.previousStatus === 'active'">{{
|
|
||||||
t('dialog.user.status.active')
|
|
||||||
}}</span>
|
|
||||||
<span v-else-if="scope.row.previousStatus === 'join me'">{{
|
|
||||||
t('dialog.user.status.join_me')
|
|
||||||
}}</span>
|
|
||||||
<span v-else-if="scope.row.previousStatus === 'ask me'">{{
|
|
||||||
t('dialog.user.status.ask_me')
|
|
||||||
}}</span>
|
|
||||||
<span v-else-if="scope.row.previousStatus === 'busy'">{{
|
|
||||||
t('dialog.user.status.busy')
|
|
||||||
}}</span>
|
|
||||||
<span v-else>{{ t('dialog.user.status.offline') }}</span>
|
|
||||||
</template>
|
|
||||||
<i class="x-user-status" :class="statusClass(scope.row.previousStatus)"></i>
|
<i class="x-user-status" :class="statusClass(scope.row.previousStatus)"></i>
|
||||||
</el-tooltip>
|
|
||||||
<span style="margin-left: 5px" v-text="scope.row.previousStatusDescription"></span>
|
<span style="margin-left: 5px" v-text="scope.row.previousStatusDescription"></span>
|
||||||
<br />
|
<br />
|
||||||
<span>
|
<span>
|
||||||
<el-icon><Right /></el-icon>
|
<el-icon><Right /></el-icon>
|
||||||
</span>
|
</span>
|
||||||
<el-tooltip placement="top">
|
|
||||||
<template #content>
|
<i class="x-user-status" :class="statusClass(scope.row.status)" style="margin: 0 5px"></i>
|
||||||
<span v-if="scope.row.status === 'active'">{{
|
|
||||||
t('dialog.user.status.active')
|
|
||||||
}}</span>
|
|
||||||
<span v-else-if="scope.row.status === 'join me'">{{
|
|
||||||
t('dialog.user.status.join_me')
|
|
||||||
}}</span>
|
|
||||||
<span v-else-if="scope.row.status === 'ask me'">{{
|
|
||||||
t('dialog.user.status.ask_me')
|
|
||||||
}}</span>
|
|
||||||
<span v-else-if="scope.row.status === 'busy'">{{
|
|
||||||
t('dialog.user.status.busy')
|
|
||||||
}}</span>
|
|
||||||
<span v-else>{{ t('dialog.user.status.offline') }}</span>
|
|
||||||
</template>
|
|
||||||
<i
|
|
||||||
class="x-user-status"
|
|
||||||
:class="statusClass(scope.row.status)"
|
|
||||||
style="margin: 0 5px"></i>
|
|
||||||
</el-tooltip>
|
|
||||||
<span v-text="scope.row.statusDescription"></span>
|
<span v-text="scope.row.statusDescription"></span>
|
||||||
</template>
|
</template>
|
||||||
<template v-else-if="scope.row.type === 'Bio'">
|
<template v-else-if="scope.row.type === 'Bio'">
|
||||||
@@ -226,68 +173,18 @@
|
|||||||
</template>
|
</template>
|
||||||
<template v-else-if="scope.row.type === 'Status'">
|
<template v-else-if="scope.row.type === 'Status'">
|
||||||
<template v-if="scope.row.statusDescription === scope.row.previousStatusDescription">
|
<template v-if="scope.row.statusDescription === scope.row.previousStatusDescription">
|
||||||
<el-tooltip placement="top">
|
|
||||||
<template #content>
|
|
||||||
<span v-if="scope.row.previousStatus === 'active'">{{
|
|
||||||
t('dialog.user.status.active')
|
|
||||||
}}</span>
|
|
||||||
<span v-else-if="scope.row.previousStatus === 'join me'">{{
|
|
||||||
t('dialog.user.status.join_me')
|
|
||||||
}}</span>
|
|
||||||
<span v-else-if="scope.row.previousStatus === 'ask me'">{{
|
|
||||||
t('dialog.user.status.ask_me')
|
|
||||||
}}</span>
|
|
||||||
<span v-else-if="scope.row.previousStatus === 'busy'">{{
|
|
||||||
t('dialog.user.status.busy')
|
|
||||||
}}</span>
|
|
||||||
<span v-else>{{ t('dialog.user.status.offline') }}</span>
|
|
||||||
</template>
|
|
||||||
<i class="x-user-status" :class="statusClass(scope.row.previousStatus)"></i>
|
<i class="x-user-status" :class="statusClass(scope.row.previousStatus)"></i>
|
||||||
</el-tooltip>
|
|
||||||
<span style="margin: 0 5px">
|
<span style="margin: 0 5px">
|
||||||
<el-icon><Right /></el-icon>
|
<el-icon><Right /></el-icon>
|
||||||
</span>
|
</span>
|
||||||
<el-tooltip placement="top">
|
|
||||||
<template #content>
|
|
||||||
<span v-if="scope.row.status === 'active'">{{
|
|
||||||
t('dialog.user.status.active')
|
|
||||||
}}</span>
|
|
||||||
<span v-else-if="scope.row.status === 'join me'">{{
|
|
||||||
t('dialog.user.status.join_me')
|
|
||||||
}}</span>
|
|
||||||
<span v-else-if="scope.row.status === 'ask me'">{{
|
|
||||||
t('dialog.user.status.ask_me')
|
|
||||||
}}</span>
|
|
||||||
<span v-else-if="scope.row.status === 'busy'">{{
|
|
||||||
t('dialog.user.status.busy')
|
|
||||||
}}</span>
|
|
||||||
<span v-else>{{ t('dialog.user.status.offline') }}</span>
|
|
||||||
</template>
|
|
||||||
<i class="x-user-status" :class="statusClass(scope.row.status)"></i>
|
<i class="x-user-status" :class="statusClass(scope.row.status)"></i>
|
||||||
</el-tooltip>
|
|
||||||
</template>
|
</template>
|
||||||
<template v-else>
|
<template v-else>
|
||||||
<el-tooltip placement="top">
|
|
||||||
<template #content>
|
|
||||||
<span v-if="scope.row.status === 'active'">{{
|
|
||||||
t('dialog.user.status.active')
|
|
||||||
}}</span>
|
|
||||||
<span v-else-if="scope.row.status === 'join me'">{{
|
|
||||||
t('dialog.user.status.join_me')
|
|
||||||
}}</span>
|
|
||||||
<span v-else-if="scope.row.status === 'ask me'">{{
|
|
||||||
t('dialog.user.status.ask_me')
|
|
||||||
}}</span>
|
|
||||||
<span v-else-if="scope.row.status === 'busy'">{{
|
|
||||||
t('dialog.user.status.busy')
|
|
||||||
}}</span>
|
|
||||||
<span v-else>{{ t('dialog.user.status.offline') }}</span>
|
|
||||||
</template>
|
|
||||||
<i
|
<i
|
||||||
class="x-user-status"
|
class="x-user-status"
|
||||||
:class="statusClass(scope.row.status)"
|
:class="statusClass(scope.row.status)"
|
||||||
style="margin-right: 3px"></i>
|
style="margin-right: 3px"></i>
|
||||||
</el-tooltip>
|
|
||||||
<span v-text="scope.row.statusDescription"></span>
|
<span v-text="scope.row.statusDescription"></span>
|
||||||
</template>
|
</template>
|
||||||
</template>
|
</template>
|
||||||
@@ -313,13 +210,12 @@
|
|||||||
import { storeToRefs } from 'pinia';
|
import { storeToRefs } from 'pinia';
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
|
|
||||||
import { useFeedStore, useGalleryStore, useUiStore, useUserStore } from '../../stores';
|
|
||||||
import { formatDateFilter, statusClass, timeToText } from '../../shared/utils';
|
import { formatDateFilter, statusClass, timeToText } from '../../shared/utils';
|
||||||
|
import { useFeedStore, useUserStore } from '../../stores';
|
||||||
|
|
||||||
const { showUserDialog } = useUserStore();
|
const { showUserDialog } = useUserStore();
|
||||||
const { feedTable } = storeToRefs(useFeedStore());
|
const { feedTable } = storeToRefs(useFeedStore());
|
||||||
const { feedTableLookup } = useFeedStore();
|
const { feedTableLookup } = useFeedStore();
|
||||||
const { showFullscreenImageDialog } = useGalleryStore();
|
|
||||||
|
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
|
|
||||||
|
|||||||
@@ -54,29 +54,20 @@
|
|||||||
|
|
||||||
<el-table-column :label="t('table.gameLog.type')" prop="type" width="120">
|
<el-table-column :label="t('table.gameLog.type')" prop="type" width="120">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-tooltip placement="right" :show-after="500">
|
|
||||||
<template #content>
|
|
||||||
<span>{{ t('view.game_log.filters.' + scope.row.type) }}</span>
|
|
||||||
</template>
|
|
||||||
<span
|
<span
|
||||||
v-if="scope.row.location && scope.row.type !== 'Location'"
|
v-if="scope.row.location && scope.row.type !== 'Location'"
|
||||||
class="x-link"
|
class="x-link"
|
||||||
@click="showWorldDialog(scope.row.location)"
|
@click="showWorldDialog(scope.row.location)"
|
||||||
v-text="t('view.game_log.filters.' + scope.row.type)"></span>
|
v-text="t('view.game_log.filters.' + scope.row.type)"></span>
|
||||||
<span v-else v-text="t('view.game_log.filters.' + scope.row.type)"></span>
|
<span v-else v-text="t('view.game_log.filters.' + scope.row.type)"></span>
|
||||||
</el-tooltip>
|
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
|
||||||
<el-table-column :label="t('table.gameLog.icon')" prop="isFriend" width="70" align="center">
|
<el-table-column :label="t('table.gameLog.icon')" prop="isFriend" width="70" align="center">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<template v-if="gameLogIsFriend(scope.row)">
|
<template v-if="gameLogIsFriend(scope.row)">
|
||||||
<el-tooltip v-if="gameLogIsFavorite(scope.row)" placement="top" content="Favorite">
|
<span v-if="gameLogIsFavorite(scope.row)">⭐</span>
|
||||||
<span>⭐</span>
|
<span v-else>💚</span>
|
||||||
</el-tooltip>
|
|
||||||
<el-tooltip v-else placement="top" content="Friend">
|
|
||||||
<span>💚</span>
|
|
||||||
</el-tooltip>
|
|
||||||
</template>
|
</template>
|
||||||
<span v-else></span>
|
<span v-else></span>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
Reference in New Issue
Block a user