跳绳比赛远程报名系统
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

320 lines
6.9 KiB

<template>
<view>
<ms-dropdown-menu v-show="showms - 0 === 0" class="select">
<ms-dropdown-item v-model="value" :list="list"></ms-dropdown-item>
<ms-dropdown-item v-model="value1" :list="list1"></ms-dropdown-item>
</ms-dropdown-menu>
<!-- <button type="default" @click="btn">123</button> -->
<view class="player-box">
<view class="player" :class="item.joinProject?'player-active':''" v-for="(item,index) in list2" :key="index" @click="choice(index)">
<icon type="icon" :class="item.joinProject?'backactive':''" class="cuIcon-roundcheckfill back"></icon>
{{ item.playerName }}
</view>
</view>
<button v-show="list2[0]" class="modify mit" type="default" @click="editData">
<!-- <text v-if="edit - 0 === 0">编辑</text> -->
<text>提交</text>
</button>
<view v-show="!list2[0]" class="img-B">
<img src="static/item.png" class="img-box" />
<view>
暂无报名信息
</view>
</view>
</view>
</template>
<script>
import msDropdownMenu from '@/components/ms-dropdown/dropdown-menu.vue'
import msDropdownItem from '@/components/ms-dropdown/dropdown-item.vue'
import { rulePlayer } from 'api/rulePlayer'
import { join } from 'api/join'
export default {
components: {
msDropdownMenu,
msDropdownItem
},
onLoad(option) {
const that = this
that.obj = JSON.parse(option.obj)
that.showms = that.obj.joinRule
if (option.groupRemark) {
// console.log('1')
that.value = option.groupRemark - 0 - 1
that.value1 = option.gender - 0
that.query()
} else {
// console.log('2')
that.query()
}
// console.log(that.obj,option)
},
data() {
return {
showms: 1,
obj:{},
list: [
{
text: '小学',
value: 0
},
{
text: '中学',
value: 1
},
{
text: '高职院校',
value: 2
},
{
text: '本科院校',
value: 3
},
{
text: '俱乐部',
value: 4
}
],
list1: [
{
text: '女子组',
value: 0
},
{
text: '男子组',
value: 1
},
{
text: '混合组',
value: 2
}
],
list2: [],
value: 0,
value1: 0,
edit: 0,
joinNum:0
}
},
methods: {
choose() {
const that = this
let obj = {
value: 'test'
}
this.$refs.dropdownItem.choose(obj)
},
close() {
this.$refs.dropdownItem.closePopup()
},
async editData() {
const that = this
// if(that.edit - 0 === 0) {
// that.edit = 1
// } else {
if (that.joinNum < that.obj.memberMin && that.joinNum > 0) {
uni.showToast({
title:`小于最少人数${that.obj.memberMin}`,
icon: 'none',
duration: 1500
})
} else if (that.joinNum > that.obj.memberMax) {
uni.showToast({
title:`大于最多人数${that.obj.memberMin}`,
icon: 'none',
duration: 1500
})
} else {
try{
var params = {}
if(that.obj.joinRule - 0 === 0) {
params = {
param:{
companyId: that.$store.state.project.companyId,
competeTimeId: that.$store.state.project.data.id,
gender: that.value1,
groupRemark: that.value - 0 + 1,
projectId: that.obj.id,
players: that.list2
}
}
} else {
params = {
param:{
companyId: that.$store.state.project.companyId,
competeTimeId: that.$store.state.project.data.id,
projectId: that.obj.id,
players: that.list2
}
}
}
const data = await join(params)
if (that.joinNum - 0 === 0) {
uni.showToast({
title: '取消成功',
icon: 'success',
duration: 1500
})
} else {
uni.showToast({
title: '报名成功',
icon: 'success',
duration: 1500
})
}
that.$store.state.project.Mat++
setTimeout(function(){
uni.navigateBack()
},1000)
// console.log(that.$store.state)
}catch(e){
//TODO handle the exception
if (e === 'error') {
uni.showToast({
title: '提交失败',
icon: 'none',
duration: 1500
})
} else {
uni.showToast({
title: e,
icon: 'none',
duration: 1500
})
}
}
}
// }
},
choice(index) {
const that = this
that.joinNum = 0
if(that.list2[`${index}`].joinProject - 0 === 0) {
that.list2[`${index}`].joinProject = 1
} else {
that.list2[`${index}`].joinProject = 0
}
for(var i=0; i<that.list2.length;i++) {
if(that.list2[i].joinProject - 0 === 1) {
that.joinNum++
}
}
// console.log(that.joinNum)
},
async query() {
const that = this
// console.log('xxx')
try{
var params = {}
if (that.obj.joinRule) {
params = {
param: {
companyId: that.$store.state.project.companyId,
projectId: that.obj.id
}
}
} else {
params = {
param: {
companyId: that.$store.state.project.companyId,
gender: that.value1,
groupRemark: that.value - 0 + 1,
projectId: that.obj.id
}
}
}
const data = await rulePlayer(params)
that.list2 = []
if (that.obj.joinRule - 0 === 0 && that.value1 - 0 !== 2) {
that.list2 = data[0].playerList
} else if (that.obj.joinRule - 0 === 0 && that.value1 - 0 === 2) {
// console.log(data)
for (var i=0;i<data.length;i++) {
that.list2 = that.list2.concat(data[i].playerList)
}
// console.log(that.list2)
} else if (that.obj.joinRule - 0 === 1) {
for (var i=0;i<data.length;i++) {
that.list2 = that.list2.concat(data[i].playerList)
}
}
// console.log(that.list2)
}catch(e){
//TODO handle the exception
console.log(e)
}
}
},
watch:{
value(val){
const that = this
that.list2 = []
that.query()
},
value1(val){
const that = this
that.list2 = []
that.query()
}
}
}
</script>
<style lang="scss" scoped>
.select {
position: fixed;
z-index: 10;
top: 44px;
width: 750rpx !important;
box-shadow: 0 2px 10px #aaa;
margin-bottom: 20px;
}
.player-box {
width: 670rpx;
margin-top: 70px;
margin-left: 35rpx;
}
.player {
position: relative;
height: 60px;
margin-top: 10px;
line-height: 60px;
border-radius: 10px;
text-align: center;
box-shadow: 0 0 5px $gray;
}
.player-active{
box-shadow: 0 0 4px #709AFC !important;
}
.back {
position: absolute;
color: $grey;
font-size: 30px;
left: 20px;
}
.backactive {
color: #709AFC !important;
}
.modify {
width: 670rpx;
margin-left: 35rpx;
margin-top: 50px;
box-shadow: 2px 2px 5px #C0C0C0;
margin-bottom: 100px;
}
.mit {
background: $blue;
color: $white;
}
.img-box {
width: 70%;
height: 70%;
}
.img-B {
width: 100%;
margin-top: 100px;
height: 450rpx;
text-align: center;
color: #aaa;
}
</style>