场地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:
@@ -223,6 +223,24 @@
|
|||||||
|
|
||||||
<!-- 场地 Tab -->
|
<!-- 场地 Tab -->
|
||||||
<div v-show="activeTab === 'venue'" class="tab-content">
|
<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">
|
<div class="time-selector">
|
||||||
<el-button
|
<el-button
|
||||||
v-for="(time, index) in timeSlots"
|
v-for="(time, index) in timeSlots"
|
||||||
@@ -376,7 +394,8 @@ export default {
|
|||||||
orderId: null,
|
orderId: null,
|
||||||
activeTab: 'competition',
|
activeTab: 'competition',
|
||||||
selectedTime: 0,
|
selectedTime: 0,
|
||||||
selectedVenueId: null, // 选中的场地ID
|
selectedVenueId: null, // 选中的场地ID(竞赛分组Tab)
|
||||||
|
selectedVenueIdForVenueTab: null, // 选中的场地ID(场地Tab)
|
||||||
confirmDialogVisible: false,
|
confirmDialogVisible: false,
|
||||||
isScheduleCompleted: false, // 是否已完成编排
|
isScheduleCompleted: false, // 是否已完成编排
|
||||||
loading: false,
|
loading: false,
|
||||||
@@ -428,17 +447,25 @@ export default {
|
|||||||
return filtered
|
return filtered
|
||||||
},
|
},
|
||||||
|
|
||||||
// 场地标签页的数据 - 根据选中的时间段动态生成
|
// 场地标签页的数据 - 根据选中的场地和时间段动态生成
|
||||||
venueData() {
|
venueData() {
|
||||||
if (this.selectedTime === null) {
|
if (this.selectedTime === null) {
|
||||||
return []
|
return []
|
||||||
}
|
}
|
||||||
|
|
||||||
// 获取选中时间段的所有分组
|
// 获取选中时间段的所有分组
|
||||||
const groupsInTimeSlot = this.competitionGroups.filter(
|
let groupsInTimeSlot = this.competitionGroups.filter(
|
||||||
group => group.timeSlotIndex === this.selectedTime
|
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 => ({
|
return groupsInTimeSlot.map(group => ({
|
||||||
project: group.title,
|
project: group.title,
|
||||||
@@ -805,6 +832,7 @@ export default {
|
|||||||
// 默认选中第一个场地
|
// 默认选中第一个场地
|
||||||
if (this.venues.length > 0) {
|
if (this.venues.length > 0) {
|
||||||
this.selectedVenueId = this.venues[0].id
|
this.selectedVenueId = this.venues[0].id
|
||||||
|
this.selectedVenueIdForVenueTab = this.venues[0].id
|
||||||
}
|
}
|
||||||
console.log('加载的场地数据:', this.venues)
|
console.log('加载的场地数据:', this.venues)
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user