261 lines
8.2 KiB
Vue
261 lines
8.2 KiB
Vue
<template>
|
||
<div class="app-container">
|
||
<!-- 搜索区域 -->
|
||
<el-form :model="queryParams" ref="queryRef" v-show="showSearch" :inline="true" label-width="80px">
|
||
<el-form-item label="赛事编号" prop="matchNumStr">
|
||
<el-input v-model="queryParams.matchNumStr" placeholder="请输入赛事编号" clearable style="width: 240px"
|
||
@keyup.enter="handleQuery" />
|
||
</el-form-item>
|
||
<el-form-item label="联赛类型" prop="leagueAbbName">
|
||
<el-select v-model="queryParams.leagueAbbName" @change="handleQuery" style="width: 240px" clearable placeholder="请选择联赛类型">
|
||
<el-option
|
||
v-for="item in dataScopeOptions"
|
||
:key="item.value"
|
||
:label="item.label"
|
||
:value="item.value"
|
||
></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
|
||
<!-- <el-form-item label="时间">
|
||
<el-date-picker v-model="dateRange" value-format="YYYY-MM-DD" type="daterange" range-separator="-"
|
||
start-placeholder="开始日期" end-placeholder="结束日期" style="width: 240px"></el-date-picker>
|
||
</el-form-item> -->
|
||
|
||
<el-form-item label="时间" prop="weekday">
|
||
<el-select
|
||
v-model="queryParams.weekday"
|
||
style="width: 240px"
|
||
@change="handleWeekdayChange"
|
||
clearable
|
||
placeholder="请选择星期"
|
||
>
|
||
<el-option
|
||
v-for="item in PickerOptions"
|
||
:key="item.value"
|
||
:label="item.text"
|
||
:value="item.value"
|
||
></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-button type="primary" icon="Search" @click="handleQuery" :loading="loading">查询</el-button>
|
||
<el-button icon="Refresh" @click="resetQuery" :loading="loading">重置</el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
<!--loading-->
|
||
<div
|
||
v-if="loading"
|
||
v-loading="loading"
|
||
class="loading-page"
|
||
element-loading-text="正在加载..."
|
||
style="width: 100%; height: calc(100vh - 250px)"
|
||
></div>
|
||
<div v-else-if="pageList.length && !loading">
|
||
<!-- 表格数据 -->
|
||
<el-table v-loading="loading" :data="pageList">
|
||
<el-table-column label="赛事编号" prop="matchNumStr" />
|
||
<el-table-column label="联赛" prop="leagueAllName" :show-overflow-tooltip="true" />
|
||
<el-table-column label="主队" prop="homeTeamAllName" :show-overflow-tooltip="true" />
|
||
<el-table-column label="客队" prop="awayTeamAbbName" />
|
||
<el-table-column label="固定奖金" prop="matchId">
|
||
<template #default="scope">
|
||
<!-- <el-button link type="primary" @click="handleJumpLink(scope.row)">查看</el-button> -->
|
||
<el-popover placement="bottom" :width="360">
|
||
<template #reference>
|
||
<el-button link type="primary" @dblclick="handleJumpLink(scope.row)">查看</el-button>
|
||
</template>
|
||
<template #default>
|
||
<div>
|
||
<el-table border :data="scope.row.matchResults">
|
||
<el-table-column label="游戏" prop="matchNumStr">
|
||
<template #default="item">
|
||
{{ item.row.codeName }}
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="开赛结果" prop="reportSatus">
|
||
<template #default="item">
|
||
<el-tag type="error">{{ item.row.combinationDesc }}</el-tag>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="奖金" prop="matchNumStr">
|
||
<template #default="item">
|
||
{{ item.row.odds }}
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
</div>
|
||
</template>
|
||
</el-popover>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="比赛开始时间" align="center" prop="matchDateTime">
|
||
<template #default="scope">
|
||
<span>{{ parseTime(scope.row.matchDateTime) }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="报告状态" prop="reportSatus">
|
||
<template #default="scope">
|
||
<el-tag v-if="scope.row.reportSatus === 1" type="success">已生成</el-tag>
|
||
<el-tag v-else>未生成</el-tag>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="U-HA模型" align="center" class-name="small-padding fixed-width">
|
||
<template #header>
|
||
<span>U-HA模型</span>
|
||
<el-popover placement="top" width="300" trigger="click">
|
||
<template #reference>
|
||
<el-icon class="ml-1 cursor-pointer" style="vertical-align: middle;">
|
||
<QuestionFilled />
|
||
</el-icon>
|
||
</template>
|
||
<template #default>
|
||
<div>
|
||
<p>Margin模型是机构保证稳定盈利的模型之一，根据模型的波动走向、同赔倾向等特点，再加上百万赛事信息的数据整理，及独有情报信息，绘制出赛事趋势走向，推演赛果走向</p>
|
||
</div>
|
||
</template>
|
||
</el-popover>
|
||
</template>
|
||
<template #default="scope">
|
||
<span :class="['flex-row cursor-pointer tc-view-time', scope.row.reportSatus != 1 && 'tc-view-time-disabled']" @click="handleView(scope.row)">
|
||
分析结果<br/>
|
||
{{ scope.row.reportSatus === 1? timerToStr(scope.row.reportTime, 'HH:mm') : '待' }}更新
|
||
</span>
|
||
<!-- <el-tooltip content="查看" placement="top" v-if="scope.row.roleId !== 1">
|
||
<el-button link type="primary" icon="view" @click="handleView(scope.row)"></el-button>
|
||
</el-tooltip> -->
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
|
||
<!-- 分页区域 -->
|
||
<pagination
|
||
:show="total > 0"
|
||
:total="total"
|
||
v-model:page="queryParams.pageNum"
|
||
v-model:limit="queryParams.pageSize"
|
||
@pagination="getList" />
|
||
</div>
|
||
<lz-page-empty v-else-if="!loading" :type="'2'">
|
||
<lz-svg-icon icon-class="empty2" style="font-size: 312px;"/>
|
||
</lz-page-empty>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { Info, infoSelectDistinctLeagueAbbNames } from "@/api/tc/eventAnalysisReport"
|
||
import { jumpLink } from "@/utils/tc"
|
||
import { timerToStr } from "@/utils/timer"
|
||
import { processMatchResults } from "@/utils/tc"
|
||
import { onActivated } from "vue"
|
||
import { PickerOptions } from "@/enums/tc"
|
||
|
||
const router = useRouter()
|
||
const { proxy } = getCurrentInstance()
|
||
const pageList = ref([])
|
||
const loading = ref(false)
|
||
const showSearch = ref(true)
|
||
const total = ref(0)
|
||
// const dateRange = ref([])
|
||
|
||
/** 数据范围选项*/
|
||
const dataScopeOptions = ref([])
|
||
|
||
const data = reactive({
|
||
form: {},
|
||
queryParams: {
|
||
pageNum: 1,
|
||
pageSize: 10,
|
||
matchNumStr: undefined,
|
||
leagueAbbName: undefined,
|
||
weekday: undefined,
|
||
},
|
||
rules: {},
|
||
})
|
||
|
||
|
||
|
||
const { queryParams } = toRefs(data)
|
||
|
||
// 处理星期选择变化
|
||
function handleWeekdayChange(value) {
|
||
// 当用户通过快捷选项选择星期时触发
|
||
handleQuery();
|
||
}
|
||
|
||
/** 查询角色列表 */
|
||
function getList() {
|
||
loading.value = true
|
||
const data = { ...queryParams.value }
|
||
// if (dateRange.value && dateRange.value[0] && dateRange.value[1]) {
|
||
// data.beginTime = dateRange.value[0]
|
||
// data.endTime = dateRange.value[1]
|
||
// } else {
|
||
// data.beginTime = undefined
|
||
// data.endTime = undefined
|
||
// }
|
||
Info(data).then(response => {
|
||
const res = response.rows.map(item => ({
|
||
...item,
|
||
matchResults: item.matchResults ? processMatchResults(item.matchResults): null
|
||
}));
|
||
pageList.value = res
|
||
total.value = response.total
|
||
}).finally(() => {
|
||
loading.value = false
|
||
})
|
||
}
|
||
|
||
|
||
/** 获取联赛类型 */
|
||
function getLeagueAbbNames() {
|
||
infoSelectDistinctLeagueAbbNames().then(response => {
|
||
dataScopeOptions.value = response.rows ? response.rows.map(item => ({ value: item, label: item })) : []
|
||
})
|
||
}
|
||
|
||
/** 跳转链接 */
|
||
function handleJumpLink(row) {
|
||
jumpLink(row.matchId, 1)
|
||
}
|
||
|
||
/** 查看详情 */
|
||
function handleView(row) {
|
||
if (row.reportSatus != 1) {
|
||
return
|
||
}
|
||
// window.open(window.location.origin + '/#/tc/eventAnalysisReport/detail?id=' + row.matchId)
|
||
router.push({
|
||
path: '/tc/eventAnalysisReport/detail',
|
||
query: {
|
||
id: row.matchId
|
||
}
|
||
})
|
||
}
|
||
|
||
|
||
/** 搜索按钮操作 */
|
||
function handleQuery() {
|
||
queryParams.value.pageNum = 1
|
||
getList()
|
||
}
|
||
|
||
/** 重置按钮操作 */
|
||
function resetQuery() {
|
||
// dateRange.value = []
|
||
proxy.resetForm("queryRef")
|
||
handleQuery()
|
||
}
|
||
|
||
onMounted(() => {
|
||
// 联赛类型
|
||
getLeagueAbbNames()
|
||
// 列表查询
|
||
getList()
|
||
})
|
||
|
||
onActivated(() => {
|
||
getList()
|
||
})
|
||
|
||
</script> |