fix bugs
This commit is contained in:
408
pages/score-list-multi/score-list-multi.vue
Normal file
408
pages/score-list-multi/score-list-multi.vue
Normal file
@@ -0,0 +1,408 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<!-- 自定义导航栏 -->
|
||||
<view class="nav-bar">
|
||||
<view class="nav-title">评分系统</view>
|
||||
<view class="nav-right">
|
||||
<view class="icon-menu">···</view>
|
||||
<view class="icon-close">⊗</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 比赛信息 -->
|
||||
<view class="match-info">
|
||||
<view class="match-title">
|
||||
2025年全国武术散打锦标赛暨第十七届世界武术锦标赛选拔赛
|
||||
</view>
|
||||
<view class="match-time">比赛时间：2025年6月25日 9:00</view>
|
||||
</view>
|
||||
|
||||
<!-- 场地和项目选择 -->
|
||||
<view class="venue-section">
|
||||
<!-- 场地切换 - 横向滚动 -->
|
||||
<scroll-view class="venue-scroll" scroll-x="true" show-scrollbar="false">
|
||||
<view class="venue-tabs">
|
||||
<view
|
||||
v-for="venue in venues"
|
||||
:key="venue.id"
|
||||
:class="['venue-tab', currentVenue === venue.id ? 'active' : '']"
|
||||
@click="switchVenue(venue.id)"
|
||||
>
|
||||
{{ venue.name }}
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<view class="venue-tip">
|
||||
<!-- <text class="tip-bold">裁判长可看见所有场地和项目</text> -->
|
||||
<!-- <text class="tip-normal">（场地和项目可动态全部），可以点击切换</text> -->
|
||||
</view>
|
||||
|
||||
<!-- 项目选择 - 横向滚动 -->
|
||||
<scroll-view class="project-scroll" scroll-x="true" show-scrollbar="false">
|
||||
<view class="project-list">
|
||||
<view
|
||||
v-for="(project, index) in projects"
|
||||
:key="index"
|
||||
:class="['project-btn', currentProject === index ? 'active' : '']"
|
||||
@click="switchProject(index)"
|
||||
>
|
||||
{{ project }}
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
<!-- 已评分统计 -->
|
||||
<view class="score-stats">
|
||||
<text class="stats-text">已评分：</text>
|
||||
<text class="stats-number">2/30</text>
|
||||
</view>
|
||||
|
||||
<!-- 选手列表 -->
|
||||
<view class="player-list">
|
||||
<!-- 第一个选手 - 裁判长功能 -->
|
||||
<view class="player-card">
|
||||
<view class="player-header">
|
||||
<view class="player-name">张三</view>
|
||||
<view class="action-area">
|
||||
<text class="total-score">总分：8.907</text>
|
||||
<view class="chief-actions">
|
||||
<!-- <text class="chief-hint">裁判长功能：修改评分、修改按钮需等总分出来才出现</text> -->
|
||||
<button class="modify-btn" @click="goToModify">修改</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="player-info">
|
||||
<view class="info-item">身份证：123456789000000000</view>
|
||||
<view class="info-item">队伍：少林寺武术大学院</view>
|
||||
<view class="info-item">编号：123-4567898275</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 第二个选手 - 简单样式 -->
|
||||
<view class="player-card">
|
||||
<view class="player-header">
|
||||
<view class="player-name">张三</view>
|
||||
</view>
|
||||
<view class="player-info">
|
||||
<view class="info-item">身份证：123456789000000000</view>
|
||||
<view class="info-item">队伍：少林寺武术大学院</view>
|
||||
<view class="info-item">编号：123-4567898275</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 第三个选手 - 简单样式 -->
|
||||
<view class="player-card">
|
||||
<view class="player-header">
|
||||
<view class="player-name">张三</view>
|
||||
</view>
|
||||
<view class="player-info">
|
||||
<view class="info-item">身份证：123456789000000000</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
currentVenue: 1,
|
||||
currentProject: 0,
|
||||
venues: [
|
||||
{ id: 1, name: '第一场地' },
|
||||
{ id: 2, name: '第二场地' },
|
||||
{ id: 3, name: '第三场地' },
|
||||
{ id: 4, name: '第四场地' },
|
||||
{ id: 5, name: '第五场地' }
|
||||
],
|
||||
projects: [
|
||||
'女子组长拳',
|
||||
'男子组陈氏太极拳',
|
||||
'女子组双剑（含长穗双剑）',
|
||||
'男子组杨氏太极拳',
|
||||
'女子组刀术',
|
||||
'男子组棍术',
|
||||
'女子组枪术',
|
||||
'男子组剑术'
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
switchVenue(venue) {
|
||||
this.currentVenue = venue
|
||||
},
|
||||
switchProject(index) {
|
||||
this.currentProject = index
|
||||
},
|
||||
goToModify() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/modify-score/modify-score'
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.container {
|
||||
min-height: 100vh;
|
||||
background-color: #F5F5F5;
|
||||
padding-bottom: 40rpx;
|
||||
}
|
||||
|
||||
/* 导航栏 */
|
||||
.nav-bar {
|
||||
height: 90rpx;
|
||||
background: linear-gradient(135deg, #1B7C5E 0%, #2A9D7E 100%);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
|
||||
.nav-title {
|
||||
font-size: 36rpx;
|
||||
font-weight: 600;
|
||||
color: #FFFFFF;
|
||||
letter-spacing: 2rpx;
|
||||
}
|
||||
|
||||
.nav-right {
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 30rpx;
|
||||
}
|
||||
|
||||
.icon-menu,
|
||||
.icon-close {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
background-color: rgba(255, 255, 255, 0.25);
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 32rpx;
|
||||
color: #FFFFFF;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* 比赛信息 */
|
||||
.match-info {
|
||||
padding: 30rpx;
|
||||
background-color: #F5F5F5;
|
||||
}
|
||||
|
||||
.match-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #333333;
|
||||
line-height: 1.6;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.tip-text {
|
||||
font-size: 24rpx;
|
||||
color: #FF4D6A;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.match-time {
|
||||
font-size: 28rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
/* 场地和项目区域 */
|
||||
.venue-section {
|
||||
background-color: #FFFFFF;
|
||||
margin: 20rpx 30rpx;
|
||||
border-radius: 16rpx;
|
||||
padding: 30rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
|
||||
}
|
||||
|
||||
/* 场地滚动容器 */
|
||||
.venue-scroll {
|
||||
width: 100%;
|
||||
white-space: nowrap;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.venue-tabs {
|
||||
display: inline-flex;
|
||||
gap: 30rpx;
|
||||
padding-bottom: 20rpx;
|
||||
border-bottom: 4rpx solid #E0E0E0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.venue-tab {
|
||||
font-size: 32rpx;
|
||||
font-weight: 500;
|
||||
color: #666666;
|
||||
padding: 0 20rpx;
|
||||
position: relative;
|
||||
white-space: nowrap;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.venue-tab.active {
|
||||
font-weight: 600;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.venue-tab.active::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: -24rpx;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 4rpx;
|
||||
background-color: #1B7C5E;
|
||||
}
|
||||
|
||||
.venue-tip {
|
||||
font-size: 24rpx;
|
||||
line-height: 1.6;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.tip-bold {
|
||||
color: #FF4D6A;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.tip-normal {
|
||||
color: #FF4D6A;
|
||||
}
|
||||
|
||||
/* 项目滚动容器 */
|
||||
.project-scroll {
|
||||
width: 100%;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.project-list {
|
||||
display: inline-flex;
|
||||
gap: 20rpx;
|
||||
}
|
||||
|
||||
.project-btn {
|
||||
padding: 20rpx 30rpx;
|
||||
background-color: #FFFFFF;
|
||||
border: 2rpx solid #CCCCCC;
|
||||
border-radius: 8rpx;
|
||||
font-size: 26rpx;
|
||||
color: #666666;
|
||||
white-space: nowrap;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.project-btn.active {
|
||||
background-color: #1B7C5E;
|
||||
color: #FFFFFF;
|
||||
border-color: #1B7C5E;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* 评分统计 */
|
||||
.score-stats {
|
||||
padding: 20rpx 30rpx;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.stats-text {
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.stats-number {
|
||||
color: #1B7C5E;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* 选手列表 */
|
||||
.player-list {
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
|
||||
.player-card {
|
||||
background-color: #FFFFFF;
|
||||
border-radius: 16rpx;
|
||||
padding: 30rpx;
|
||||
margin-bottom: 20rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
|
||||
}
|
||||
|
||||
.player-header {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.player-name {
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.action-area {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
gap: 10rpx;
|
||||
}
|
||||
|
||||
.total-score {
|
||||
font-size: 26rpx;
|
||||
color: #333333;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.chief-actions {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
gap: 10rpx;
|
||||
}
|
||||
|
||||
.chief-hint {
|
||||
font-size: 22rpx;
|
||||
color: #FF4D6A;
|
||||
text-align: right;
|
||||
line-height: 1.5;
|
||||
max-width: 400rpx;
|
||||
}
|
||||
|
||||
.modify-btn {
|
||||
padding: 12rpx 40rpx;
|
||||
background: linear-gradient(135deg, #1B7C5E 0%, #2A9D7E 100%);
|
||||
border-radius: 8rpx;
|
||||
font-size: 28rpx;
|
||||
color: #FFFFFF;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.modify-btn:active {
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.player-info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12rpx;
|
||||
}
|
||||
|
||||
.info-item {
|
||||
font-size: 26rpx;
|
||||
color: #666666;
|
||||
line-height: 1.5;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user