Mars
cbfa18d1d3
- 管理后台 adminT 文案库、结算与代理端页面、表单校验 - 玩家端 vue-i18n 补全首页/公告/串关与 ms 文案 - Element Plus ms 语言包与共享 locale 工具
109 lines
3.5 KiB
Vue
109 lines
3.5 KiB
Vue
<script setup lang="ts">
|
|
import { ref, onMounted } from 'vue';
|
|
import { useAdminLocale } from '../../composables/useAdminLocale';
|
|
import api from '../../api';
|
|
import { formatAmount } from '../../utils/format-amount';
|
|
import { betStatusLabel, betStatusTagType, betTypeLabel } from '../../utils/bet-labels';
|
|
|
|
const { t } = useAdminLocale();
|
|
|
|
interface BetRow {
|
|
id: string;
|
|
betNo: string;
|
|
betType?: string;
|
|
stake: string | number;
|
|
status: string;
|
|
placedAt?: string;
|
|
user?: { username?: string };
|
|
}
|
|
|
|
const bets = ref<BetRow[]>([]);
|
|
const total = ref(0);
|
|
const page = ref(1);
|
|
const pageSize = ref(10);
|
|
|
|
onMounted(load);
|
|
|
|
async function load() {
|
|
const { data } = await api.get('/agent/bets', {
|
|
params: { page: page.value, pageSize: pageSize.value },
|
|
});
|
|
bets.value = (data.data.items ?? []) as BetRow[];
|
|
total.value = data.data.total ?? 0;
|
|
}
|
|
|
|
function onPageChange(p: number) {
|
|
page.value = p;
|
|
load();
|
|
}
|
|
|
|
function onSizeChange(size: number) {
|
|
pageSize.value = size;
|
|
page.value = 1;
|
|
load();
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="admin-list-page">
|
|
<div class="page-header">
|
|
<h2 class="page-title">{{ t('page.agent_bets.title') }}</h2>
|
|
<span class="page-desc">{{ t('page.agent_bets.desc') }}</span>
|
|
</div>
|
|
|
|
<el-card class="data-card" shadow="never">
|
|
<div class="table-wrap">
|
|
<el-table :data="bets" stripe>
|
|
<el-table-column prop="id" :label="t('bet.col.serial')" width="56" align="center" />
|
|
<el-table-column prop="betNo" :label="t('bet.col.bet_no')" width="168" show-overflow-tooltip>
|
|
<template #default="{ row }">
|
|
<span class="bet-no">{{ row.betNo }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column :label="t('bet.col.player')" min-width="100">
|
|
<template #default="{ row }">{{ row.user?.username ?? '—' }}</template>
|
|
</el-table-column>
|
|
<el-table-column :label="t('common.type')" width="88" align="center">
|
|
<template #default="{ row }">
|
|
<el-tag v-if="row.betType" type="info" size="small" effect="plain">
|
|
{{ betTypeLabel(row.betType) }}
|
|
</el-tag>
|
|
<span v-else>—</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column :label="t('bet.col.stake')" width="110" align="right">
|
|
<template #default="{ row }">{{ formatAmount(row.stake) }}</template>
|
|
</el-table-column>
|
|
<el-table-column :label="t('common.status')" width="96" align="center">
|
|
<template #default="{ row }">
|
|
<el-tag :type="betStatusTagType(row.status)" size="small">
|
|
{{ betStatusLabel(row.status) }}
|
|
</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</div>
|
|
<div class="pager">
|
|
<el-pagination
|
|
v-model:current-page="page"
|
|
v-model:page-size="pageSize"
|
|
:total="total"
|
|
:page-sizes="[10, 20, 50, 100]"
|
|
layout="total, sizes, prev, pager, next"
|
|
background
|
|
@current-change="onPageChange"
|
|
@size-change="onSizeChange"
|
|
/>
|
|
</div>
|
|
</el-card>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.page-header { display: flex; align-items: baseline; gap: 12px; }
|
|
.page-title { font-size: 20px; font-weight: 700; color: #e0e0e0; }
|
|
.page-desc { font-size: 13px; color: #3a3a3a; }
|
|
.data-card { border-radius: 12px; }
|
|
.bet-no { font-size: 12px; color: #ccc; font-family: ui-monospace, monospace; word-break: break-all; }
|
|
</style>
|