mojiahui/webman-buildadmin
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化游戏实时对局页面样式-增加预估赔付栏的排序

Browse Source
This commit is contained in:
zhenhui
2026-04-28 15:09:02 +08:00
parent aefb8b16c8
commit 85133ee92b
1 changed files with 50 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
web/src/views/backend/game/live/index.vue
View File

@@ -97,15 +97,29 @@
<el-col :xs="24" :sm="12">
<el-card shadow="never">
<template #header>{{ t('game.live.candidate_title') }}</template>
<el-table :data="candidateNumbersSorted" :height="tableHeight" :row-class-name="candidateRowClassName" class="candidate-table">
<el-table-column prop="number" :label="t('game.live.number')" width="76" align="center" header-align="center">
<el-table
:data="candidateNumbersSorted"
:height="tableHeight"
:row-class-name="candidateRowClassName"
class="candidate-table"
:default-sort="{ prop: 'estimated_loss', order: 'ascending' }"
@sort-change="onCandidateSortChange"
>
<el-table-column prop="number" :label="t('game.live.number')" width="76" align="center" header-align="center" sortable="custom">
<template #default="scope">
<el-tag size="small" effect="plain" class="number-tag">
{{ scope.row.number ?? '-' }}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="estimated_loss" :label="t('game.live.estimated_loss')" width="110" align="center" header-align="center" />
<el-table-column
prop="estimated_loss"
:label="t('game.live.estimated_loss')"
width="110"
align="center"
header-align="center"
sortable="custom"
/>
<el-table-column :label="t('game.live.btn_draw')" width="96" align="center" header-align="center">
<template #default="scope">
<el-switch
@@ -261,6 +275,7 @@ const wsUrl = ref('')
const wsTopics = ref<string[]>([])
const wsClient = ref<WebSocket | null>(null)
const isMobile = ref(false)
const candidateSort = ref<{ prop: string; order: 'ascending' | 'descending' | null }>({ prop: 'estimated_loss', order: 'ascending' })
function updateIsMobile(): void {
isMobile.value = window.matchMedia('(max-width: 768px)').matches
@@ -437,21 +452,45 @@ function estimatedLossSortValue(v: unknown): number {
const candidateNumbersSorted = computed(() => {
const list = Array.isArray(snapshot.candidate_numbers) ? [...snapshot.candidate_numbers] : []
list.sort((a, b) => {
const ea = estimatedLossSortValue(a?.estimated_loss)
const eb = estimatedLossSortValue(b?.estimated_loss)
if (ea !== eb) {
return ea - eb
const sp = candidateSort.value.prop
const so = candidateSort.value.order
const dir = so === 'descending' ? -1 : 1
if (sp === 'number') {
const na = numberValue(a?.number)
const nb = numberValue(b?.number)
if (na !== null && nb !== null && na !== nb) {
return (na - nb) * dir
}
} else {
const ea = estimatedLossSortValue(a?.estimated_loss)
const eb = estimatedLossSortValue(b?.estimated_loss)
if (ea !== eb) {
return (ea - eb) * dir
}
}
const na = numberValue(a?.number)
const nb = numberValue(b?.number)
if (na !== null && nb !== null && na !== nb) {
return na - nb
const ea2 = estimatedLossSortValue(a?.estimated_loss)
const eb2 = estimatedLossSortValue(b?.estimated_loss)
if (ea2 !== eb2) {
return ea2 - eb2
}
const na2 = numberValue(a?.number)
const nb2 = numberValue(b?.number)
if (na2 !== null && nb2 !== null && na2 !== nb2) {
return na2 - nb2
}
return String(a?.number ?? '').localeCompare(String(b?.number ?? ''))
})
return list
})
function onCandidateSortChange(arg: { prop: string; order: 'ascending' | 'descending' | null }): void {
const prop = typeof arg?.prop === 'string' && arg.prop !== '' ? arg.prop : 'estimated_loss'
const order = arg?.order === 'descending' || arg?.order === 'ascending' ? arg.order : 'ascending'
candidateSort.value = { prop, order }
}
function isScheduledNumber(v: unknown): boolean {
const n = numberValue(v)
if (n === null) {