martial/martial-mini
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(common-info): 添加集体标签页

Browse Source 
- 在常用信息页面添加集体Tab
- 创建新增集体页面(add-team)
- 支持集体成员管理
- 修复Issue #6: 常用信息标签页里没有集体
This commit is contained in:
DevOps
2025-12-30 17:20:29 +08:00
parent d22944e575
commit c6c9f9a5d1
3 changed files with 499 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/pages.json
View File

@@ -54,6 +54,14 @@
"navigationBarTextStyle": "white"
}
},
{
"path": "pages/add-team/add-team",
"style": {
"navigationBarTitleText": "新增集体",
"navigationBarBackgroundColor": "#C93639",
"navigationBarTextStyle": "white"
}
},
{
"path": "pages/edit-player/edit-player",
"style": {

374
src/pages/add-team/add-team.vue Normal file
View File

@@ -0,0 +1,374 @@
<template>
<view class="add-team-page">
<view class="form-section">
<view class="form-item">
<view class="form-label required">集体名称</view>
<input
class="form-input"
type="text"
v-model="formData.name"
placeholder="请输入集体名称"
/>
</view>
<view class="form-item">
<view class="form-label">备注</view>
<textarea
class="form-textarea"
v-model="formData.remark"
placeholder="请输入备注信息"
></textarea>
</view>
</view>
<!-- 成员列表 -->
<view class="member-section">
<view class="section-header">
<text class="section-title">成员列表</text>
<view class="add-member-btn" @click="showMemberPicker = true">
<text>+ 添加成员</text>
</view>
</view>
<view class="member-list" v-if="formData.members.length > 0">
<view class="member-item" v-for="(member, index) in formData.members" :key="index">
<view class="member-info">
<text class="member-name">{{ member.name }}</text>
</view>
<view class="remove-btn" @click="removeMember(index)">移除</view>
</view>
</view>
<view class="empty-members" v-else>
<text>暂无成员，请添加</text>
</view>
</view>
<!-- 提交按钮 -->
<view class="submit-btn-wrapper">
<view class="submit-btn" @click="handleSubmit">保存</view>
</view>
<!-- 成员选择弹窗 -->
<view class="member-picker-mask" v-if="showMemberPicker" @click="showMemberPicker = false">
<view class="member-picker" @click.stop>
<view class="picker-header">
<text class="picker-title">选择成员</text>
<text class="picker-close" @click="showMemberPicker = false">×</text>
</view>
<view class="picker-list">
<view
class="picker-item"
v-for="(player, index) in availablePlayers"
:key="index"
@click="addMember(player)"
>
<text>{{ player.name }}</text>
<text class="add-icon">+</text>
</view>
<view class="empty-picker" v-if="availablePlayers.length === 0">
<text>暂无可选成员</text>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import athleteAPI from '@/api/athlete.js';
import { getUserInfo } from '@/utils/auth.js';
export default {
data() {
return {
formData: {
name: '',
remark: '',
members: []
},
playerList: [],
showMemberPicker: false
};
},
computed: {
availablePlayers() {
const memberIds = this.formData.members.map(m => m.id)
return this.playerList.filter(p => !memberIds.includes(p.id))
}
},
onLoad() {
this.loadPlayerList()
},
methods: {
async loadPlayerList() {
try {
const userInfo = getUserInfo()
if (!userInfo || !userInfo.userId) return
const res = await athleteAPI.getAthleteList({
current: 1,
size: 100,
createUser: userInfo.userId
})
let list = []
if (res.records) {
list = res.records
} else if (Array.isArray(res)) {
list = res
}
this.playerList = list.map(item => ({
id: item.id,
name: item.name || item.playerName
}))
} catch (err) {
console.error('加载选手列表失败:', err)
}
},
addMember(player) {
this.formData.members.push({
id: player.id,
name: player.name
})
this.showMemberPicker = false
},
removeMember(index) {
this.formData.members.splice(index, 1)
},
async handleSubmit() {
if (!this.formData.name) {
uni.showToast({
title: '请输入集体名称',
icon: 'none'
})
return
}
if (this.formData.members.length === 0) {
uni.showToast({
title: '请添加至少一名成员',
icon: 'none'
})
return
}
try {
const userInfo = getUserInfo()
const data = {
teamName: this.formData.name,
remark: this.formData.remark,
memberIds: this.formData.members.map(m => m.id),
createUser: userInfo?.userId
}
if (athleteAPI.saveTeam) {
await athleteAPI.saveTeam(data)
}
uni.showToast({
title: '保存成功',
icon: 'success'
})
setTimeout(() => {
uni.navigateBack()
}, 1500)
} catch (err) {
console.error('保存失败:', err)
uni.showToast({
title: '保存失败',
icon: 'none'
})
}
}
}
};
</script>
<style lang="scss" scoped>
.add-team-page {
min-height: 100vh;
background-color: #f5f5f5;
padding-bottom: 150rpx;
}
.form-section {
background-color: #fff;
padding: 30rpx;
margin-bottom: 20rpx;
}
.form-item {
margin-bottom: 30rpx;
}
.form-label {
font-size: 28rpx;
color: #333;
margin-bottom: 15rpx;
}
.form-label.required::before {
content: '*';
color: #C93639;
margin-right: 5rpx;
}
.form-input {
width: 100%;
height: 80rpx;
background-color: #f5f5f5;
border-radius: 8rpx;
padding: 0 20rpx;
font-size: 28rpx;
}
.form-textarea {
width: 100%;
height: 200rpx;
background-color: #f5f5f5;
border-radius: 8rpx;
padding: 20rpx;
font-size: 28rpx;
}
.member-section {
background-color: #fff;
padding: 30rpx;
}
.section-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20rpx;
}
.section-title {
font-size: 30rpx;
font-weight: bold;
color: #333;
}
.add-member-btn {
color: #C93639;
font-size: 28rpx;
}
.member-list {
margin-top: 20rpx;
}
.member-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 20rpx;
background-color: #f5f5f5;
border-radius: 8rpx;
margin-bottom: 15rpx;
}
.member-name {
font-size: 28rpx;
color: #333;
}
.remove-btn {
color: #C93639;
font-size: 26rpx;
}
.empty-members {
text-align: center;
padding: 50rpx;
color: #999;
font-size: 28rpx;
}
.submit-btn-wrapper {
position: fixed;
bottom: 0;
left: 0;
right: 0;
padding: 30rpx;
background-color: #fff;
}
.submit-btn {
background-color: #C93639;
color: #fff;
text-align: center;
padding: 30rpx;
border-radius: 12rpx;
font-size: 32rpx;
font-weight: bold;
}
.member-picker-mask {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.5);
z-index: 1000;
display: flex;
align-items: flex-end;
}
.member-picker {
width: 100%;
background-color: #fff;
border-radius: 20rpx 20rpx 0 0;
max-height: 70vh;
}
.picker-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 30rpx;
border-bottom: 1rpx solid #eee;
}
.picker-title {
font-size: 32rpx;
font-weight: bold;
}
.picker-close {
font-size: 40rpx;
color: #999;
}
.picker-list {
max-height: 60vh;
overflow-y: auto;
}
.picker-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 30rpx;
border-bottom: 1rpx solid #f5f5f5;
}
.add-icon {
color: #C93639;
font-size: 36rpx;
}
.empty-picker {
text-align: center;
padding: 50rpx;
color: #999;
}
</style>

138
src/pages/common-info/common-info.vue
View File

@@ -6,10 +6,10 @@
<!-- 新增按钮 -->
<view class="add-btn-wrapper" @click="handleAdd">
<text class="add-icon">⊕</text>
<text class="add-text">{{ currentTab === 0 ? '新增选手' : '新增联系人' }}</text>
<text class="add-text">{{ addButtonText }}</text>
</view>
<!-- 选手列表 -->
<!-- 选手列表 (Tab 0) -->
<view class="player-list" v-if="currentTab === 0 && playerList.length > 0">
<view class="player-item" v-for="(item, index) in playerList" :key="index">
<view class="player-info">
@@ -21,7 +21,7 @@
<image class="action-icon" src="/static/images/编辑@3x.png" mode="aspectFit"></image>
<text>编辑</text>
</view>
<view class="action-btn delete-btn" @click.stop="handleDelete(item)">
<view class="action-btn delete-btn" @click.stop="handleDelete(item, 'player')">
<image class="action-icon" src="/static/images/删除@3x.png" mode="aspectFit"></image>
<text>删除</text>
</view>
@@ -29,21 +29,46 @@
</view>
</view>
<!-- 空状态 -->
<!-- 选手空状态 -->
<view class="empty-state" v-if="currentTab === 0 && playerList.length === 0">
<text class="empty-text">暂无选手信息</text>
</view>
<!-- 联系人Tab内容 -->
<view class="empty-state" v-if="currentTab === 1">
<!-- 集体列表 (Tab 1) -->
<view class="player-list" v-if="currentTab === 1 && teamList.length > 0">
<view class="player-item" v-for="(item, index) in teamList" :key="index">
<view class="player-info">
<view class="player-name">{{ item.name }}</view>
<view class="player-id">成员数：{{ item.memberCount || 0 }}人</view>
</view>
<view class="player-actions">
<view class="action-btn edit-btn" @click.stop="handleEditTeam(item)">
<image class="action-icon" src="/static/images/编辑@3x.png" mode="aspectFit"></image>
<text>编辑</text>
</view>
<view class="action-btn delete-btn" @click.stop="handleDelete(item, 'team')">
<image class="action-icon" src="/static/images/删除@3x.png" mode="aspectFit"></image>
<text>删除</text>
</view>
</view>
</view>
</view>
<!-- 集体空状态 -->
<view class="empty-state" v-if="currentTab === 1 && teamList.length === 0">
<text class="empty-text">暂无集体信息</text>
</view>
<!-- 联系人Tab内容 (Tab 2) -->
<view class="empty-state" v-if="currentTab === 2">
<text class="empty-text">暂无联系人信息</text>
</view>
<!-- 删除确认弹窗 -->
<confirm-modal
:show="showDeleteModal"
title="删除选手"
content="确定要删除该选手吗？"
:title="deleteModalTitle"
:content="deleteModalContent"
@cancel="showDeleteModal = false"
@confirm="confirmDelete"
></confirm-modal>
@@ -69,42 +94,53 @@ export default {
},
data() {
return {
tabs: ['选手', '联系人'],
tabs: ['选手', '集体', '联系人'],
currentTab: 0,
playerList: [],
teamList: [],
showDeleteModal: false,
showSuccessToast: false,
currentItem: null
currentItem: null,
deleteType: 'player'
};
},
computed: {
addButtonText() {
if (this.currentTab === 0) return '新增选手'
if (this.currentTab === 1) return '新增集体'
return '新增联系人'
},
deleteModalTitle() {
return this.deleteType === 'team' ? '删除集体' : '删除选手'
},
deleteModalContent() {
return this.deleteType === 'team' ? '确定要删除该集体吗？' : '确定要删除该选手吗？'
}
},
onLoad() {
this.loadPlayerList()
this.loadTeamList()
},
onShow() {
// 从新增/编辑页面返回时重新加载列表
this.loadPlayerList()
this.loadTeamList()
},
methods: {
/**
* 加载选手列表
* Load player list
*/
async loadPlayerList() {
try {
// 获取当前用户信息
const userInfo = getUserInfo()
if (!userInfo || !userInfo.userId) {
console.error('未获取到用户信息')
uni.showToast({
title: '请先登录',
icon: 'none'
})
return
}
const res = await athleteAPI.getAthleteList({
current: 1,
size: 100,
createUser: userInfo.userId // 只查询当前用户创建的选手
createUser: userInfo.userId
})
let list = []
@@ -114,7 +150,6 @@ export default {
list = res
}
// 数据映射
this.playerList = list.map(item => ({
id: item.id,
name: item.name || item.playerName,
@@ -128,6 +163,43 @@ export default {
}
},
/**
* Load team list
*/
async loadTeamList() {
try {
const userInfo = getUserInfo()
if (!userInfo || !userInfo.userId) {
return
}
// Try to load team list from API
if (athleteAPI.getTeamList) {
const res = await athleteAPI.getTeamList({
current: 1,
size: 100,
createUser: userInfo.userId
})
let list = []
if (res.records) {
list = res.records
} else if (Array.isArray(res)) {
list = res
}
this.teamList = list.map(item => ({
id: item.id,
name: item.name || item.teamName,
memberCount: item.memberCount || item.members?.length || 0
}))
}
} catch (err) {
console.error('加载集体列表失败:', err)
this.teamList = []
}
},
handleTabChange(index) {
this.currentTab = index;
},
@@ -137,6 +209,10 @@ export default {
url: '/pages/add-player/add-player'
});
} else if (this.currentTab === 1) {
uni.navigateTo({
url: '/pages/add-team/add-team'
});
} else if (this.currentTab === 2) {
uni.navigateTo({
url: '/pages/add-contact/add-contact'
});
@@ -147,30 +223,42 @@ export default {
url: '/pages/edit-player/edit-player?id=' + item.id
});
},
handleDelete(item) {
handleEditTeam(item) {
uni.navigateTo({
url: '/pages/edit-team/edit-team?id=' + item.id
});
},
handleDelete(item, type) {
this.currentItem = item;
this.deleteType = type;
this.showDeleteModal = true;
},
async confirmDelete() {
this.showDeleteModal = false;
try {
// 调用删除API
if (this.deleteType === 'team') {
if (athleteAPI.removeTeam) {
await athleteAPI.removeTeam(this.currentItem.id)
}
const index = this.teamList.findIndex(item => item.id === this.currentItem.id);
if (index > -1) {
this.teamList.splice(index, 1);
}
} else {
await athleteAPI.removeAthlete(this.currentItem.id)
// 从列表中移除
const index = this.playerList.findIndex(item => item.id === this.currentItem.id);
if (index > -1) {
this.playerList.splice(index, 1);
}
}
// 显示成功提示
this.showSuccessToast = true;
setTimeout(() => {
this.showSuccessToast = false;
}, 2000);
} catch (err) {
console.error('删除选手失败:', err)
console.error('删除失败:', err)
uni.showToast({
title: '删除失败',
icon: 'none'