abf5e3a4 by 杨炀

no message

1 parent 12a5d160
<template>
<!-- <el-config-provider :locale="locale">-->
<router-view />
<!-- </el-config-provider>-->
<reset-pwd ref="resetPwdRef" />
</template>
<script setup>
import useSettingsStore from '@/store/modules/settings'
import { handleThemeStyle } from '@/utils/theme'
import { nextTick, onMounted, watch } from 'vue'
import useUserStore from '@/store/modules/user'
import ResetPwd from '@/views/system/user/profile/components/resetPwd'
import { getCurrentInstance } from '@vue/runtime-core'
// import { ElConfigProvider } from 'element-plus'
// import locale from 'element-plus/lib/locale/lang/zh-cn'
const userStore = useUserStore()
const { proxy } = getCurrentInstance()
onMounted(() => {
document.body.style.setProperty('--el-color-primary', '#453DEA')
// 鼠标移动到按钮上方时显示的颜色,默认蓝色,可以和primary设置的颜色不一样
document.body.style.setProperty('--el-color-primary-light-3', '#8623FC')
document.body.style.setProperty('--el-color-success', '#29c490')
document.body.style.setProperty('--el-color-success-light-3', '#54d0a6')
// danger
document.body.style.setProperty('--el-color-danger', '#d51515')
document.body.style.setProperty('--el-color-danger-light-3', '#d44')
// warning
document.body.style.setProperty('--el-color-warning', '#e6a23c')
document.body.style.setProperty('--el-color-warning-light-3', '#ebb563')
nextTick(() => {
// 初始化主题样式
handleThemeStyle(useSettingsStore().theme)
})
})
watch(() => userStore.user?.changePassFlag, (val) => {
if (val === '1') {
proxy.$modal.confirm('密码长期未更新,请及时更新').then(() => {
proxy.$refs['resetPwdRef'].open()
})
}
})
</script>
<style lang="scss">
.app-container{
background-color: #F5F7F9;
padding:20px;
min-height: calc(100vh - 85px);
}
/* 搜索栏 */
.from-Card{
background-color: #fff;
padding: 20px;
}
.btn-card{
padding: 20px;
background: #fff;
border-radius: 10px;
}
/* 表格 */
.table{
background-color: #fff;
padding:0 20px 10px;
position: relative;
}
.box{
background: #fff;
border-radius: 5px;
padding: 10px;
}
/* 分页 */
.foot{
background-color: #fff;
height: 50px;
}
.btn-top{
margin-top: 10px;
}
.el-table{
background: url("@/assets/admin/tableBg.png") #F5FBFE no-repeat top;
background-color:#F5FBFE!important;
background-size: 750px;
--el-bg-color:#F5FBFE;
--el-table-border-color:#e1e4ec;
--el-fill-color-blank:transparent;
--el-fill-color-light:#fff;
}
// 审核通过添加背景色
.success-row{
--el-table-tr-bg-color: rgba(41, 196, 144,.15);
}
.totalCost{
font-weight: 700;
font-size: 16px;
margin-top: 10px;
position: absolute;
bottom: 30px;
left: 20px;
z-index: 999;
span{
color: orange;
margin-right: 20px;
}
}
// 禁选背景色
.disabled-row{
--el-table-tr-bg-color: rgba(36, 37, 37,0.1);
}
</style>
import { createApp } from 'vue'
import Cookies from 'js-cookie'
import ElementPlus from 'element-plus'
import locale from 'element-plus/lib/locale/lang/zh-cn' // 中文语言
import '@/assets/styles/index.scss' // global css
import App from './App'
import store from './store'
import router from './router'
import directive from './directive' // directive
// 注册指令
import plugins from './plugins' // plugins
import { download } from '@/utils/request'
// svg图标
import 'virtual:svg-icons-register'
import SvgIcon from '@/components/SvgIcon'
import elementIcons from '@/components/SvgIcon/svgicon'
import './permission' // permission control
import { useDict } from '@/utils/dict'
import { getConfigKey, updateConfigByKey } from '@/api/system/config'
import {
parseTime,
resetForm,
addDateRange,
handleTree,
selectDictLabel,
selectDictLabels,
fillImgUrl
} from '@/utils/ruoyi'
import VueUeditorWrap from 'vue-ueditor-wrap'
// 分页组件
import Pagination from '@/components/Pagination'
// 自定义表格工具组件
import RightToolbar from '@/components/RightToolbar'
// 富文本组件
import Editor from '@/components/Editor'
import UEditor from '@/components/UEditor'
// 文件上传组件
import FileUpload from '@/components/FileUpload'
// 图片上传组件
import ImageUpload from '@/components/ImageUpload'
import ImageUpload2 from '@/components/ImageUpload/index2'
// 图片预览组件
import ImagePreview from '@/components/ImagePreview'
// 自定义树选择组件
import TreeSelect from '@/components/TreeSelect'
// 字典标签组件
import DictTag from '@/components/DictTag'
import draggable from 'vuedraggable'
const app = createApp(App)
// 全局方法挂载
app.config.globalProperties.useDict = useDict
app.config.globalProperties.getConfigKey = getConfigKey
app.config.globalProperties.updateConfigByKey = updateConfigByKey
app.config.globalProperties.download = download
app.config.globalProperties.parseTime = parseTime
app.config.globalProperties.resetForm = resetForm
app.config.globalProperties.handleTree = handleTree
app.config.globalProperties.addDateRange = addDateRange
app.config.globalProperties.selectDictLabel = selectDictLabel
app.config.globalProperties.selectDictLabels = selectDictLabels
app.config.globalProperties.fillImgUrl = fillImgUrl
// 全局组件挂载
app.component('DictTag', DictTag)
app.component('Pagination', Pagination)
app.component('TreeSelect', TreeSelect)
app.component('FileUpload', FileUpload)
app.component('ImageUpload', ImageUpload)
app.component('ImageUpload2', ImageUpload2)
app.component('ImagePreview', ImagePreview)
app.component('RightToolbar', RightToolbar)
app.component('Editor', Editor)
app.component('UEditor', UEditor)
app.component('Draggable', draggable)
app.use(router)
app.use(store)
app.use(VueUeditorWrap)
app.use(plugins)
app.use(elementIcons)
app.component('SvgIcon', SvgIcon)
directive(app)
// 使用element-plus 并且设置全局的大小
app.use(ElementPlus, {
locale: locale,
// 支持 large、default、small
size: Cookies.get('size') || 'default'
})
// 修改 el-dialog 默认点击遮照为不关闭
app._context.components.ElDialog.props.closeOnClickModal.default = false
app.mount('#app')
if (process.env.NODE_ENV !== 'development') {
// disorderCopy()
}
......@@ -518,12 +518,6 @@ export const constantRoutes = [
meta: { title: '缴费清单' }
},
{
path: 'list/:id/singleSign',
component: () => import('@/viewsPc/match/singleSign'),
name: 'singleSign',
meta: { title: '个人报名' }
},
{
path: 'list/:id/teamSign',
component: () => import('@/viewsPc/match/teamSign'),
name: 'teamSign',
......
......@@ -423,12 +423,6 @@ export const constantRoutes = [
meta: { title: '缴费清单' }
},
{
path: 'list/:id/singleSign',
component: () => import('@/viewsPc/match/singleSign'),
name: 'singleSign',
meta: { title: '个人报名' }
},
{
path: 'list/:id/teamSign',
component: () => import('@/viewsPc/match/teamSign'),
name: 'teamSign',
......
......@@ -410,12 +410,6 @@ export const constantRoutes = [
meta: { title: '赛事详情' }
},
{
path: 'list/:id/singleSign',
component: () => import('@/viewsPc/match/singleSign'),
name: 'singleSign',
meta: { title: '个人报名' }
},
{
path: 'list/:id/teamSign',
component: () => import('@/viewsPc/match/teamSign'),
name: 'teamSign',
......
......@@ -181,7 +181,6 @@
<dialogEditWdsf ref="dialogEditWdsfRef" @submitForm="changeMeDone"/>
<dialogEditAccompany ref="dialogEditAccompanyRef" @submitForm="getMyMemberTable"/>
<!-- <dialogChangeCoach ref="popChangeCoach" @submitForm="getMySignInfo"/>-->
<dialogExtraForm ref="popExtraForm" @submitForm="getSignInfoList"/>
</div>
</template>
......@@ -192,9 +191,7 @@ import * as match from '@/apiPc/match'
import {getCurrentInstance, onMounted} from '@vue/runtime-core'
import dialogEditWdsf from './components/addWdsf'
import dialogEditAccompany from './components/addAccompany'
import dialogSportsmanList from './components/sportsmanList'
import dialogAllSportsmanList from './components/allSportsmanList'
import dialogChangeCoach from './components/changeCoach'
import dialogExtraForm from './components/extraForm'
import dialogMates from './components/dialogMates'
import {Search, Switch} from "@element-plus/icons-vue";
......
......@@ -137,7 +137,6 @@
</div>
<dialogAddCoach ref="dialogAddCoachRef"/>
<dialogSportsmanList ref="dialogSportsmanListRef" @submitForm="getSignInfoList"/>
<dialogAllSportsmanList ref="dialogAllSportsmanListRef" @transfer="getChoosed" @submitForm="getSignInfoList"/>
<dialogMates ref="dialogMatesRef" @submitForm="getSignInfoList"/>
......@@ -153,9 +152,6 @@
</el-result>
</el-dialog>
<!-- <dialogChangeCoach ref="popChangeCoach" @submitForm="getMySignInfo"/>-->
<dialogExtraForm ref="popExtraForm" @submitForm="getSignInfoList"/>
</div>
</template>
......@@ -165,10 +161,8 @@ import {ref, reactive, toRefs} from 'vue'
import * as match from '@/apiPc/match'
import {getCurrentInstance, onMounted} from '@vue/runtime-core'
import dialogAddCoach from './components/addCoach'
import dialogSportsmanList from './components/sportsmanList'
import dialogAllSportsmanList from './components/allSportsmanList'
import dialogImport from './components/import'
import dialogChangeCoach from './components/changeCoach'
import dialogExtraForm from './components/extraForm'
import dialogMates from './components/dialogMates'
import {Search, Switch} from "@element-plus/icons-vue";
......@@ -472,19 +466,6 @@ function delchoosedchoosed() {
choosedchoosed.value = []
}
function editThis(row) {
const params = {
title: '修改报项',
personal: row.cptPersonInfo,
matchId: matchId.value,
groupId: groupId.value,
rankId: activeTeam.value,
signType: signType.value,
noPhotoCanSign: noPhotoCanSign.value,
coachOrLeaderFlag: coachOrLeaderFlag.value
}
proxy.$refs['dialogSportsmanListRef'].open(params)
}
function editMates(row) {
const params = {
......
<template>
<div class="app-container">
<div class="box ph-30">
<div class="panel">
<div class="panel-header">
<h3 class="panel-title">选择运动员</h3>
</div>
<div class="panel-body">
<div class="text-right mb20">
<el-button type="success" @click="chooseSportman">选择参赛运动员</el-button>
<el-button type="success" @click="importSportman">批量导入人员</el-button>
<el-button type="success" @click="addCoach">新增运动员</el-button>
</div>
<el-tabs
v-if="signType=='2'"
v-model="activeTeam"
type="card"
class="demo-tabs"
@tab-click="teamClick"
>
<el-tab-pane v-for="t in teamList" :key="t.id" :label="t.name" :name="t.id" />
</el-tabs>
<!-- 已选运动员列表-->
<div class="hasChoose">
<el-button v-for="p in choosedList" plain type="primary" @click="signForThisMan(p)">
{{ p.realName }}
<span v-if="p.sex=='1'">(男)</span>
<span v-if="p.sex=='0'">(女)</span>
</el-button>
</div>
<el-table :data="signInfoTable" style="width: 100%">
<el-table-column type="expand" align="center">
<template #default="props">
<el-table :data="props.row.signInfo" border>
<el-table-column label="序号" width="80px" type="index" align="center" />
<el-table-column label="报项">
<template #default="scope">
{{ scope.row.cptProjectName }}
{{ scope.row.cptGroupName }}{{ scope.row.cptLevelName }}{{ scope.row.cptSonLevelName }}
{{ scope.row.zu }}
</template>
</el-table-column>
<el-table-column v-if="coachOrLeaderFlag=='1'" label="教练" prop="coachNames" />
<el-table-column v-if="coachOrLeaderFlag=='1'" label="领队" prop="leaderNames" />
<el-table-column label="操作" fixed="right" width="100" align="center">
<template #default="scope">
<el-button type="primary" link @click="editThis(scope.row)">编辑</el-button>
<el-button type="primary" link @click="removeThis(scope.row.id)">删除</el-button>
</template>
</el-table-column>
</el-table>
</template>
</el-table-column>
<el-table-column label="运动员" min-width="120px">
<template #default="scope">
<div style="display: flex;align-items: center;">
<el-image v-if="scope.row.personInfo.picUrl" style="width: 50px; height: 50px" fit="contain" :src="scope.row.personInfo.picUrl" />
<p class="ml10">{{ scope.row.personInfo.realName }}({{ scope.row.personInfo.sexStr }})</p>
</div>
</template>
</el-table-column>
<el-table-column label="参赛队">
<template #default="scope">
{{ scope.row.signInfo[0]?.groupName }}
</template>
</el-table-column>
<el-table-column v-if="signType=='2'" label="队伍">
<template #default="scope">
{{ scope.row.signInfo[0]?.teamName }}
</template>
</el-table-column>
<el-table-column label="证件号" min-width="140px">
<template #default="scope">
{{ scope.row.personInfo?.idcTypeStr }}
<div>{{ scope.row.personInfo?.idcCode }}</div>
</template>
</el-table-column>
<el-table-column label="出生日期" min-width="100px" prop="personInfo.birth" />
<el-table-column label="国籍">
<template #default="scope">
{{ scope.row.personInfo?.countryName }}
</template>
</el-table-column>
<el-table-column label="民族" prop="personInfo.nation" />
<el-table-column label="联系方式" min-width="100px">
<template #default="scope">
{{ scope.row.personInfo?.phone }}
</template>
</el-table-column>
<!-- 补充信息-->
<el-table-column v-for="(e,index) in extraTableHead" :key="index" :label="e">
<template #default="scope">
<el-link v-if="scope.row.signInfo[0].extraPersonInfoMapList[index]?.type=='2'" :herf="scope.row.signInfo[0].extraPersonInfoMapList[index].value.url">
{{ scope.row.signInfo[0].extraPersonInfoMapList[index].value.name }}
</el-link>
<img v-else-if="scope.row.signInfo[0].extraPersonInfoMapList[index]?.type=='3'" style="width: 50px;" :src="scope.row.signInfo[0].extraPersonInfoMapList[index].value.url||scope.row.signInfo[0].extraPersonInfoMapList[index].value">
<span v-else>{{ scope.row.signInfo[0].extraPersonInfoMapList[index]?.value }}</span>
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" width="150" align="center">
<template #default="scope">
<el-button v-if="extraform&&extraform.length>0" type="text" @click="goPersonInfo(scope.row)">
<span v-if="scope.row.extraPersonInfo">修改</span>
<span v-else class="red">完善补充信息</span>
</el-button>
</template>
</el-table-column>
</el-table>
</div>
<div class="panel-footer text-center">
<el-button type="success" plain round @click="goPrev()">上一步</el-button>
<el-button type="success" round @click="submitForm()">下一步</el-button>
</div>
</div>
</div>
<dialogAddCoach ref="dialogAddCoachRef" />
<dialogSportsmanList ref="dialogSportsmanListRef" @submitForm="getSignInfoList" />
<dialogAllSportsmanList ref="dialogAllSportsmanListRef" @transfer="getChoosed" @submitForm="getSignInfoList" />
<dialogImport ref="dialogImportProps" @submitForm="getMySignInfo" />
<el-dialog v-model="showResult" :close-on-click-modal="false" :show-close="false">
<el-result icon="success" title="报名成功">
<template #extra>
<el-button type="primary" @click="downloadVoucher">下载凭证</el-button>
<el-button type="primary" @click="goMySign">查看报项</el-button>
</template>
</el-result>
</el-dialog>
<dialogChangeCoach ref="popChangeCoach" @submitForm="getMySignInfo" />
<dialogExtraForm ref="popExtraForm" @submitForm="getSignInfoList" />
</div>
</template>
<script setup>
import { ref, reactive } from 'vue'
import * as match from '@/apiPc/match'
import { getCurrentInstance, onMounted } from '@vue/runtime-core'
import dialogAddCoach from './components/addCoach'
import dialogSportsmanList from './components/sportsmanList'
import dialogAllSportsmanList from './components/allSportsmanList'
import dialogImport from './components/import'
import dialogChangeCoach from './components/changeCoach'
import dialogExtraForm from './components/extraForm'
const { proxy } = getCurrentInstance()
const router = useRouter()
const route = useRoute()
import _ from 'lodash'
import { ElMessage, ElMessageBox } from 'element-plus'
const data = reactive({
coachForm: {},
tableData: [], signInfoTable: [], choosedList: [],
extraPersonInfoMapList: [],
teamList: [],
extraform: [],
groupId: '0',
signType: '',
coachOrLeaderFlag: null,
noPhotoCanSign: null,
showResult: false,
showExtraForm: false,
extraTableHead: [],
activeTeam: ''
})
const { activeTeam, tableData, signInfoTable, choosedList, showExtraForm, extraPersonInfoMapList, teamList, extraform, groupId, signType, coachOrLeaderFlag, showResult, noPhotoCanSign, extraTableHead, coachForm } = toRefs(data)
let matchId = ''
let signInfoType = null
onMounted(() => {
groupId.value = route.query.groupId
signType.value = route.query.signType
matchId = route.query.matchId
if (signType.value == '2') {
// 团队-队伍报名-获取队伍
getTeamList(matchId, groupId.value)
} else {
getSignInfoList()
}
getMatch(matchId)
getTableHead()
getMySignInfo()
})
let chargeFlag
function getMatch(id) {
match.getMatchById({
id: id
}).then(res => {
chargeFlag = res.data.chargeFlag
noPhotoCanSign.value = res.data.noPhotoCanSign
coachOrLeaderFlag.value = res.data.coachOrLeaderFlag
extraform.value = JSON.parse(res.data.participantsInfo)
})
}
function getMySignInfo() {
// 获取已报
match.getMySignInfo({
cptId: matchId,
groupId: groupId.value
}).then(res => {
tableData.value = res.data.signInfo
signInfoType = res.data.type
})
}
function getSignInfoList() {
// console.log(activeTeam.value)
match.getMySignInfoList({
cptId: matchId,
groupId: groupId.value,
teamId: activeTeam.value || ''
}).then(res => {
signInfoTable.value = res.data
if (signInfoTable.value.length > 0) {
const choosedIds = []
for (const p of choosedList.value) {
choosedIds.push(p.id)
}
for (var pp of signInfoTable.value) {
if (choosedIds.indexOf(pp.personInfo.id) == -1) {
// 判断是否已存在
choosedList.value.push(pp.personInfo)
}
}
}
})
}
function getTableHead() {
match.getCptExtraInfo(matchId).then(res => {
// console.log(res.data)
extraTableHead.value = res.data
})
}
function getTeamList(a, b) {
match.getMyTeamList(a, b).then(res => {
teamList.value = res.data
activeTeam.value = teamList.value[0].id
getSignInfoList()
})
}
function teamClick(tab, event) {
activeTeam.value = tab.props.name
getSignInfoList()
}
function submitForm() {
if (signInfoType == '1') {
ElMessageBox.confirm('已报项,前往我的报项', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
router.push({ name: 'myMatch' })
})
return
}
if (extraform.value && extraform.value.length > 0) {
let needBuchong = false
for (const e of extraform.value) {
if (e.status == '0') {
needBuchong = true
}
}
for (const s of signInfoTable.value) {
if (s.extraPersonInfo == null && needBuchong) {
ElMessage.error('请完善运动员补充信息')
return
}
}
}
if (signInfoType == '2') {
match.recoverMySign({ cptId: matchId, groupId: groupId.value }).then(res => {
if (res.msg.indexOf('Exception:') > -1) {
const msg = res.msg.slice(10)
ElMessageBox.confirm(msg, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
console.log('用户点击确定')
})
return
} else {
afterRecover()
}
})
} else {
afterRecover()
}
}
function afterRecover() {
if (signInfoTable.value.length == 0) {
ElMessage.error('请至少选择一个项目')
return
}
// 判断是否收费
if (chargeFlag == '0') {
var obj = {
cptId: matchId,
groupId: groupId.value
}
match.commitSign(obj).then(res => {
console.log(res.data)
showResult.value = true
})
} else {
// 生成账单
router.push({
name: 'expenseDetails',
query: {
matchId: matchId,
groupId: groupId.value
}
})
}
}
function goPrev() {
router.go(-1)
}
function chooseSportman() {
if (signInfoType == '2') {
match.recoverMySign({
cptId: matchId,
groupId: groupId.value
}).then(res => {
if (res.msg.indexOf('Exception:') > -1) {
const msg = res.msg.slice(10)
ElMessageBox.confirm(msg, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
console.log('用户点击确定')
})
return
}
getMySignInfo()
})
}
const params = {
title: '选择运动员',
matchId: matchId,
groupId: groupId.value,
rankId: activeTeam.value,
signType: signType.value,
noPhotoCanSign: noPhotoCanSign.value,
coachOrLeaderFlag: coachOrLeaderFlag.value,
choosedList: choosedList.value
}
proxy.$refs['dialogAllSportsmanListRef'].open(params)
}
function getChoosed(list) {
choosedList.value = list
}
function addCoach() {
if (signInfoType == '2') {
match.recoverMySign({
cptId: matchId,
groupId: groupId.value
}).then(res => {
if (res.msg.indexOf('Exception:') > -1) {
const msg = res.msg.slice(10)
ElMessageBox.confirm(msg, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
console.log('用户点击确定')
})
return
}
getMySignInfo()
})
}
const params = {
title: '新增运动员',
id: 0,
groupId: groupId.value
}
proxy.$refs['dialogAddCoachRef'].open(params)
}
function signForThisMan(p) {
const params = {
title: '选择报项',
matchId: matchId,
groupId: groupId.value,
rankId: activeTeam.value,
signType: signType.value,
noPhotoCanSign: noPhotoCanSign.value,
coachOrLeaderFlag: coachOrLeaderFlag.value,
personal: p,
choosedList: choosedList.value
}
proxy.$refs['dialogSportsmanListRef'].open(params)
}
function editThis(row) {
const params = {
title: '修改报项',
personal: row.cptPersonInfo,
matchId: matchId,
groupId: groupId.value,
rankId: activeTeam.value,
signType: signType.value,
noPhotoCanSign: noPhotoCanSign.value,
coachOrLeaderFlag: coachOrLeaderFlag.value
}
proxy.$refs['dialogSportsmanListRef'].open(params)
}
function removeThis(id) {
ElMessageBox.confirm('确定移除这条报项吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
match.deleteSign(id).then(res => {
// 重新获取已报名信息
ElMessage.success('已移除该报项')
getSignInfoList()
})
})
}
function changeCoach(cptId, groupId) {
// 更换教练
const params = {
title: '修改教练',
groupId: groupId,
cptId: cptId
}
proxy.$refs['popChangeCoach'].open(params)
}
function importSportman() {
const params = {
title: '批量导入人员',
groupId: groupId.value
}
proxy.$refs['dialogImportProps'].open(params)
}
function goMySign() {
router.push({
name: 'myMatch'
})
}
const goPersonInfo = (row) => {
if (signInfoType == '1') {
ElMessageBox.alert('已报项,前往我的报项', '提示', {
confirmButtonText: 'OK',
callback: (Action) => {
router.push({ name: 'myMatch' })
}
})
return
}
// 完善补充信息
console.log(row)
const params = {
title: '完善补充信息',
participantsInfoArr: extraform.value,
personId: row.personInfo.id,
extraId: row.extraPersonInfo?.id || 0
}
proxy.$refs['popExtraForm'].open(params)
}
function downloadVoucher() {
// 下载凭证
proxy.download(
`/pdf/getPayedOrderPdf/${matchId}/${groupId.value || 0}`, {}, '报项凭证.pdf'
)
}
</script>
<style scoped lang="scss">
.app-container{ padding: 0;background: #F5F7F9;}
.panel-footer .el-button--success{background: linear-gradient(270deg, #39DBA7, #38EF7D);border: none;
padding: 0 40px;
font-size: 16px;
}
.panel-footer .el-button--success.is-plain{background: #fff;border:1px solid #2ED981;color: #2ED981;}
.hasChoose{margin: 0 0 20px;}
.chooseForm{
:deep(.el-form-item__content){background: rgba(245, 247, 249, 0.38);padding: 20px 40px 10px;}
.el-checkbox{height: auto;}
:deep(.el-checkbox__input){position: absolute;right: 0;top: 0;}
.name{text-align: center;}
}
</style>
<template>
<el-dialog :title="title">
<el-form v-model="coachForm">
<el-form-item label="教练">
<el-select v-model="coachForm.coachs" multiple>
<el-option v-for="c in myCoachList" :key="c.id" :label="c.realName" :value="c.id">
<div class="optionFlex">
<el-avatar :size="60" :src="c.picUrl" />
<p class="name">{{ c.realName }}
<span v-if="c.sex=='0'">(女)</span>
<span v-else>(男)</span>
</p>
</div>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="领队">
<el-select v-model="coachForm.leaders" multiple>
<el-option v-for="c in myCoachList" :key="c.id" :label="c.realName" :value="c.id">
<div class="optionFlex">
<el-avatar :size="60" :src="c.picUrl" />
<p class="name">{{ c.realName }}
<span v-if="c.sex=='0'">(女)</span>
<span v-else>(男)</span>
</p>
</div>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="其他">
<el-select v-model="coachForm.others" multiple>
<el-option v-for="c in myCoachList" :key="c.id" :label="c.realName" :value="c.id">
<div class="optionFlex">
<el-avatar :size="60" :src="c.picUrl" />
<p class="name">{{ c.realName }}
<span v-if="c.sex=='0'">(女)</span>
<span v-else>(男)</span>
</p>
</div>
</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="success">确定</el-button>
</el-form-item>
</el-form>
</el-dialog>
</template>
<script setup>
</script>
<style scoped lang="scss">
</style>
<template>
<el-row>
<el-col :span="20" :offset="2"><h3>队伍信息</h3></el-col>
<el-col :span="20" :offset="2" class="rankArea">
<el-form :inline="true" label-width="120px">
<!-- 已有队伍-->
<div v-for="(r,index) in rankList" class="rankBox">
<el-icon class="del" @click="delRank(r)">
<Close />
</el-icon>
<el-row>
<el-col :span="6">
<el-form-item label="队伍logo:">
<el-avatar :size="120" :src="r.imgUrl" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="队伍名称:">
<span>{{ r.name }}</span>
</el-form-item>
<el-form-item v-if="props.coachOrLeaderFlag=='1'" label="领队:">
<div v-if="r.leaderNames" class="goChooseBox">
<el-tag v-for="(tag,index) in r.leaderNames.split(',')" :key="index" class="mx-1" :disable-transitions="false">
{{ tag }}
</el-tag>
</div>
</el-form-item>
<el-form-item v-if="props.coachOrLeaderFlag=='1'" label="翻译:">
<div v-if="r.translatorNames" class="goChooseBox">
<el-tag v-for="(tag,index) in r.translatorNames.split(',')" :key="index" class="mx-1" :disable-transitions="false">
{{ tag }}
</el-tag>
</div>
<span v-else>暂无</span>
</el-form-item>
<el-form-item v-if="props.coachOrLeaderFlag=='1'" label="其他:">
<div v-if="r.otherNames" class="goChooseBox">
<el-tag v-for="(tag,index) in r.otherNames.split(',')" :key="index" class="mx-1" :disable-transitions="false">
{{ tag }}
</el-tag>
</div>
<span v-else>暂无</span>
</el-form-item>
</el-col>
<el-col v-if="props.coachOrLeaderFlag=='1'" :span="8">
<el-form-item label="教练:">
<div v-if="r.coachNames" class="goChooseBox">
<el-tag
v-for="(tag,index) in r.coachNames.split(',')"
:key="index" class="mx-1"
:disable-transitions="false"
>
{{ tag }}
</el-tag>
</div>
</el-form-item>
<el-form-item label="队医:">
<div v-if="r.teamDoctorNames" class="goChooseBox">
<el-tag v-for="(tag,index) in r.teamDoctorNames.split(',')" :key="index" class="mx-1" :disable-transitions="false">
{{ tag }}
</el-tag>
</div>
<span v-else>暂无</span>
</el-form-item>
<el-form-item label="官员:">
<div v-if="r.officialNames" class="goChooseBox">
<el-tag
v-for="(tag,index) in r.officialNames.split(',')"
:key="index" class="mx-1"
:disable-transitions="false"
>
{{ tag }}
</el-tag>
</div>
<span v-else>暂无</span>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="2" :offset="22">
<el-button type="primary" link class="fr" @click="editRank(r)">编辑</el-button>
</el-col>
</el-row>
</div>
<el-button type="success" plain @click="addRank">+添加队伍</el-button>
<el-button v-if="rankList.length>0||showAdd" type="success" plain @click="addCoach">+添加教练/领队</el-button>
</el-form>
</el-col>
</el-row>
<!-- 添加人员-->
<addCoachdialog ref="dialogAddCoach" @submitForm="getGroupInfo" />
<!-- 队伍信息-->
<editRankdialog ref="dialogEditRank" @submitForm="getList" />
</template>
<script setup>
import { computed, reactive } from 'vue'
import * as match from '@/apiPc/match'
import { getCurrentInstance, onMounted } from '@vue/runtime-core'
import { ElMessage, ElMessageBox } from 'element-plus'
import addCoachdialog from './addCoach'
import editRankdialog from './editRank'
const router = useRouter()
const route = useRoute()
const { proxy } = getCurrentInstance()
const data = reactive({
form: {},
rankList: [],
group: {},
groupId: '',
teamType: [{ label: '学校', value: '0' }, { label: '俱乐部', value: '1' }],
rules: {
imgUrl: { required: true, message: '请上传图标', trigger: 'blur' },
name: { required: true, message: '请填写名称', trigger: 'blur' }
}
})
const { teamType, rules, rankList, form, group, groupId } = toRefs(data)
const backRankId = ''
let cptId = ''
const props = defineProps({
coachOrLeaderFlag: {
type: String
}
})
onMounted(() => {
cptId = route.query.matchId
groupId.value = route.query.groupId
getList()
getGroupInfo()
})
// 弹窗加人
const addCoach = () => {
const params = {
id: 0,
groupId: groupId.value
}
proxy.$refs['dialogAddCoach'].open(params)
}
function getGroupInfo() {
match.getGroupById(groupId.value).then(res => {
group.value = res.data
})
}
function getList() {
// 获取队伍列表
match.getMyTeamList(cptId, groupId.value).then(response => {
rankList.value = response.data
})
}
function delRank(r) {
ElMessageBox.confirm(
'确定删除该队伍吗?',
'提示',
{
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}
)
.then(() => {
match.delRank(r.id).then(response => {
getList()
ElMessage({
type: 'success',
message: '已删除'
})
})
})
}
function addRank() {
const params = {
form: {},
cptId: cptId,
title: '新建队伍',
coachOrLeaderFlag: props.coachOrLeaderFlag,
group: group.value
}
proxy.$refs['dialogEditRank'].open(params)
}
function editRank(rank) {
const params = {
form: rank,
cptId: cptId,
title: '编辑队伍',
coachOrLeaderFlag: props.coachOrLeaderFlag,
group: group.value
}
proxy.$refs['dialogEditRank'].open(params)
}
</script>
<style lang="scss" scoped>
.rankArea {
background: #FBFCFD;
border-radius: 10px;
padding: 25px 30px;
}
.rankBox {
background: #FFFFFF;
padding: 20px;
position: relative;
border-radius: 10px;
margin: 0 0 20px;
}
:deep(.el-upload--picture-card) {
width: 80px;
height: 80px;
border-radius: 50%;
}
:deep(.el-upload-list__item.is-success .el-upload-list__item-status-label) {
display: none;
}
:deep(.el-upload-list--picture-card .el-upload-list__item) {
width: 80px;
height: 80px;
border-radius: 50%;
}
.del {
position: absolute;
right: 15px;
top: 15px;
font-size: 20px;
z-index: 1;
}
.mx-1 {
margin: 5px
}
</style>
<template>
<el-dialog v-model="show" :title="title" width="1000px" append-to-body :close-on-click-modal="false">
<el-form label-width="120px" label-position="top" class="chooseForm" :model="form">
<el-row :gutter="20">
<el-col :span="24" />
<el-col :span="8">
<el-form-item>
<p class="title">可选项目</p>
<el-radio-group v-model="form.project" @change="chooseThisProject">
<div v-for="c in projectList" :key="c" class="athleteBox">
<el-radio :label="c">
<p class="name">{{ c.name }}
</p>
</el-radio>
</div>
</el-radio-group>
<el-empty v-if="projectList.length==0" :image="`/img/order_no.png`" :image-size="228" description="无可选项目" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item>
<p class="title">可选组别</p>
<el-radio-group v-model="form.groupId" @change="chooseThisGroup">
<div v-for="c in signGroupList" :key="c" class="athleteBox">
<el-radio :label="c.id">
<p class="name">{{ c.name }}
</p>
</el-radio>
</div>
</el-radio-group>
<el-empty v-if="signGroupList.length==0" style="width: 100%;" description="无可选组别" />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item>
<el-radio-group v-model="form.levelId" @change="chooseThisLevel">
<div v-if="signlevelListBoy.length>0">
<p class="title">男子组</p>
<div v-for="c in signlevelListBoy" :key="c" class="athleteBox">
<el-radio :label="c.id">{{ c.name }}</el-radio>
</div>
</div>
<div v-if="signlevelListGirl.length>0">
<p class="title">女子组</p>
<div v-for="c in signlevelListGirl" :key="c" class="athleteBox">
<el-radio :label="c.id">{{ c.name }}</el-radio>
</div>
</div>
</el-radio-group>
<div v-if="signLevelList.length>0">
<p class="title">可选级别</p>
<el-radio-group :key="c" v-model="form.levelId" @change="chooseThisLevel">
<div v-for="c in signLevelList" :key="c" class="athleteBox">
<el-radio :label="c.id">{{ c.name }}</el-radio>
</div>
</el-radio-group>
</div>
<div v-if="signLevelList.length==0&&signlevelListGirl.length==0&&signlevelListBoy.length==0" style="width: 100%">
<p class="title">可选级别</p>
<el-empty style="width: 100%;" description="无可选级别" />
</div>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<div class="dialog-footer text-center">
<el-button type="primary" @click="levelDone">保 存</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { getCurrentInstance, nextTick, onMounted } from '@vue/runtime-core'
import { reactive, toRefs, watch } from 'vue'
import * as match from '@/apiPc/match'
import { ElMessage, ElMessageBox } from 'element-plus'
const { proxy } = getCurrentInstance()
const emit = defineEmits(['submitForm'])
const data = reactive({
projectList: [],
signGroupList: [],
signLevelList: [],
signlevelListBoy: [],
signlevelListGirl: [],
show: false,
title: '',
matchId: '',
form: {}
})
const { show, projectList, title, form, matchId, signGroupList, signLevelList, signlevelListBoy, signlevelListGirl } = toRefs(data)
let personId = ''
onMounted(() => {
getMyself()
})
const getMyself = () => {
match.getMyPersonInfo().then(res => {
personId = res.data.id
})
}
const getProjectList = (id) => {
projectList.value = []
match.getCanSignProjectList(id).then(res => {
for (const p of res.data) {
if (p.canSign == '1') {
projectList.value.push(p)
}
}
})
}
const chooseThisProject = (e) => {
console.log(e)
getSignGroupList(e.id, personId)
form.value.levelId = ''
form.value.groupId = ''
signLevelList.value = []
signlevelListBoy.value = []
signlevelListGirl.value = []
}
// 获取组别
const getSignGroupList = (projectId, personId) => {
signGroupList.value = []
match.getCanSignGroupListFromSelectPerson(projectId, personId).then(res => {
for (var g of res.data) {
if (g.canSign == '1') {
signGroupList.value.push(g)
}
}
})
}
const chooseThisGroup = (e) => {
console.log(e)
getLevels(form.value.groupId, personId)
}
// 获取级别
const getLevels = (groupId, personId) => {
signLevelList.value = []
signlevelListBoy.value = []
signlevelListGirl.value = []
match.getCanSignlevelListFromSelectPerson(groupId, personId).then(res => {
for (const l of res.data) {
l.text = l.name
l.value = l.id
if (l.levelType == '1') {
signlevelListBoy.value.push(l)
} else if (l.levelType == '2') {
signlevelListGirl.value.push(l)
} else {
signLevelList.value.push(l)
}
}
})
}
const levelDone = () => {
if (!form.value.levelId) {
ElMessage.error('请选择级别')
return
}
const obj = {
levelId: form.value.levelId,
athleteIds: personId,
groupId: '',
teamId: ''
}
saveOne(obj)
}
const saveOne = (obj) => {
match.sportsmanDone(obj).then(res => {
if (res.msg.indexOf('Exception:') > -1) {
const msg = res.msg.slice(10)
ElMessageBox.confirm(msg).then(() => {
})
return
}
show.value = false
emit('submitForm')
})
}
watch(show, (val) => {
if (!val) {
form.value = {}
}
})
function cancel() {
show.value = false
}
const open = (params) => {
show.value = true
title.value = params.title || '项目列表'
matchId.value = params.matchId
getProjectList(matchId.value)
}
defineExpose({
open
})
</script>
<style lang="scss" scoped>
.el-radio-group{ width: 100%;display: block;}
.athleteBox{height: 40px; display: flex;align-items: center;
.el-radio__label{display: flex;align-items: center;margin: 0 20px;}
.el-radio__inner{ scale: 1.5;}
.name{margin: 0 20px;font-size: 16px;}
}
.athleteBox:hover{background: #efefef;}
p.title{font-size: 16px;margin: 0 0 15px;}
.el-form-item{min-height: 400px;border: 1px solid #eee;padding:10px 20px}
</style>
<template>
<el-dialog
v-model="show" destroy-on-close :title="title" width="1000px" append-to-body
:close-on-click-modal="false" @close="delWatch"
>
<el-form
ref="ruleFormRef"
label-position="top" label-width="120px" class="chooseForm" :model="form"
:rules="rules"
>
<el-row class="athletesform">
<el-col v-show="signType!=0" :span="8" style="max-height: 70vh;overflow: auto;">
<el-form-item label="可报运动员" class="athletes">
<el-radio-group v-model="form.manId" class="ml-4">
<div v-for="item in athletesList" :key="item.id" :ref="item.id" class="mb20">
<el-radio-button :label="item.id" size="large" @change="changePersonal(item)">
<div class="optionFlex">
<el-avatar v-show="item.picUrl" :size="40" :src="item.picUrl" />
<p class="name">{{ item.realName }}
<span v-show="item.sex=='0'">(女)</span>
<span v-show="item.sex=='1'">(男)</span>
</p>
</div>
</el-radio-button>
<el-button
v-if="noPhotoCanSign=='0'&&(!item.picUrl)" class="ml20" type="text"
@click="editPersonInfo(item.id,nowMan.groupId)"
>上传照片
</el-button>
</div>
</el-radio-group>
</el-form-item>
</el-col>
<el-col v-loading="loading" :span="16" style="max-height: 70vh;overflow: auto;">
<el-empty v-show="treeData.length<1" description="请选择运动员" />
<el-collapse v-for="(project,index) in treeData" :key="project.id" v-model="activeNames">
<div v-show="project.hasNext==0&&project.canSign=='1'" class="fake-collapse-item">
<el-checkbox-group v-model="form.levelId" size="large">
<el-checkbox :label="project.levelId">{{ project.name }}</el-checkbox>
</el-checkbox-group>
</div>
<el-collapse-item v-show="project.hasNext==1&&project.canSign=='1'" :title="project.name" :name="index">
<div v-for="group in project.groupList" :key="group.id">
<div v-show="group.hasNext==0">
<el-checkbox-group v-model="form.levelId" size="large">
<el-checkbox v-show="group.canSign=='1'" :label="group.levelId">{{ group.name }}</el-checkbox>
<!-- <el-checkbox v-show="group.hasNext!=0" disabled :label="group.id">{{ group.name }}</el-checkbox>-->
</el-checkbox-group>
</div>
<div v-show="group.hasNext==1">
<el-checkbox-group
v-for="level in group.levelList" :key="level.id" v-model="form.levelId"
size="large"
>
<!-- project.type判断选队友 signId删除报项 :disabled="level.canSign==0||level.belongToThisTeam==0"-->
<el-checkbox v-show="level.canSign==1" :label="level.id" :checked="level.checked">
{{ group.name }}{{ level.name }}
<span v-show="level.levelType=='1'">(男)</span>
<span v-show="level.levelType=='2'">(女)</span>
</el-checkbox>
</el-checkbox-group>
</div>
</div>
</el-collapse-item>
</el-collapse>
</el-col>
</el-row>
</el-form>
<el-dialog v-model="showMateList" :title="mateTitle" width="900px" draggable @close="mateClose">
<div class="mb20">
<span v-if="mateConfig.minCount!=mateConfig.maxCount">请选择{{ mateConfig.minCount }}~{{
mateConfig.maxCount
}}个队友</span>
<span v-else-if="mateConfig.minCount=='-1'&&mateConfig.maxCount=='-1'">请至少选择1个队友</span>
<span v-else>请选择{{ mateConfig.minCount }}个队友</span>
<span v-if="mateConfig.minMaleCount>0||mateConfig.maxMaleCount>0" style="margin:0 20px;">男子:
<span v-show="mateConfig.minMaleCount!=mateConfig.maxMaleCount&&mateConfig.minMaleCount!=-1"> 最少{{ mateConfig.minMaleCount }}</span>
<span v-show="mateConfig.minMaleCount!=mateConfig.maxMaleCount&&mateConfig.maxMaleCount!=-1"> 最多{{ mateConfig.maxMaleCount }}</span>
<span v-show="mateConfig.minMaleCount==mateConfig.maxMaleCount&&mateConfig.maxMaleCount!=-1">{{ mateConfig.maxMaleCount }}</span>
</span>
<span v-if="mateConfig.minFemaleCount>0||mateConfig.maxFemaleCount>0" style="margin:0 20px;">女子:
<span v-show="mateConfig.minFemaleCount!=mateConfig.maxFemaleCount&&mateConfig.minFemaleCount>0"> 最少{{ mateConfig.minFemaleCount }}</span>
<span v-show="mateConfig.minFemaleCount!=mateConfig.maxFemaleCount&&mateConfig.maxFemaleCount>0"> 最多{{ mateConfig.maxFemaleCount }}</span>
<span v-show="mateConfig.minFemaleCount==mateConfig.maxFemaleCount&&mateConfig.minFemaleCount>0">{{ mateConfig.minFemaleCount }}</span>
</span>
<span v-show="form.mates.length>1" style="float: right" class="text-success">已选{{ form.mates?.length-1 }}个队友</span>
</div>
<!-- <el-button v-if="teammateList.length<minCount" type="text" @click="addTeamMate">新增队友</el-button>-->
<el-empty v-if="teammateList.length==0" description="暂无可选队友" />
<div class="teammateList" style="max-height:60vh;overflow: auto;">
<el-checkbox-group v-model="form.mates" class="ml-4" @change="changeTeammates">
<el-checkbox disabled checked :label="personal.sex+'_'+personal.id" size="large">
<div class="optionFlex" style="width: auto;">
<div style="width: 40px;"><img v-show="personal.picUrl" :src="personal.picUrl" width="40"></div>
<p class="name" style="width: 200px">{{ personal.realName }}
<span v-show="personal.sex=='0'">(女)</span>
<span v-show="personal.sex=='1'">(男)</span>
</p>
<el-select v-show="sonLevelList.length>0" v-model="personal.sonlevel" clearable>
<el-option v-for="son in sonLevelList" :value="son.id" :label="son.name">{{ son.name }}</el-option>
</el-select>
</div>
</el-checkbox>
<div v-for="(item,index) in teammateList" :key="item.id" class="mb20">
<el-checkbox :label="item.sex+'_'+item.id" size="large" :disabled="item.disabled">
<div class="optionFlex" style="width: auto;">
<span>{{ index+1 }}</span>
<div style="width: 40px;"><img v-show="item.picUrl" :src="item.picUrl" width="40"></div>
<p class="name" style="width: 200px">{{ item.realName }}
<span v-if="item.sex=='0'">(女)</span>
<span v-else>(男)</span>
</p>
<el-select v-show="sonLevelList.length>0" v-model="item.sonlevel" clearable>
<el-option v-for="son in sonLevelList" :value="son.id" :label="son.name">{{ son.name }}</el-option>
</el-select>
</div>
</el-checkbox>
<el-button v-if="noPhotoCanSign=='0'&&(!item.picUrl)" class="ml20" type="text" @click="editPersonInfo(item.id,nowMan.groupId)">
上传照片
</el-button>
</div>
</el-checkbox-group>
</div>
<el-transfer
v-model="form.mates" :data="teammateList" :titles="['可选队友','已选队友']"
@left-check-change="changeTeammates" @change="transferChange"
>
<template #default="scope">
<div class="transferItem">
<img v-show="scope.option.picUrl" :src="scope.option.picUrl" width="50" height="70">
<div class="name">
{{ scope.option.realName }}
<span v-if="scope.option.sex=='0'"></span>
<span v-else></span>
</div>
<el-select v-show="sonLevelList.length>0" v-model="scope.option.sonlevel" clearable>
<el-option v-for="son in sonLevelList" :key="son.id" :value="son.id" :label="son.name">{{ son.name }}</el-option>
</el-select>
</div>
</template>
</el-transfer>
<template #footer>
<div class="dialog-footer text-center">
<el-button type="primary" @click="chooseMateDone">确定</el-button>
</div>
</template>
</el-dialog>
<dialogPersonInfo ref="editPersonInfoRef" @submitForm="getAthletesList" />
</el-dialog>
</template>
<script setup>
import { reactive, ref, toRefs, watch } from 'vue'
import { getCurrentInstance, nextTick, onMounted } from '@vue/runtime-core'
import * as match from '@/apiPc/match'
import { ElMessage } from 'element-plus'
const { proxy } = getCurrentInstance()
const emit = defineEmits(['submitForm'])
import dialogPersonInfo from '../components/addCoach'
import _ from 'lodash'
const data = reactive({
show: false,
title: '', mateTitle: '',
signType: '',
form: {
levelId: [],
mates: []
},
athletesList: [],
signProjectList: [],
signGroupList: [],
showMateList: false,
showBtn: false,
teammateList: [],
rankId: '0',
treeData: [],
loading: false,
mateConfig: {},
noPhotoCanSign: null,
coachOrLeaderFlag: null,
personal: {},
activeNames: [0],
okMates: []
})
const {
signType,
form,
rules,
loading,
activeNames,
athletesList,
treeData,
show,
title, mateTitle,
personal,
rankId,
showMateList,
showBtn,
teammateList,
mateConfig,
noPhotoCanSign,
coachOrLeaderFlag,
okMates
} = toRefs(data)
let matchId
let groupId
watch(show, (val) => {
if (!val) {
form.value = {}
treeData.value = []
delWatch()
}
})
const changePersonal = (item) => {
// delWatch()
personal.value = item
form.value.manId = item.id
getTree()
}
function getTree() {
noLevelId = ''
loading.value = true
match.getMySignListTree(matchId, form.value.manId, rankId.value).then(res => {
treeData.value = res.data
// 循环项目,组,级别 赋值是否checked
getMyIsSign()
})
}
let signOk = {}
function getMyIsSign() {
delWatch()
form.value.levelId = []
match.getMySignIds(matchId, form.value.manId, rankId.value).then(res => {
loading.value = false
signOk = res.data
for (const s of signOk) {
form.value.levelId.push(s.eid)
for (const p of treeData.value) {
if (p.levelId == s.eid) {
p.checked = true
p.signId = s.signId
p.belongToThisTeam = s.belongToThisTeam
} else {
for (const g of p.groupList) {
g.type = p.type
if (g.levelId == s.eid) {
g.checked = true
g.signId = s.signId
g.belongToThisTeam = s.belongToThisTeam
} else {
for (const l of g.levelList) {
l.type = p.type
if (s.eid == l.id) {
l.checked = true
l.signId = s.signId
l.belongToThisTeam = s.belongToThisTeam
}
}
}
}
}
}
}
if (signOk.length < 1) {
for (const p of treeData.value) {
for (const g of p.groupList) {
g.type = p.type
for (const l of g.levelList) {
l.type = p.type
}
}
}
}
addWatch()
})
}
//#region 监听叶子的数量变化
let noLevelId
let levelInfo
let watchHandle = null
function addWatch() {
delWatch()
watchHandle = watch(() => form.value.levelId, (newValue, oldValue) => {
if (!newValue) return
oldValue = _.uniq(oldValue)
newValue = _.uniq(newValue)
// console.log(newValue, oldValue)
let temp
let isAdd = false
if (newValue?.length > oldValue?.length) {
isAdd = true
temp = _.difference(newValue, oldValue)
} else {
isAdd = false
temp = _.difference(oldValue, newValue)
}
if (newValue[0] == temp[0]) {
}
if (temp.length === 1) {
levelInfo = findlevelInfo(temp[0], treeData.value, 1)
if (isAdd) {
noLevelId = temp[0]
judgeChooseTeam(levelInfo.type, temp[0])
} else {
if (!temp[0] || temp[0] == undefined) {
return
}
removeThis(levelInfo.signId)
}
}
// console.log(isAdd, temp[0])
})
}
function delWatch() {
if (watchHandle) {
watchHandle()
watchHandle = null
}
}
function findlevelInfo(id, list, deep) {
let info = null
_.some(list, (l) => {
switch (deep) {
case 1:// p
if (l.levelId == id) {
info = l
} else {
info = findlevelInfo(id, l.groupList, 2)
}
break
case 2:// g
if (l.levelId == id) {
info = l
} else {
info = findlevelInfo(id, l.levelList, 3)
}
break
case 3:// l
if (l.id == id) {
info = l
}
break
}
return info
})
return info
}
//#endregion
function getAthletesList() {
match.getMyGroupForCpt(groupId, matchId).then(res => {
athletesList.value = res.data.athletes
if (form.value.manId) {
for (const a of athletesList.value) {
if (a.id == form.value.manId) {
nowMan.value = a
}
}
}
})
}
const open = (params) => {
show.value = true
matchId = params.matchId
groupId = params.groupId
signType.value = params.signType
title.value = params.title
rankId.value = params.rankId || ''
noPhotoCanSign.value = params.noPhotoCanSign
coachOrLeaderFlag.value = params.coachOrLeaderFlag
if (params.personal) {
form.value.manId = params.personal.id
setTimeout(() => {
proxy.$refs[params.personal.id][0].scrollIntoView({ block: 'start', behavior: 'smooth' })
}, 200)
getTree()
personal.value = params.personal
}
if (groupId != 0) {
if (params.choosedList) {
athletesList.value = params.choosedList
if (form.value.manId) {
for (const a of athletesList.value) {
if (a.id == form.value.manId) {
nowMan.value = a
}
}
}
} else {
getAthletesList()
}
}
}
defineExpose({
open
})
const nowMan = ref({})
const sonLevelList = ref([])
let sonLevelIds = []
function editPersonInfo(id, groupId) {
const params = {
id: id,
groupId: groupId
}
proxy.$refs['editPersonInfoRef'].open(params)
}
function addTeamMate() {
const params = {
id: 0,
groupId: groupId
}
proxy.$refs['editPersonInfoRef'].open(params)
}
function transferChange(value, direction, movedKeys) {
console.log(value, direction, movedKeys)
console.log(form.value.mates)
}
const judgeChooseTeam = (type, levelId) => {
const tmArr = ['1', '2', '3', '4', '6']
if (tmArr.indexOf(type) > -1) {
getTeammate(levelId)
} else {
const obj = {
levelId: levelId,
athleteIds: form.value.manId,
groupId: groupId,
teamId: rankId.value || ''
}
saveOne(obj)
}
}
const getTeammate = (levelId) => {
const obj = {
levelId: levelId,
groupId: groupId,
personId: form.value.manId
}
match.getCanSignLevelPerson(obj).then(res => {
mateConfig.value = res.data
teammateList.value = res.data.personList
for (const p of teammateList.value) {
p.disabled = false
if (mateConfig.value.maxMaleCount == 0 && p.sex == '1') {
p.disabled = true
}
if (mateConfig.value.maxFemaleCount == 0 && p.sex == '0') {
p.disabled = true
}
p.key = `${p.sex}_${p.id}`
p.label = `${p.realName}(${p.sexStr})`
}
getSonLevels(levelId)
mateTitle.value = `选择队友 (${teammateList.value.length})`
showMateList.value = true
form.value.mates = []
sonLevelIds = []
personal.value.sonlevel = ''
}).catch(error => {
getMyIsSign()
})
}
function getSonLevels(level) {
sonLevelList.value = []
match.querySonLevel(level).then(res => {
sonLevelList.value = res.data
})
}
let manNum = 0
let femaleNum = 0
let mates = []
const changeTeammates = (e) => {
mates = []
manNum = 0
femaleNum = 0
for (const m of e) {
const arr = m.split('_')
mates.push(arr[1])
if (personal.value.id == arr[1]) {
continue
}
if (arr[0] == '1') {
manNum++
} else {
femaleNum++
}
}
// console.log(mates, mateConfig.value)
for (const p of teammateList.value) {
if (mateConfig.value.maxMaleCount != -1 && manNum == mateConfig.value.maxMaleCount && p.sex == '1' && mates.indexOf(p.id) == -1) {
p.disabled = true
} else if (mateConfig.value.maxFemaleCount != -1 && femaleNum == mateConfig.value.maxFemaleCount && p.sex == '0' && mates.indexOf(p.id) == -1) {
p.disabled = true
} else if (mates.indexOf(p.id) == -1 && mateConfig.value.maxCount != -1 && (mates.length - 1) == mateConfig.value.maxCount) {
p.disabled = true
} else {
p.disabled = false
}
}
}
const mateClose = () => {
mates = []
form.value.mates = []
sonLevelIds = []
teammateList.value = []
getMyIsSign()
}
function chooseMateDone() {
if (mateConfig.value.minMaleCount != '-1' && mateConfig.value.minMaleCount != '0' && manNum < mateConfig.value.minMaleCount) {
ElMessage.error(`至少选择${mateConfig.value.minMaleCount}个男队友`)
return
}
if (mateConfig.value.maxMaleCount != '-1' && mateConfig.value.maxMaleCount != '0' && manNum > mateConfig.value.maxMaleCount) {
ElMessage.error(`最多选择${mateConfig.value.maxMaleCount}个男队友`)
return
}
if (mateConfig.value.minFemaleCount != '-1' && mateConfig.value.minFemaleCount != '0' && femaleNum < mateConfig.value.minFemaleCount) {
ElMessage.error(`至少选择${mateConfig.value.minFemaleCount}个女队友`)
return
}
if (mateConfig.value.maxFemaleCount != '-1' && mateConfig.value.maxFemaleCount != '0' && femaleNum > mateConfig.value.maxFemaleCount) {
ElMessage.error(`最多选择${mateConfig.value.maxFemaleCount}个女队友`)
return
}
if ((mates.length < mateConfig.value.minCount) && mateConfig.value.minCount > 0) {
ElMessage.error(`至少选择${mateConfig.value.minCount}个队友`)
return
}
const athleteIds = []
console.log('mates', mates)
for (const p of teammateList.value) {
if (mates.indexOf(p.id) != -1) {
if (sonLevelList.value.length > 0 && !p.sonlevel) {
ElMessage.error(`请分配级别`)
return
}
sonLevelIds.push(p.sonlevel)
athleteIds.push(p.id)
}
}
if (sonLevelList.value.length > 0 && !personal.value.sonlevel) {
ElMessage.error(`请分配级别`)
return
}
sonLevelIds.push(personal.value.sonlevel)
athleteIds.push(personal.value.id)
if (sonLevelList.value.length == 0) {
sonLevelIds = []
}
const obj = {
levelId: noLevelId,
athleteIds: athleteIds.toString(),
sonLevelIds: sonLevelIds.toString() || '',
groupId: groupId,
teamId: rankId.value || ''
}
// 半提交
saveOne(obj)
}
const saveOne = (obj) => {
loading.value = true
match.sportsmanDone(obj).then(res => {
if (res.msg.indexOf('Exception:') > -1) {
const msg = res.msg.slice(10)
ElMessage({
type: 'warning',
message: msg
})
// form.value.mates = []
sonLevelIds = []
getMyIsSign()
return
}
sonLevelIds = []
// form.value.mates = []
showMateList.value = false
sonLevelList.value = []
getMyIsSign()
emit('submitForm')
}).catch(err => {
// 取消这个勾
getMyIsSign()
sonLevelIds = []
})
}
function removeThis(id) {
loading.value = true
match.deleteSign(id).then(res => {
// 重新获取已报名信息
loading.value = false
emit('submitForm')
}).catch(err => {
getMyIsSign()
})
}
</script>
<style lang="scss" scoped>
.el-transfer{
--el-transfer-item-height: 70px;
--el-transfer-panel-width: 320px;
}
.transferItem{display: flex;align-items: center;
img{margin-right: 6px;}
.name{line-height: 1.6;font-size: 15px;
span{display: block;color: #999;font-size: 14px}
}
}
.optiontitle {
font-size: 14px;
padding: 0 10px;
line-height: 1;
margin: 10px 0;
border-left: 2px solid #1ab394;
}
.optionFlex {
display: flex;
align-items: center;
padding: 10px 0;
width: 200px;
.name {
margin: 0 20px;
font-size: 16px;
}
}
.el-radio-group {
width: 100%;
display: block;
}
.athleteBox {
height: 80px;
display: flex;
align-items: center;
:deep(.el-radio__label) {
display: flex;
align-items: center;
margin: 0 20px;
}
.el-radio__inner {
scale: 1.5;
}
.name {
margin: 0 20px;
font-size: 16px;
}
}
.athleteBox:hover {
background: #efefef;
}
.tip {
font-size: 13px;
color: #999;
margin: 10px 0;
i {
color: red;
margin: 0 4px 0 0;
}
}
p.title {
font-size: 16px;
margin: 0 0 15px;
}
:deep(.el-collapse-item) {
background: #FBFCFD;
margin: 0 0 16px;
padding: 0 15px;
}
:deep(.el-collapse-item__wrap) {
background: #FBFCFD;
border: none;
padding: 0 10px;
}
:deep(.el-collapse) {
border: none;
}
:deep(.el-collapse-item__header) {
border: none;
background: #ececec;
padding: 0 0 0 10px; font-size: 15px;
}
:deep(.el-collapse-item__content) {
padding-bottom: 0;
}
:deep(.el-checkbox__input.is-disabled+span.el-checkbox__label) {
color: #4C5359;
}
.fake-collapse-item {
background: #FBFCFD;
margin: 0 0 16px;
padding: 0 15px;
}
:deep(.el-checkbox.el-checkbox--large .el-checkbox__label){
font-size: 16px;
}
.teammateList :deep(.el-checkbox.el-checkbox--large) {
height: auto;
}
</style>
<template>
<el-dialog
v-model="show" destroy-on-close :title="title" width="1000px" append-to-body
:close-on-click-modal="false" @close="delWatch"
>
<el-form
ref="ruleFormRef"
label-position="top" label-width="120px" class="chooseForm" :model="form"
:rules="rules"
>
<el-row class="athletesform">
<el-col v-show="signType!=0" :span="8" style="max-height: 70vh;overflow: auto;">
<el-form-item label="可报运动员" class="athletes">
<el-radio-group v-model="form.manId" class="ml-4">
<div v-for="item in athletesList" :key="item.id" :ref="item.id" class="mb20">
<el-radio-button :label="item.id" size="large" @change="changePersonal(item)">
<div class="optionFlex">
<el-avatar v-show="item.picUrl" :size="40" :src="item.picUrl" />
<p class="name">{{ item.realName }}
<span v-show="item.sex=='0'">(女)</span>
<span v-show="item.sex=='1'">(男)</span>
</p>
</div>
</el-radio-button>
<el-button
v-if="noPhotoCanSign=='0'&&(!item.picUrl)" class="ml20" type="text"
@click="editPersonInfo(item.id,nowMan.groupId)"
>上传照片
</el-button>
</div>
</el-radio-group>
</el-form-item>
</el-col>
<el-col v-loading="loading" :span="16" style="max-height: 70vh;overflow: auto;">
<el-empty v-show="treeData.length<1" description="请选择运动员" />
<el-collapse v-for="(project,index) in treeData" :key="project.id" v-model="activeNames">
<div v-show="project.hasNext==0&&project.canSign=='1'" class="fake-collapse-item">
<el-checkbox-group v-model="form.levelId" size="large">
<el-checkbox :label="project.levelId">{{ project.name }}</el-checkbox>
</el-checkbox-group>
</div>
<el-collapse-item v-show="project.hasNext==1&&project.canSign=='1'" :title="project.name" :name="index">
<div v-for="group in project.groupList" :key="group.id">
<div v-show="group.hasNext==0">
<el-checkbox-group v-model="form.levelId" size="large">
<el-checkbox v-show="group.canSign=='1'" :label="group.levelId">{{ group.name }}</el-checkbox>
<!-- <el-checkbox v-show="group.hasNext!=0" disabled :label="group.id">{{ group.name }}</el-checkbox>-->
</el-checkbox-group>
</div>
<div v-show="group.hasNext==1">
<el-checkbox-group
v-for="level in group.levelList" :key="level.id" v-model="form.levelId"
size="large"
>
<!-- project.type判断选队友 signId删除报项 :disabled="level.canSign==0||level.belongToThisTeam==0"-->
<el-checkbox v-show="level.canSign==1" :label="level.id" :checked="level.checked">
{{ group.name }}{{ level.name }}
<span v-show="level.levelType=='1'">(男)</span>
<span v-show="level.levelType=='2'">(女)</span>
</el-checkbox>
</el-checkbox-group>
</div>
</div>
</el-collapse-item>
</el-collapse>
</el-col>
</el-row>
</el-form>
<el-dialog v-model="showMateList" title="选择队友" width="700px" draggable @close="mateClose">
<div class="mb20">
<span v-if="mateConfig.minCount!=mateConfig.maxCount">请选择{{ mateConfig.minCount }}~{{
mateConfig.maxCount
}}个队友</span>
<span v-else-if="mateConfig.minCount=='-1'&&mateConfig.maxCount=='-1'">请至少选择1个队友</span>
<span v-else>请选择{{ mateConfig.minCount }}个队友</span>
<span v-if="mateConfig.minMaleCount>0||mateConfig.maxMaleCount>0" style="margin:0 20px;">男子:
<span v-show="mateConfig.minMaleCount!=mateConfig.maxMaleCount&&mateConfig.minMaleCount!=-1"> 最少{{ mateConfig.minMaleCount }}</span>
<span v-show="mateConfig.minMaleCount!=mateConfig.maxMaleCount&&mateConfig.maxMaleCount!=-1"> 最多{{ mateConfig.maxMaleCount }}</span>
<span v-show="mateConfig.minMaleCount==mateConfig.maxMaleCount&&mateConfig.maxMaleCount!=-1">{{ mateConfig.maxMaleCount }}</span>
</span>
<span v-if="mateConfig.minFemaleCount>0||mateConfig.maxFemaleCount>0" style="margin:0 20px;">女子:
<span v-show="mateConfig.minFemaleCount!=mateConfig.maxFemaleCount&&mateConfig.minFemaleCount>0"> 最少{{ mateConfig.minFemaleCount }}</span>
<span v-show="mateConfig.minFemaleCount!=mateConfig.maxFemaleCount&&mateConfig.maxFemaleCount>0"> 最多{{ mateConfig.maxFemaleCount }}</span>
<span v-show="mateConfig.minFemaleCount==mateConfig.maxFemaleCount&&mateConfig.minFemaleCount>0">{{ mateConfig.minFemaleCount }}</span>
</span>
<span v-show="form?.mates?.length>1" style="float: right" class="text-success">已选{{ form?.mates?.length-1 }}个队友</span>
</div>
<!-- <el-button v-if="teammateList.length<minCount" type="text" @click="addTeamMate">新增队友</el-button>-->
<el-empty v-if="teammateList.length==0" description="暂无可选队友" />
<div class="teammateList" style="max-height:60vh;overflow: auto;">
<el-checkbox-group v-model="form.mates" class="ml-4" @change="changeTeammates">
<el-checkbox disabled checked :label="personal.sex+'_'+personal.id" size="large">
<div class="optionFlex" style="width: auto;">
<el-avatar v-show="personal.picUrl" :size="40" :src="personal.picUrl" />
<p class="name" style="width: 200px">{{ personal.realName }}
<span v-show="personal.sex=='0'">(女)</span>
<span v-show="personal.sex=='1'">(男)</span>
</p>
<el-select v-show="sonLevelList.length>0" v-model="personal.sonlevel" clearable>
<el-option v-for="son in sonLevelList" :value="son.id" :label="son.name">{{ son.name }}</el-option>
</el-select>
</div>
</el-checkbox>
<div v-for="(item,index) in teammateList" :key="item.id" class="mb20">
<el-checkbox :label="item.sex+'_'+item.id" size="large" :disabled="item.cantchosemate">
<div class="optionFlex" style="width: auto;">
<span>{{ index+1 }}</span>
<el-avatar v-show="item.picUrl" :size="40" :src="item.picUrl" />
<p class="name" style="width: 200px">{{ item.realName }}
<span v-if="item.sex=='0'">(女)</span>
<span v-else>(男)</span>
</p>
<el-select v-show="sonLevelList.length>0" v-model="item.sonlevel" clearable>
<el-option v-for="son in sonLevelList" :value="son.id" :label="son.name">{{ son.name }}</el-option>
</el-select>
</div>
</el-checkbox>
<el-button v-if="noPhotoCanSign=='0'&&(!item.picUrl)" class="ml20" type="text" @click="editPersonInfo(item.id,nowMan.groupId)">
上传照片
</el-button>
</div>
</el-checkbox-group>
</div>
<template #footer>
<div class="dialog-footer text-center">
<el-button type="primary" @click="chooseMateDone">确定</el-button>
</div>
</template>
</el-dialog>
<dialogPersonInfo ref="editPersonInfoRef" @submitForm="getAthletesList" />
</el-dialog>
</template>
<script setup>
import { reactive, ref, toRefs, watch } from 'vue'
import { getCurrentInstance, nextTick, onMounted } from '@vue/runtime-core'
import * as match from '@/apiPc/match'
import { ElMessage } from 'element-plus'
const { proxy } = getCurrentInstance()
const emit = defineEmits(['submitForm'])
import dialogPersonInfo from '../components/addCoach'
import _ from 'lodash'
const data = reactive({
show: false,
title: '',
signType: '',
form: {
levelId: [],
mates: []
},
athletesList: [],
signProjectList: [],
signGroupList: [],
showMateList: false,
showBtn: false,
teammateList: [],
rankId: '0',
treeData: [],
loading: false,
mateConfig: {},
noPhotoCanSign: null,
coachOrLeaderFlag: null,
personal: {},
activeNames: [0]
})
const {
signType,
form,
rules,
loading,
activeNames,
athletesList,
treeData,
show,
title,
personal,
rankId,
showMateList,
showBtn,
teammateList,
mateConfig,
noPhotoCanSign,
coachOrLeaderFlag
} = toRefs(data)
let matchId
let groupId
watch(show, (val) => {
if (!val) {
form.value = {}
treeData.value = []
delWatch()
}
})
const changePersonal = (item) => {
// delWatch()
personal.value = item
form.value.manId = item.id
getTree()
}
function getTree() {
noLevelId = ''
loading.value = true
match.getMySignListTree(matchId, form.value.manId, rankId.value).then(res => {
treeData.value = res.data
// 循环项目,组,级别 赋值是否checked
getMyIsSign()
})
}
let signOk = {}
function getMyIsSign() {
delWatch()
form.value.levelId = []
match.getMySignIds(matchId, form.value.manId, rankId.value).then(res => {
loading.value = false
signOk = res.data
for (const s of signOk) {
form.value.levelId.push(s.eid)
for (const p of treeData.value) {
if (p.levelId == s.eid) {
p.checked = true
p.signId = s.signId
p.belongToThisTeam = s.belongToThisTeam
} else {
for (const g of p.groupList) {
g.type = p.type
if (g.levelId == s.eid) {
g.checked = true
g.signId = s.signId
g.belongToThisTeam = s.belongToThisTeam
} else {
for (const l of g.levelList) {
l.type = p.type
if (s.eid == l.id) {
l.checked = true
l.signId = s.signId
l.belongToThisTeam = s.belongToThisTeam
}
}
}
}
}
}
}
if (signOk.length < 1) {
for (const p of treeData.value) {
for (const g of p.groupList) {
g.type = p.type
for (const l of g.levelList) {
l.type = p.type
}
}
}
}
addWatch()
})
}
//#region 监听叶子的数量变化
let noLevelId
let levelInfo
let watchHandle = null
function addWatch() {
delWatch()
watchHandle = watch(() => form.value.levelId, (newValue, oldValue) => {
if (!newValue) return
oldValue = _.uniq(oldValue)
newValue = _.uniq(newValue)
// console.log(newValue, oldValue)
let temp
let isAdd = false
if (newValue?.length > oldValue?.length) {
isAdd = true
temp = _.difference(newValue, oldValue)
} else {
isAdd = false
temp = _.difference(oldValue, newValue)
}
if (newValue[0] == temp[0]) {
}
if (temp.length === 1) {
levelInfo = findlevelInfo(temp[0], treeData.value, 1)
if (isAdd) {
noLevelId = temp[0]
judgeChooseTeam(levelInfo.type, temp[0])
} else {
if (!temp[0] || temp[0] == undefined) {
return
}
removeThis(levelInfo.signId)
}
}
// console.log(isAdd, temp[0])
})
}
function delWatch() {
if (watchHandle) {
watchHandle()
watchHandle = null
}
}
function findlevelInfo(id, list, deep) {
let info = null
_.some(list, (l) => {
switch (deep) {
case 1:// p
if (l.levelId == id) {
info = l
} else {
info = findlevelInfo(id, l.groupList, 2)
}
break
case 2:// g
if (l.levelId == id) {
info = l
} else {
info = findlevelInfo(id, l.levelList, 3)
}
break
case 3:// l
if (l.id == id) {
info = l
}
break
}
return info
})
return info
}
//#endregion
function getAthletesList() {
match.getMyGroupForCpt(groupId, matchId).then(res => {
athletesList.value = res.data.athletes
if (form.value.manId) {
for (const a of athletesList.value) {
if (a.id == form.value.manId) {
nowMan.value = a
}
}
}
})
}
const open = (params) => {
show.value = true
matchId = params.matchId
groupId = params.groupId
signType.value = params.signType
title.value = params.title
rankId.value = params.rankId || ''
noPhotoCanSign.value = params.noPhotoCanSign
coachOrLeaderFlag.value = params.coachOrLeaderFlag
if (params.personal) {
form.value.manId = params.personal.id
setTimeout(() => {
proxy.$refs[params.personal.id][0].scrollIntoView({ block: 'start', behavior: 'smooth' })
}, 200)
getTree()
personal.value = params.personal
}
if (groupId != 0) {
if (params.choosedList) {
athletesList.value = params.choosedList
if (form.value.manId) {
for (const a of athletesList.value) {
if (a.id == form.value.manId) {
nowMan.value = a
}
}
}
} else {
getAthletesList()
}
}
}
defineExpose({
open
})
const nowMan = ref({})
const sonLevelList = ref([])
let sonLevelIds = []
function editPersonInfo(id, groupId) {
const params = {
id: id,
groupId: groupId
}
proxy.$refs['editPersonInfoRef'].open(params)
}
function addTeamMate() {
const params = {
id: 0,
groupId: groupId
}
proxy.$refs['editPersonInfoRef'].open(params)
}
function transferChange(value, direction, movedKeys) {
console.log(value, direction, movedKeys)
}
const judgeChooseTeam = (type, levelId) => {
const tmArr = ['1', '2', '3', '4', '6']
if (tmArr.indexOf(type) > -1) {
getTeammate(levelId)
} else {
const obj = {
levelId: levelId,
athleteIds: form.value.manId,
groupId: groupId,
teamId: rankId.value || ''
}
saveOne(obj)
}
}
const getTeammate = (levelId) => {
const obj = {
levelId: levelId,
groupId: groupId,
personId: form.value.manId
}
match.getCanSignLevelPerson(obj).then(res => {
mateConfig.value = res.data
teammateList.value = res.data.personList
for (const p of teammateList.value) {
p.cantchosemate = false
if (mateConfig.value.maxMaleCount == 0 && p.sex == '1') {
p.cantchosemate = true
}
if (mateConfig.value.maxFemaleCount == 0 && p.sex == '0') {
p.cantchosemate = true
}
}
getSonLevels(levelId)
showMateList.value = true
form.value.mates = []
sonLevelIds = []
personal.value.sonlevel = ''
}).catch(error => {
getMyIsSign()
})
}
function getSonLevels(level) {
sonLevelList.value = []
match.querySonLevel(level).then(res => {
sonLevelList.value = res.data
})
}
let manNum = 0
let femaleNum = 0
let mates = []
const changeTeammates = (e) => {
mates = []
manNum = 0
femaleNum = 0
for (const m of e) {
const arr = m.split('_')
mates.push(arr[1])
if (personal.value.id == arr[1]) {
continue
}
if (arr[0] == '1') {
manNum++
} else {
femaleNum++
}
}
// console.log(mates, mateConfig.value)
for (const p of teammateList.value) {
if (mateConfig.value.maxMaleCount != -1 && manNum == mateConfig.value.maxMaleCount && p.sex == '1' && mates.indexOf(p.id) == -1) {
p.cantchosemate = true
} else if (mateConfig.value.maxFemaleCount != -1 && femaleNum == mateConfig.value.maxFemaleCount && p.sex == '0' && mates.indexOf(p.id) == -1) {
p.cantchosemate = true
} else if (mates.indexOf(p.id) == -1 && mateConfig.value.maxCount != -1 && (mates.length - 1) == mateConfig.value.maxCount) {
p.cantchosemate = true
} else {
p.cantchosemate = false
}
}
}
const mateClose = () => {
mates = []
form.value.mates = []
sonLevelIds = []
teammateList.value = []
getMyIsSign()
}
function chooseMateDone() {
if (mateConfig.value.minMaleCount != '-1' && mateConfig.value.minMaleCount != '0' && manNum < mateConfig.value.minMaleCount) {
ElMessage.error(`至少选择${mateConfig.value.minMaleCount}个男队友`)
return
}
if (mateConfig.value.maxMaleCount != '-1' && mateConfig.value.maxMaleCount != '0' && manNum > mateConfig.value.maxMaleCount) {
ElMessage.error(`最多选择${mateConfig.value.maxMaleCount}个男队友`)
return
}
if (mateConfig.value.minFemaleCount != '-1' && mateConfig.value.minFemaleCount != '0' && femaleNum < mateConfig.value.minFemaleCount) {
ElMessage.error(`至少选择${mateConfig.value.minFemaleCount}个女队友`)
return
}
if (mateConfig.value.maxFemaleCount != '-1' && mateConfig.value.maxFemaleCount != '0' && femaleNum > mateConfig.value.maxFemaleCount) {
ElMessage.error(`最多选择${mateConfig.value.maxFemaleCount}个女队友`)
return
}
if ((mates.length < mateConfig.value.minCount) && mateConfig.value.minCount > 0) {
ElMessage.error(`至少选择${mateConfig.value.minCount}个队友`)
return
}
const athleteIds = []
console.log('mates', mates)
for (const p of teammateList.value) {
if (mates.indexOf(p.id) != -1) {
if (sonLevelList.value.length > 0 && !p.sonlevel) {
ElMessage.error(`请分配级别`)
return
}
sonLevelIds.push(p.sonlevel)
athleteIds.push(p.id)
}
}
if (sonLevelList.value.length > 0 && !personal.value.sonlevel) {
ElMessage.error(`请分配级别`)
return
}
sonLevelIds.push(personal.value.sonlevel)
athleteIds.push(personal.value.id)
if (sonLevelList.value.length == 0) {
sonLevelIds = []
}
const obj = {
levelId: noLevelId,
athleteIds: athleteIds.toString(),
sonLevelIds: sonLevelIds.toString() || '',
groupId: groupId,
teamId: rankId.value || ''
}
// 半提交
saveOne(obj)
}
const saveOne = (obj) => {
loading.value = true
match.sportsmanDone(obj).then(res => {
if (res.msg.indexOf('Exception:') > -1) {
const msg = res.msg.slice(10)
ElMessage({
type: 'warning',
message: msg
})
// form.value.mates = []
sonLevelIds = []
getMyIsSign()
return
}
sonLevelIds = []
// form.value.mates = []
showMateList.value = false
sonLevelList.value = []
getMyIsSign()
emit('submitForm')
}).catch(err => {
// 取消这个勾
getMyIsSign()
sonLevelIds = []
})
}
function removeThis(id) {
loading.value = true
match.deleteSign(id).then(res => {
// 重新获取已报名信息
loading.value = false
emit('submitForm')
}).catch(err => {
getMyIsSign()
})
}
</script>
<style lang="scss" scoped>
.optiontitle {
font-size: 14px;
padding: 0 10px;
line-height: 1;
margin: 10px 0;
border-left: 2px solid #1ab394;
}
.optionFlex {
display: flex;
align-items: center;
padding: 10px 0;
width: 200px;
.name {
margin: 0 20px;
font-size: 16px;
}
}
.el-radio-group {
width: 100%;
display: block;
}
.athleteBox {
height: 80px;
display: flex;
align-items: center;
:deep(.el-radio__label) {
display: flex;
align-items: center;
margin: 0 20px;
}
.el-radio__inner {
scale: 1.5;
}
.name {
margin: 0 20px;
font-size: 16px;
}
}
.athleteBox:hover {
background: #efefef;
}
.tip {
font-size: 13px;
color: #999;
margin: 10px 0;
i {
color: red;
margin: 0 4px 0 0;
}
}
p.title {
font-size: 16px;
margin: 0 0 15px;
}
:deep(.el-collapse-item) {
background: #FBFCFD;
margin: 0 0 16px;
padding: 0 15px;
}
:deep(.el-collapse-item__wrap) {
background: #FBFCFD;
border: none;
padding: 0 10px;
}
:deep(.el-collapse) {
border: none;
}
:deep(.el-collapse-item__header) {
border: none;
background: #ececec;
padding: 0 0 0 10px; font-size: 15px;
}
:deep(.el-collapse-item__content) {
padding-bottom: 0;
}
:deep(.el-checkbox__input.is-disabled+span.el-checkbox__label) {
color: #4C5359;
}
.fake-collapse-item {
background: #FBFCFD;
margin: 0 0 16px;
padding: 0 15px;
}
:deep(.el-checkbox.el-checkbox--large .el-checkbox__label){
font-size: 16px;
}
.teammateList :deep(.el-checkbox.el-checkbox--large) {
height: auto;
}
</style>
......@@ -3,10 +3,14 @@
<div class="box">
<el-card class="mb60 mt30">
<div class="text-center mt30">
<el-icon color="#32B16C" size="80"><SuccessFilled /></el-icon>
<p class="text-success mb20">{{ language==0?'支付成功':'successfully!' }}</p>
<el-icon color="#32B16C" size="80">
<SuccessFilled/>
</el-icon>
<p class="text-success mb20">{{ language == 0 ? '支付成功' : 'successfully!' }}</p>
<el-button type="primary" class="btn-lineG mb60" @click="goBillDetail" round>{{ language==0?'返回订单详情':'Return order details' }}</el-button>
<el-button type="primary" class="btn-lineG mb60" @click="goBillDetail" round>
{{ language == 0 ? '返回订单详情' : 'Return order details' }}
</el-button>
</div>
</el-card>
</div>
......@@ -16,22 +20,24 @@
<script setup>
import {ref} from "vue";
import cache from "@/plugins/cache";
import {useRoute,useRouter} from "vue-router";
import {useRoute, useRouter} from "vue-router";
import {onMounted} from "@vue/runtime-core";
import {callbackPalPay} from "@/apiPc/match";
const route = useRoute()
const router = useRouter()
const language = ref(cache.local.get('language') || 0)
const orderId = ref(route.query.orderId)
onMounted(()=>{
callbackPalPay(route.query.orderId).then(res=>{
onMounted(() => {
callbackPalPay(route.query.orderId).then(res => {
})
})
function goBillDetail() {
router.push({
name:`signPay`,
name: `signPay`,
query: {
orderId: route.query.orderId
}
......
......@@ -131,13 +131,14 @@ const zuQuery = ref({
groupName:''
})
onMounted(()=>{
// console.log(route.query)
getSignList()
Promise.all([
getMatch(),
getSignList(),
getFee(groupId.value)
])
if(user.utype=='1'){
getMyMemberTable()
}
getMatch()
})
function getMatch() {
match.getMatchById({
......@@ -151,7 +152,6 @@ function getMyMemberTable() {
myMemberTable.value = res.rows
})
}
function getSignList() {
match.getMySignInfoList(zuQuery.value).then(res=>{
signInfoList.value = res.data.singleData
......
<template>
<div class="app-container">
<div class="box ph-30">
<div class="panel">
<div class="panel-header">
<h3 class="panel-title">填写报名信息</h3>
</div>
<div class="panel-body">
<el-form ref="ruleFormRef" label-width="120px" class="signForm" :model="form" :rules="rules">
<el-row>
<el-col :span="8" :offset="2">
<el-form-item label="照片" prop="picUrl">
<ImageUpload v-model="form.picUrl" class="threeFour" :limit="1" :is-show-tip="false" />
<span class="tip"><i>*</i>请上传近期 彩色免冠照片</span>
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="姓名" prop="realName">
<el-input v-model="form.realName" placeholder="请输入姓名" />
</el-form-item>
<el-form-item label="证件类型" prop="idcType">
<el-select v-model="form.idcType" placeholder="请选择证件类型">
<el-option
v-for="item in certificates"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="证件号码" prop="idcCode">
<el-input v-model="form.idcCode" placeholder="请输入证件号码" @blur="checkCode" />
</el-form-item>
<el-form-item label="性别" prop="sex">
<el-radio-group v-model="form.sex">
<el-radio label="1" size="large"></el-radio>
<el-radio label="0" size="large"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="出生日期" prop="birth">
<el-date-picker
v-model="form.birth"
type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
placeholder="请选择出生日期"
/>
</el-form-item>
<el-form-item label="联系方式" prop="phone">
<el-input v-model="form.phone" placeholder="请输入联系方式" />
</el-form-item>
<el-form-item label="国籍" prop="countryId">
<el-select v-model="form.countryId" class="m-2" @change="changeCountryId">
<el-option v-for="item in countryList" :key="item.id" :label="language==0?item.name:item.enName" :value="item.id" />
</el-select>
</el-form-item>
<el-form-item label="民族" prop="nation">
<el-select v-model="form.nation" style="width: 100%;">
<el-option
v-for="item in nationList"
:key="item.name"
:label="item.name"
:value="item.name"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-row v-if="participantsInfoArr&&participantsInfoArr.length>0">
<el-col :span="16" :offset="4">
<el-form label-width="120px">
<h3>补充信息</h3>
<el-form-item v-for="(s,index) in participantsInfoArr" :key="index">
<template #label>
<span v-if="s.status == 0" class="red">*</span>{{ s.name }}
</template>
<el-input v-if="s.type == '0'" v-model="s.value" />
<el-input v-if="s.type == '1'" v-model="s.value" type="number" />
<el-select v-if="s.type == '4'" v-model="s.value" class="m-2">
<el-option v-for="item in s.option" :key="item.id" :label="item.name" :value="item.name" />
</el-select>
<ImageUpload
v-if="s.type == '3'" v-model="s.value" :limit="1"
:is-show-tip="false"
/>
<!-- 文件 2-->
<FileUpload v-if="s.type == '2'" v-model="s.fixWxFile" :action="uploadUrl" />
</el-form-item>
</el-form>
</el-col>
</el-row>
</div>
<div class="panel-footer text-center">
<el-button type="danger" plain round @click="goPrev()">上一步</el-button>
<el-button v-if="personId!='0'" type="success" round @click="goBack()">完成</el-button>
<el-button v-else type="danger" round @click="submitForm()">下一步</el-button>
</div>
</div>
</div>
</div>
</template>
<script setup>
import { reactive } from 'vue'
import { getCurrentInstance, onMounted } from '@vue/runtime-core'
import * as match from '@/apiPc/match'
import { toRefs } from '@vueuse/shared'
import { useRouter } from 'vue-router'
import { ElMessage } from 'element-plus'
const uploadUrl = ref('/upload/upLoadToFileServer')
const { proxy } = getCurrentInstance()
const router = useRouter()
const route = useRoute()
import { nationList } from '@/assets/js/data'
const data = reactive({
form: {
idcType: 0,
countryId: 240,
nation: '汉族'
},
rules: {
// picUrl: { required: true, message: '请上传您的照片', trigger: 'blur' },
// idcFrontImg: { required: true, message: '请上传身份证正面', trigger: 'blur' },
// idcBackImg: { required: true, message: '请上传身份证反面', trigger: 'blur' },
realName: { required: true, message: '请填写您的姓名', trigger: 'blur' },
sex: { required: true, message: '请选择您的性别', trigger: 'change' },
birth: { required: true, message: '请填写您的生日', trigger: 'blur' },
idcType: { required: true, message: '请选择您的证件', trigger: 'change' },
idcCode: { required: true, message: '请填写您的证件号', trigger: 'blur' }
// phone: { required: true, message: '请填写您的联系方式', trigger: 'blur' }
},
certificates: [
{
value: '0',
label: '居民身份证'
},
{
value: '1',
label: '护照'
},
{
value: '2',
label: '其他'
}
],
participantsInfoArr: [],
noPhotoCanSign: '',
countryList: [],
personId: '0'
})
const {
form, rules, certificates, participantsInfoArr, noPhotoCanSign, countryList, personId
} = toRefs(data)
let matchId = ''
const extraId = ''
onMounted(() => {
const params = route.params
const query = route.query
matchId = params.id
// 获取赛事详情
init(matchId)
getCountryList()
})
let coachOrLeaderFlag
function init(matchId) {
match.getMatchById({ id: matchId }).then(res => {
coachOrLeaderFlag = res.data.coachOrLeaderFlag
noPhotoCanSign.value = res.data.noPhotoCanSign
if (res.data.participantsInfo) {
participantsInfoArr.value = JSON.parse(res.data.participantsInfo)
}
match.getMyPersonInfoWithcptId(matchId).then(res => {
form.value = res.data
if (res.data.cptPersonInfo?.personInfo) {
// 补充字段信息
participantsInfoArr.value = JSON.parse(form.value.cptPersonInfo.personInfo)
for (var n of participantsInfoArr.value) {
if (n.type == '3' && n.value.url) {
// 图片
n.value = n.value.url
}
if (n.type == '2') {
// 文件
var arr = [{
name: n.value.name,
url: n.value.url
}]
n.fixWxFile = arr
}
}
}
})
})
}
function getCountryList() {
match.countryList().then(res => {
countryList.value = res.data
})
}
function goBack() {
let fileInfo = {}
for (const n of participantsInfoArr.value) {
if (n.status == 0 && (!n.value && !n.fixWxFile)) {
ElMessage.error('请完善必填字段')
return
}
if (n.type == '2') {
const temp = n.fixWxFile[0].name.split('.')
fileInfo = {
url: n.fixWxFile[0].url,
name: n.fixWxFile[0].name,
extname: temp[temp.length - 1]
}
n.value = fileInfo
}
}
let obj = {}
if (extraId != '0') { // 修改
obj = {
cptId: matchId,
personId: form.value.id,
id: extraId,
personInfo: JSON.stringify(participantsInfoArr.value)
}
} else { // 没填过
obj = {
cptId: matchId,
personId: form.value.id,
personInfo: JSON.stringify(participantsInfoArr.value)
}
}
match.saveSupplementInfo(obj).then(res => {
// 返回
router.go(-1)
})
}
function goPrev() {
router.go(-1)
}
function changeCountryId() {
if (form.value.countryId != 240) {
form.value.nation = '其他'
}
}
function checkCode() {
if (form.value.idcType == 0 && form.value.idcCode) {
if (!(/(^\d{15}$)|(^\d{17}([0-9]|X)$)/.test(form.value.idcCode))) {
ElMessage.error('请输入正确的身份证号码')
} else {
let tmpStr = ''
if (form.value.idcCode.length == 15) {
tmpStr = form.value.idcCode.substring(6, 12)
tmpStr = '19' + tmpStr
tmpStr = tmpStr.substring(0, 4) + '-' + tmpStr.substring(4, 6) + '-' + tmpStr.substring(6)
} else {
tmpStr = form.value.idcCode.substring(6, 14)
tmpStr = tmpStr.substring(0, 4) + '-' + tmpStr.substring(4, 6) + '-' + tmpStr.substring(6)
}
form.value.birth = tmpStr
const res = /^(\d{6})(\d{4})(\d{2})(\d{2})(\d{3})([0-9]|X)$/
if (form.value.idcCode && res.test(form.value.idcCode)) {
const genderCode = form.value.idcCode.charAt(16)
if (parseInt(genderCode) % 2 == 0) {
form.value.sex = '0'
} else {
form.value.sex = '1'
}
}
}
}
}
function submitForm() {
proxy.$refs['ruleFormRef'].validate((valid, fields) => {
if (valid) {
// var pattern = /^1[345789]\d{9}$/
// if (!pattern.test(form.value.phone)) {
// ElMessage.error('请输入正确的手机号')
// return
// }
if (form.value.idcType == 0 && !(/(^\d{15}$)|(^\d{17}([0-9]|X)$)/.test(form.value.idcCode))) {
ElMessage.error('请输入正确的身份证号码')
return
}
// 验证补充信息必填
for (const n of participantsInfoArr.value) {
if (n.status == 0 && (!n.value && !n.fixWxFile)) {
ElMessage.error(`请完善${n.name}信息`)
return
}
}
if (participantsInfoArr.value) {
let fileInfo = {}
for (var p of participantsInfoArr.value) {
if (p.type == '2' && p.fixWxFile) {
const temp = p.fixWxFile[0].name.split('.')
fileInfo = {
url: p.fixWxFile[0].url,
name: p.fixWxFile[0].name,
extname: temp[temp.length - 1]
}
p.value = fileInfo
}
}
}
let obj = {}
if (form.value.cptPersonInfo == null) {
obj = {
cptId: matchId,
personId: form.value.id,
personInfo: JSON.stringify(participantsInfoArr.value)
}
} else {
obj = {
cptId: matchId,
id: form.value.cptPersonInfo.id,
personId: form.value.id,
personInfo: JSON.stringify(participantsInfoArr.value)
}
}
form.value.label = '0'
match.saveMyBaseInfo(form.value).then(res => {
obj.personId = res.data
match.saveSupplementInfo(obj).then(res2 => {
if (coachOrLeaderFlag == '0') {
// 不选教练 去选项目
router.push({
path: `chooseProject`,
query: {
matchId: matchId
}
})
} else {
router.push({
path: `chooseCoach`,
query: {
matchId: matchId,
signType: '0'
}
})
}
})
})
} else {
console.log(form.value, fields)
}
})
}
</script>
<style scoped lang="scss">
.app-container {
padding: 0;
background: #F5F7F9;
}
.panel-footer .el-button--danger {
padding: 0 40px;
}
.signForm {
.el-form-item__label {
color: #4C5359;
}
}
.tip {
font-size: 13px;
color: #999;
margin: 10px 0;
i {
color: red;
margin: 0 4px 0 0;
}
}
.threeFour {
width: 100%;
}
:deep(.el-upload--picture-card) {
width: 120px;
height: 160px;
}
:deep(.el-upload-list--picture-card .el-upload-list__item) {
width: 120px;
height: 160px;
}
.red {
color: #f56c6c;
}
</style>
......@@ -15,7 +15,7 @@
<el-row>
<el-col :lg="8" :offset="2">
<el-form-item :label="language==0?'团体Logo':'Group Logo'" prop="imgUrl">
<ImageUpload2 v-model="form.imgUrl" :crop-width="200" :crop-height="200" :limit="1"/>
<ImageUpload2 v-model="form.imgUrl" :is-show-tip="false" :crop-width="200" :crop-height="200" :limit="1"/>
<span class="tip" v-if="language==0">请上传不超过 <i>5M</i> 的文件 格式为 <i>png/jpg/jpeg</i> 的文件</span>
<span class="tip" v-else>Please upload a file in the format of
<i>png/jpg/jpeg</i> that does not exceed <i>5MB</i>
......@@ -30,10 +30,10 @@
<el-input v-model="form.name" :placeholder="language==0?'请输入团体名称':''" />
</el-form-item>
<el-form-item :label="language==0?'负责人姓名':'Contact Person'" prop="contactPerson">
<el-input v-model="form.contactPerson" placeholder="请输入联系人" />
<el-input v-model="form.contactPerson" :placeholder="language==0?'请输入联系人':''" />
</el-form-item>
<el-form-item :label="language==0?'邮箱':'Email'" required prop="contactEmail">
<el-input v-model="form.contactEmail" type="email" placeholder="请输入内容"/>
<el-input v-model="form.contactEmail" type="email" :placeholder="language==0?'请输入内容':''"/>
</el-form-item>
<el-form-item :label="language==0?'团体类型':'Group type'" prop="type">
<el-select v-model="form.type" :placeholder="language==0?'请选择团体类型':''" style="width: 100%;">
......@@ -45,7 +45,7 @@
</el-select>
</el-form-item>
<el-form-item :label="language==0?'详细地址':'Detailed Address'" required prop="address">
<el-input type="textarea" v-model="form.address" class="mt10" placeholder="请输入详细地址"/>
<el-input type="textarea" v-model="form.address" class="mt10" :placeholder="language==0?'请输入详细地址':''"/>
</el-form-item>
......@@ -66,7 +66,7 @@
</el-select>
<ImageUpload v-if="s.type == '3'" v-model="s.value" :limit="1" :is-show-tip="false" />
<!-- 文件 2-->
<FileUpload v-if="s.type == '2'" v-model="s.fixWxFile" :action="uploadUrl" :accept="accept" />
<FileUpload v-if="s.type == '2'" :button-text="language==0?'上传文件':'Upload file'" :is-show-tip="false" v-model="s.fixWxFile" :action="uploadUrl" :accept="accept" />
</el-form-item>
</el-col>
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!