|
|
|
@ -1,9 +1,14 @@
|
|
|
|
<template>
|
|
|
|
<template>
|
|
|
|
<div class="game-management">
|
|
|
|
<div class="today-notes">
|
|
|
|
<a-tabs v-model:activeKey="activeTab">
|
|
|
|
<a-tabs v-model:activeKey="activeTab" @change="handleTabChange">
|
|
|
|
<a-tab-pane v-for="type in gameTypes" :key="type.key" :tab="type.label">
|
|
|
|
<a-tab-pane v-for="type in noteTypes" :key="type.key" :tab="type.label">
|
|
|
|
<a-table :columns="columns" :data-source="filteredData" :rowKey="record => record.id">
|
|
|
|
<a-table :columns="columns" :data-source="filteredData" :rowKey="record => record.recordId">
|
|
|
|
<template #bodyCell="{ column, record }">
|
|
|
|
<template #bodyCell="{ column, record }">
|
|
|
|
|
|
|
|
<template v-if="column.key === 'scheduleJson'">
|
|
|
|
|
|
|
|
<span v-if="record.classify !== 8 && record.classify !== 9">
|
|
|
|
|
|
|
|
{{ formatScheduleJson(record.scheduleJson) }}
|
|
|
|
|
|
|
|
</span>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
<template v-if="column.key === 'action'">
|
|
|
|
<template v-if="column.key === 'action'">
|
|
|
|
<a-space>
|
|
|
|
<a-space>
|
|
|
|
<a-button type="link" @click="editItem(record)">编辑</a-button>
|
|
|
|
<a-button type="link" @click="editItem(record)">编辑</a-button>
|
|
|
|
@ -20,26 +25,47 @@
|
|
|
|
|
|
|
|
|
|
|
|
<a-modal
|
|
|
|
<a-modal
|
|
|
|
v-model:visible="modalVisible"
|
|
|
|
v-model:visible="modalVisible"
|
|
|
|
:title="(modalMode === 'add' ? '新增' : '编辑') + currentGameTypeLabel"
|
|
|
|
:title="(modalMode === 'add' ? '新增' : '编辑') + currentNoteTypeLabel"
|
|
|
|
@ok="handleModalOk"
|
|
|
|
@ok="handleModalOk"
|
|
|
|
@cancel="handleModalCancel"
|
|
|
|
@cancel="handleModalCancel"
|
|
|
|
width="600px"
|
|
|
|
width="800px"
|
|
|
|
>
|
|
|
|
>
|
|
|
|
<a-form :model="formState" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
|
|
|
|
<a-form :model="formState" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
|
|
|
|
<a-form-item label="日期" name="date" :rules="[{ required: true, message: '请选择日期' }]">
|
|
|
|
<a-form-item label="日期" name="todayStr" :rules="[{ required: true, message: '请选择日期' }]">
|
|
|
|
<a-date-picker v-model:value="formState.date" style="width: 100%" />
|
|
|
|
<a-date-picker v-model:value="formState.todayStr" style="width: 100%" format="YYYY-MM-DD" />
|
|
|
|
|
|
|
|
</a-form-item>
|
|
|
|
|
|
|
|
<a-form-item label="类型" name="classify" :rules="[{ required: true, message: '请选择类型' }]">
|
|
|
|
|
|
|
|
<a-select v-model:value="formState.classify">
|
|
|
|
|
|
|
|
<a-select-option v-for="type in noteTypes" :key="type.key" :value="type.key">
|
|
|
|
|
|
|
|
{{ type.label }}
|
|
|
|
|
|
|
|
</a-select-option>
|
|
|
|
|
|
|
|
</a-select>
|
|
|
|
</a-form-item>
|
|
|
|
</a-form-item>
|
|
|
|
<a-form-item label="比赛" name="match" :rules="[{ required: true, message: '请输入比赛' }]">
|
|
|
|
<template v-if="formState.classify !== 8 && formState.classify !== 9">
|
|
|
|
<a-input v-model:value="formState.match" />
|
|
|
|
<a-form-item label="比赛" name="match" :rules="[{ required: true, message: '请输入比赛' }]">
|
|
|
|
|
|
|
|
<a-input v-model:value="formState.match" />
|
|
|
|
|
|
|
|
</a-form-item>
|
|
|
|
|
|
|
|
<a-form-item label="球队1" name="team1" :rules="[{ required: true, message: '请输入球队1' }]">
|
|
|
|
|
|
|
|
<a-input v-model:value="formState.team1" />
|
|
|
|
|
|
|
|
</a-form-item>
|
|
|
|
|
|
|
|
<a-form-item label="球队2" name="team2" :rules="[{ required: true, message: '请输入球队2' }]">
|
|
|
|
|
|
|
|
<a-input v-model:value="formState.team2" />
|
|
|
|
|
|
|
|
</a-form-item>
|
|
|
|
|
|
|
|
<a-form-item label="结果" name="result" :rules="[{ required: true, message: '请输入结果' }]">
|
|
|
|
|
|
|
|
<a-input v-model:value="formState.result" />
|
|
|
|
|
|
|
|
</a-form-item>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<a-form-item label="赔率" name="odds">
|
|
|
|
|
|
|
|
<a-input v-model:value="formState.odds" />
|
|
|
|
</a-form-item>
|
|
|
|
</a-form-item>
|
|
|
|
<a-form-item label="玩法" name="playType" :rules="[{ required: true, message: '请输入玩法' }]">
|
|
|
|
<a-form-item label="结果" name="fruit">
|
|
|
|
<a-input v-model:value="formState.playType" />
|
|
|
|
<a-input v-model:value="formState.fruit" />
|
|
|
|
</a-form-item>
|
|
|
|
</a-form-item>
|
|
|
|
<a-form-item label="方向" name="direction" :rules="[{ required: true, message: '请输入方向' }]">
|
|
|
|
<a-form-item v-if="formState.classify === 9" label="开奖号" name="winNo">
|
|
|
|
<a-input v-model:value="formState.direction" />
|
|
|
|
<a-input v-model:value="formState.winNo" />
|
|
|
|
</a-form-item>
|
|
|
|
</a-form-item>
|
|
|
|
<a-form-item label="SP值" name="spValue" :rules="[{ required: true, message: '请输入SP值' }]">
|
|
|
|
<a-form-item v-if="formState.classify === 8 || formState.classify === 9" label="推荐号" name="recommendNo">
|
|
|
|
<a-input-number v-model:value="formState.spValue" :min="0" :step="0.01" style="width: 100%" />
|
|
|
|
<a-input v-model:value="formState.recommendNo" />
|
|
|
|
</a-form-item>
|
|
|
|
</a-form-item>
|
|
|
|
</a-form>
|
|
|
|
</a-form>
|
|
|
|
</a-modal>
|
|
|
|
</a-modal>
|
|
|
|
@ -50,85 +76,114 @@
|
|
|
|
import { ref, reactive, computed, onMounted } from 'vue';
|
|
|
|
import { ref, reactive, computed, onMounted } from 'vue';
|
|
|
|
import { message } from 'ant-design-vue';
|
|
|
|
import { message } from 'ant-design-vue';
|
|
|
|
import dayjs from 'dayjs';
|
|
|
|
import dayjs from 'dayjs';
|
|
|
|
|
|
|
|
import { getScheduleListApi, deleteScheduleApi, saveScheduleApi, updateScheduleApi } from '../../api/scheduleConfig';
|
|
|
|
const gameTypes = [
|
|
|
|
|
|
|
|
{ key: 'julong_zhongaobei', label: '聚龙中高倍' },
|
|
|
|
const noteTypes = [
|
|
|
|
{ key: 'julong_zongjinqiu', label: '聚龙总进球' },
|
|
|
|
{ key: 1, label: '总进球' },
|
|
|
|
{ key: 'julong_shibei', label: '聚龙十倍' },
|
|
|
|
{ key: 2, label: '2.0' },
|
|
|
|
{ key: 'julong_2', label: '聚龙2.0' },
|
|
|
|
{ key: 3, label: '3.0' },
|
|
|
|
{ key: 'julong_gaobei', label: '聚龙高倍' },
|
|
|
|
{ key: 4, label: '中高倍' },
|
|
|
|
{ key: 'julong_lanqiu', label: '聚龙篮球' },
|
|
|
|
{ key: 5, label: '高倍' },
|
|
|
|
{ key: 'julong_3', label: '聚龙3.0' },
|
|
|
|
{ key: 6, label: '十倍' },
|
|
|
|
{ key: 'julong_pailie3', label: '聚龙排列三' },
|
|
|
|
{ key: 7, label: '篮球' },
|
|
|
|
{ key: 'julong_kuaile8', label: '聚龙快乐八' },
|
|
|
|
{ key: 8, label: '排列三' },
|
|
|
|
|
|
|
|
{ key: 9, label: '快乐八' },
|
|
|
|
];
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
const activeTab = ref(gameTypes[0].key);
|
|
|
|
const activeTab = ref(noteTypes[0].key);
|
|
|
|
const modalVisible = ref(false);
|
|
|
|
const modalVisible = ref(false);
|
|
|
|
const modalMode = ref('add');
|
|
|
|
const modalMode = ref('add');
|
|
|
|
|
|
|
|
|
|
|
|
const columns = [
|
|
|
|
const columns = [
|
|
|
|
{ title: '日期', dataIndex: 'date', key: 'date' },
|
|
|
|
{ title: '日期', dataIndex: 'todayStr', key: 'todayStr' },
|
|
|
|
{ title: '比赛', dataIndex: 'match', key: 'match' },
|
|
|
|
{ title: '比赛内容', key: 'scheduleJson' },
|
|
|
|
{ title: '玩法', dataIndex: 'playType', key: 'playType' },
|
|
|
|
{ title: '赔率', dataIndex: 'odds', key: 'odds' },
|
|
|
|
{ title: '方向', dataIndex: 'direction', key: 'direction' },
|
|
|
|
{ title: '结果', dataIndex: 'fruit', key: 'fruit' },
|
|
|
|
{ title: 'SP值', dataIndex: 'spValue', key: 'spValue' },
|
|
|
|
{ title: '开奖号', dataIndex: 'winNo', key: 'winNo' },
|
|
|
|
|
|
|
|
{ title: '推荐号', dataIndex: 'recommendNo', key: 'recommendNo' },
|
|
|
|
{ title: '操作', key: 'action' },
|
|
|
|
{ title: '操作', key: 'action' },
|
|
|
|
];
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
const data = reactive({});
|
|
|
|
const data = reactive([]);
|
|
|
|
gameTypes.forEach(type => {
|
|
|
|
|
|
|
|
data[type.key] = [];
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const formState = reactive({
|
|
|
|
const formState = reactive({
|
|
|
|
id: null,
|
|
|
|
recordId: null,
|
|
|
|
date: dayjs(),
|
|
|
|
todayStr: '',
|
|
|
|
|
|
|
|
classify: 1,
|
|
|
|
match: '',
|
|
|
|
match: '',
|
|
|
|
playType: '',
|
|
|
|
team1: '',
|
|
|
|
direction: '',
|
|
|
|
team2: '',
|
|
|
|
spValue: 0,
|
|
|
|
result: '',
|
|
|
|
|
|
|
|
odds: '',
|
|
|
|
|
|
|
|
fruit: '',
|
|
|
|
|
|
|
|
winNo: '',
|
|
|
|
|
|
|
|
recommendNo: '',
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
const filteredData = computed(() => {
|
|
|
|
const filteredData = computed(() => {
|
|
|
|
return data[activeTab.value] || [];
|
|
|
|
return data.filter(item => item.classify === activeTab.value);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
const currentGameTypeLabel = computed(() => {
|
|
|
|
const currentNoteType = computed(() => {
|
|
|
|
return gameTypes.find(type => type.key === activeTab.value)?.label || '';
|
|
|
|
return noteTypes.find(type => type.key === activeTab.value) || noteTypes[0];
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const currentNoteTypeLabel = computed(() => {
|
|
|
|
|
|
|
|
return currentNoteType.value.label;
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const formatScheduleJson = (scheduleJson) => {
|
|
|
|
|
|
|
|
try {
|
|
|
|
|
|
|
|
const parsed = JSON.parse(scheduleJson);
|
|
|
|
|
|
|
|
return `${parsed.match} ${parsed.team1} vs ${parsed.team2} ${parsed.result}`;
|
|
|
|
|
|
|
|
} catch (error) {
|
|
|
|
|
|
|
|
return scheduleJson;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
const showAddModal = () => {
|
|
|
|
const showAddModal = () => {
|
|
|
|
modalMode.value = 'add';
|
|
|
|
modalMode.value = 'add';
|
|
|
|
Object.assign(formState, {
|
|
|
|
Object.assign(formState, {
|
|
|
|
id: null,
|
|
|
|
recordId: null,
|
|
|
|
date: dayjs(),
|
|
|
|
todayStr: dayjs(),
|
|
|
|
match: '',
|
|
|
|
classify: activeTab.value,
|
|
|
|
playType: '',
|
|
|
|
match: '',
|
|
|
|
direction: '',
|
|
|
|
team1: '',
|
|
|
|
spValue: 0
|
|
|
|
team2: '',
|
|
|
|
|
|
|
|
result: '',
|
|
|
|
|
|
|
|
odds: '',
|
|
|
|
|
|
|
|
fruit: '',
|
|
|
|
|
|
|
|
winNo: '',
|
|
|
|
|
|
|
|
recommendNo: '',
|
|
|
|
});
|
|
|
|
});
|
|
|
|
modalVisible.value = true;
|
|
|
|
modalVisible.value = true;
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
const editItem = (record) => {
|
|
|
|
const editItem = (record) => {
|
|
|
|
modalMode.value = 'edit';
|
|
|
|
modalMode.value = 'edit';
|
|
|
|
Object.assign(formState, {
|
|
|
|
Object.assign(formState, {
|
|
|
|
...record,
|
|
|
|
...record,
|
|
|
|
date: dayjs(record.date),
|
|
|
|
todayStr: dayjs(record.todayStr),
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
if (record.scheduleJson) {
|
|
|
|
|
|
|
|
try {
|
|
|
|
|
|
|
|
const parsed = JSON.parse(record.scheduleJson);
|
|
|
|
|
|
|
|
formState.match = parsed.match;
|
|
|
|
|
|
|
|
formState.team1 = parsed.team1;
|
|
|
|
|
|
|
|
formState.team2 = parsed.team2;
|
|
|
|
|
|
|
|
formState.result = parsed.result;
|
|
|
|
|
|
|
|
} catch (error) {
|
|
|
|
|
|
|
|
console.error('Error parsing scheduleJson:', error);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
modalVisible.value = true;
|
|
|
|
modalVisible.value = true;
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
const deleteItem = async (record) => {
|
|
|
|
const deleteItem = async (record) => {
|
|
|
|
try {
|
|
|
|
try {
|
|
|
|
// Implement API call to delete item
|
|
|
|
await deleteScheduleApi(record.recordId);
|
|
|
|
// await deleteGameApi(record.id);
|
|
|
|
|
|
|
|
const index = data[activeTab.value].findIndex(item => item.id === record.id);
|
|
|
|
|
|
|
|
if (index !== -1) {
|
|
|
|
|
|
|
|
data[activeTab.value].splice(index, 1);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
message.success('删除成功');
|
|
|
|
message.success('删除成功');
|
|
|
|
|
|
|
|
fetchData();
|
|
|
|
} catch (error) {
|
|
|
|
} catch (error) {
|
|
|
|
message.error('删除失败');
|
|
|
|
message.error('删除失败');
|
|
|
|
}
|
|
|
|
}
|
|
|
|
@ -136,26 +191,34 @@ const deleteItem = async (record) => {
|
|
|
|
|
|
|
|
|
|
|
|
const handleModalOk = async () => {
|
|
|
|
const handleModalOk = async () => {
|
|
|
|
try {
|
|
|
|
try {
|
|
|
|
const newData = {
|
|
|
|
let payload = {
|
|
|
|
...formState,
|
|
|
|
...formState,
|
|
|
|
date: formState.date.format('YYYY-MM-DD'),
|
|
|
|
todayStr: formState.todayStr.format('YYYY-MM-DD'),
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (payload.classify !== 8 && payload.classify !== 9) {
|
|
|
|
|
|
|
|
payload.scheduleJson = JSON.stringify({
|
|
|
|
|
|
|
|
match: payload.match,
|
|
|
|
|
|
|
|
team1: payload.team1,
|
|
|
|
|
|
|
|
team2: payload.team2,
|
|
|
|
|
|
|
|
result: payload.result,
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
delete payload.match;
|
|
|
|
|
|
|
|
delete payload.team1;
|
|
|
|
|
|
|
|
delete payload.team2;
|
|
|
|
|
|
|
|
delete payload.result;
|
|
|
|
|
|
|
|
|
|
|
|
if (modalMode.value === 'add') {
|
|
|
|
if (modalMode.value === 'add') {
|
|
|
|
// Implement API call to add item
|
|
|
|
await saveScheduleApi(payload);
|
|
|
|
// const response = await addGameApi(newData);
|
|
|
|
|
|
|
|
// newData.id = response.data.id;
|
|
|
|
|
|
|
|
newData.id = Date.now(); // Temporary ID for demonstration
|
|
|
|
|
|
|
|
data[activeTab.value].push(newData);
|
|
|
|
|
|
|
|
} else {
|
|
|
|
} else {
|
|
|
|
// Implement API call to update item
|
|
|
|
await updateScheduleApi(payload);
|
|
|
|
// await updateGameApi(newData);
|
|
|
|
|
|
|
|
const index = data[activeTab.value].findIndex(item => item.id === newData.id);
|
|
|
|
|
|
|
|
if (index !== -1) {
|
|
|
|
|
|
|
|
data[activeTab.value][index] = newData;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
message.success(modalMode.value === 'add' ? '添加成功' : '编辑成功');
|
|
|
|
message.success(modalMode.value === 'add' ? '添加成功' : '编辑成功');
|
|
|
|
modalVisible.value = false;
|
|
|
|
modalVisible.value = false;
|
|
|
|
|
|
|
|
fetchData();
|
|
|
|
} catch (error) {
|
|
|
|
} catch (error) {
|
|
|
|
message.error(modalMode.value === 'add' ? '添加失败' : '编辑失败');
|
|
|
|
message.error(modalMode.value === 'add' ? '添加失败' : '编辑失败');
|
|
|
|
}
|
|
|
|
}
|
|
|
|
@ -167,40 +230,25 @@ const handleModalCancel = () => {
|
|
|
|
|
|
|
|
|
|
|
|
const fetchData = async () => {
|
|
|
|
const fetchData = async () => {
|
|
|
|
try {
|
|
|
|
try {
|
|
|
|
// Implement API call to fetch data for each game type
|
|
|
|
const response = await getScheduleListApi(1, 100, activeTab.value);
|
|
|
|
// For now, we'll use mock data
|
|
|
|
data.splice(0, data.length, ...response.data.records);
|
|
|
|
gameTypes.forEach(type => {
|
|
|
|
|
|
|
|
data[type.key] = [
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
id: 1,
|
|
|
|
|
|
|
|
date: '2023-05-20',
|
|
|
|
|
|
|
|
match: '曼城 vs 切尔西',
|
|
|
|
|
|
|
|
playType: '让球',
|
|
|
|
|
|
|
|
direction: '主队',
|
|
|
|
|
|
|
|
spValue: 1.75,
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
id: 2,
|
|
|
|
|
|
|
|
date: '2023-05-21',
|
|
|
|
|
|
|
|
match: '利物浦 vs 阿森纳',
|
|
|
|
|
|
|
|
playType: '大小球',
|
|
|
|
|
|
|
|
direction: '大球',
|
|
|
|
|
|
|
|
spValue: 2.05,
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
];
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
} catch (error) {
|
|
|
|
} catch (error) {
|
|
|
|
message.error('获取数据失败');
|
|
|
|
message.error('获取数据失败');
|
|
|
|
}
|
|
|
|
}
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const handleTabChange = (newActiveKey) => {
|
|
|
|
|
|
|
|
activeTab.value = newActiveKey;
|
|
|
|
|
|
|
|
fetchData();
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
onMounted(() => {
|
|
|
|
onMounted(() => {
|
|
|
|
fetchData();
|
|
|
|
fetchData();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
</script>
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
<style scoped>
|
|
|
|
<style scoped>
|
|
|
|
.game-management {
|
|
|
|
.today-notes {
|
|
|
|
padding: 24px;
|
|
|
|
padding: 24px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</style>
|
|
|
|
</style>
|
|
|
|
|