场地Tab添加场地过滤功能

- 添加场地按钮列表,支持切换不同场地
- 新增 selectedVenueIdForVenueTab 状态变量
- 修改 venueData 计算属性支持按场地过滤
- 初始化时默认选中第一个场地

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
DevOps
2025-12-24 13:34:35 +08:00
parent e035647b51
commit ea4650b912

View File

@@ -223,6 +223,24 @@
<!-- 场地 Tab -->
<div v-show="activeTab === 'venue'" class="tab-content">
<!-- 场地列表 -->
<div class="venue-list">
<div class="venue-buttons">
<el-button
v-for="venue in venues"
:key="'venue-tab-' + venue.id"
size="small"
:type="selectedVenueIdForVenueTab === venue.id ? 'primary' : ''"
@click="selectedVenueIdForVenueTab = venue.id"
>
{{ venue.venueName }}
</el-button>
<div v-if="venues.length === 0" class="no-venue-hint">
暂无场地信息请先在赛事管理中配置场地
</div>
</div>
</div>
<div class="time-selector">
<el-button
v-for="(time, index) in timeSlots"
@@ -376,7 +394,8 @@ export default {
orderId: null,
activeTab: 'competition',
selectedTime: 0,
selectedVenueId: null, // 选中的场地ID
selectedVenueId: null, // 选中的场地ID竞赛分组Tab
selectedVenueIdForVenueTab: null, // 选中的场地ID场地Tab
confirmDialogVisible: false,
isScheduleCompleted: false, // 是否已完成编排
loading: false,
@@ -428,17 +447,25 @@ export default {
return filtered
},
// 场地标签页的数据 - 根据选中的时间段动态生成
// 场地标签页的数据 - 根据选中的场地和时间段动态生成
venueData() {
if (this.selectedTime === null) {
return []
}
// 获取选中时间段的所有分组
const groupsInTimeSlot = this.competitionGroups.filter(
let groupsInTimeSlot = this.competitionGroups.filter(
group => group.timeSlotIndex === this.selectedTime
)
// 如果选中了场地,进一步过滤
if (this.selectedVenueIdForVenueTab) {
groupsInTimeSlot = groupsInTimeSlot.filter(group => {
return group.venueId === this.selectedVenueIdForVenueTab ||
Number(group.venueId) === Number(this.selectedVenueIdForVenueTab)
})
}
// 将分组转换为场地视图的数据格式
return groupsInTimeSlot.map(group => ({
project: group.title,
@@ -805,6 +832,7 @@ export default {
// 默认选中第一个场地
if (this.venues.length > 0) {
this.selectedVenueId = this.venues[0].id
this.selectedVenueIdForVenueTab = this.venues[0].id
}
console.log('加载的场地数据:', this.venues)
}