138 lines
4.2 KiB
Vue
138 lines
4.2 KiB
Vue
<template>
|
|
<div class="art-full-height">
|
|
<!-- 方向切换 + 搜索 -->
|
|
<div class="direction-bar">
|
|
<el-radio-group v-model="currentDirection" size="default" @change="onDirectionChange">
|
|
<el-radio-button :value="0">顺时针</el-radio-button>
|
|
<el-radio-button :value="1">逆时针</el-radio-button>
|
|
</el-radio-group>
|
|
</div>
|
|
<TableSearch v-model="searchForm" @search="handleSearch" @reset="resetSearchParams" />
|
|
|
|
<ElCard class="art-table-card" shadow="never">
|
|
<ArtTableHeader v-model:columns="columnChecks" :loading="loading" @refresh="refreshData">
|
|
<template #left>
|
|
<ElSpace wrap>
|
|
<ElButton
|
|
v-permission="'dice:reward:index:update'"
|
|
type="primary"
|
|
@click="weightRatioVisible = true"
|
|
v-ripple
|
|
>
|
|
权重配比
|
|
</ElButton>
|
|
<ElButton
|
|
v-permission="'dice:reward:index:index'"
|
|
@click="weightTestVisible = true"
|
|
v-ripple
|
|
>
|
|
一键测试权重
|
|
</ElButton>
|
|
</ElSpace>
|
|
</template>
|
|
</ArtTableHeader>
|
|
|
|
<ArtTable
|
|
ref="tableRef"
|
|
rowKey="id"
|
|
:loading="loading"
|
|
:data="data"
|
|
:columns="columns"
|
|
:pagination="pagination"
|
|
@sort-change="handleSortChange"
|
|
@pagination:size-change="handleSizeChange"
|
|
@pagination:current-change="handleCurrentChange"
|
|
/>
|
|
</ElCard>
|
|
|
|
<WeightRatioDialog v-model="weightRatioVisible" @success="refreshData" />
|
|
<WeightTestDialog v-model="weightTestVisible" @success="refreshData" />
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { useTable } from '@/hooks/core/useTable'
|
|
import api from '../../api/reward/index'
|
|
import TableSearch from './modules/table-search.vue'
|
|
import WeightRatioDialog from './modules/weight-ratio-dialog.vue'
|
|
import WeightTestDialog from './modules/weight-test-dialog.vue'
|
|
|
|
const currentDirection = ref<0 | 1>(0)
|
|
const weightRatioVisible = ref(false)
|
|
const weightTestVisible = ref(false)
|
|
|
|
const searchForm = ref<Record<string, unknown>>({
|
|
direction: 0,
|
|
tier: undefined
|
|
})
|
|
|
|
const listApi = (params: Record<string, any>) => {
|
|
return api.list({ ...params, direction: currentDirection.value })
|
|
}
|
|
|
|
const handleSearch = (params: Record<string, any>) => {
|
|
Object.assign(searchParams, { ...params, direction: currentDirection.value })
|
|
getData()
|
|
}
|
|
|
|
const onDirectionChange = () => {
|
|
searchForm.value.direction = currentDirection.value
|
|
Object.assign(searchParams, { direction: currentDirection.value, tier: searchForm.value.tier })
|
|
getData()
|
|
}
|
|
|
|
const {
|
|
columns,
|
|
columnChecks,
|
|
data,
|
|
loading,
|
|
getData,
|
|
searchParams,
|
|
pagination,
|
|
resetSearchParams,
|
|
handleSortChange,
|
|
handleSizeChange,
|
|
handleCurrentChange,
|
|
refreshData
|
|
} = useTable({
|
|
core: {
|
|
apiFn: listApi,
|
|
apiParams: { direction: 0, limit: 100 },
|
|
columnsFactory: () => [
|
|
{ prop: 'start_index', label: 'table.columns.dice.startIndex', width: 100, align: 'center' },
|
|
{ prop: 'end_index', label: 'table.columns.dice.endIndex', width: 110, align: 'center' },
|
|
{ prop: 'tier', label: 'table.columns.dice.tier', width: 90, align: 'center', sortable: true },
|
|
{
|
|
prop: 'grid_number',
|
|
label: 'table.columns.dice.dicePoints',
|
|
width: 120,
|
|
align: 'center',
|
|
sortable: true,
|
|
showOverflowTooltip: true
|
|
},
|
|
{
|
|
prop: 'ui_text',
|
|
label: 'table.columns.dice.displayText',
|
|
minWidth: 100,
|
|
align: 'center',
|
|
showOverflowTooltip: true
|
|
},
|
|
{ prop: 'real_ev', label: 'table.columns.dice.realEv', width: 110, align: 'center' },
|
|
{ prop: 'remark', label: 'table.columns.common.remark', minWidth: 80, align: 'center', showOverflowTooltip: true },
|
|
{ prop: 'weight', label: 'table.columns.dice.weight', width: 110, align: 'center' }
|
|
]
|
|
}
|
|
})
|
|
|
|
onMounted(() => {
|
|
searchParams.direction = currentDirection.value
|
|
})
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.direction-bar {
|
|
margin-bottom: 12px;
|
|
padding: 8px 0;
|
|
}
|
|
</style>
|