parent
e8672494e4
commit
f0e037809e
7 changed files with 194 additions and 134 deletions
@ -1,109 +1,141 @@ |
|||||||
<template> |
<template> |
||||||
<!-- 报名人员 --> |
<!-- 报名人员 --> |
||||||
<div class="page-content" style="padding: 24px"> |
<div class="page-content" |
||||||
<el-collapse v-model="curStep"> |
style="padding: 24px"> |
||||||
<el-collapse-item v-for="(item, i) in list" :key="i" :title="item.stageName" :name="item.stageId"> |
<el-table ref="table" |
||||||
<div class="line"> |
:data="list" |
||||||
<span>比赛方式：{{ item.methodName }}</span> |
class="table" |
||||||
<span>比赛形式：{{ item.competitionType ? '团队赛' : '个人赛' }}</span> |
stripe |
||||||
<span>赛制：{{ item.ruleName }}</span> |
header-align="center" |
||||||
<span>状态：{{ item.status }}</span> |
row-key="stageId"> |
||||||
<span>竞赛起止时间：{{ item.startTime + ' ~ ' + item.endTime }}</span> |
<el-table-column type="index" |
||||||
<div> |
width="60" |
||||||
<el-button type="primary" @click="toRank(item, i)">排名</el-button> |
label="序号" |
||||||
<el-button @click="toArch(item)">成绩管理</el-button> |
align="center"> |
||||||
</div> |
<template slot-scope="scope"> |
||||||
</div> |
{{ scope.$index + 1 }} |
||||||
</el-collapse-item> |
</template> |
||||||
</el-collapse> |
</el-table-column> |
||||||
</div> |
<el-table-column prop="methodName" |
||||||
|
label="比赛方式" |
||||||
|
align="center"></el-table-column> |
||||||
|
<el-table-column prop="founderName" |
||||||
|
label="比赛形式" |
||||||
|
align="center"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
{{ scope.row.competitionType ? '团队赛' : '个人赛' }} |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="ruleName" |
||||||
|
label="赛制" |
||||||
|
align="center"></el-table-column> |
||||||
|
<el-table-column prop="status" |
||||||
|
label="状态" |
||||||
|
align="center"></el-table-column> |
||||||
|
<el-table-column label="竞赛起止时间" |
||||||
|
align="center"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
{{ scope.row.startTime + ' ~ ' + scope.row.endTime }} |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="操作" |
||||||
|
align="center" |
||||||
|
width="260"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
<el-button type="primary" |
||||||
|
@click="toRank(scope.row, scope.$index)">排名</el-button> |
||||||
|
<el-button @click="toArch(scope.row)">成绩管理</el-button> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
</el-table> |
||||||
|
</div> |
||||||
</template> |
</template> |
||||||
|
|
||||||
<script> |
<script> |
||||||
import util from "@/libs/util"; |
import util from "@/libs/util"; |
||||||
import Const from '@/const/match' |
import Const from '@/const/match' |
||||||
export default { |
export default { |
||||||
name: "matchArch", |
name: "matchArch", |
||||||
data() { |
data () { |
||||||
return { |
return { |
||||||
id: +this.$route.query.id, |
id: +this.$route.query.id, |
||||||
list: [], |
list: [], |
||||||
form: {}, |
form: {}, |
||||||
timer: null, |
timer: null, |
||||||
curStep: [], |
curStep: [], |
||||||
}; |
}; |
||||||
|
}, |
||||||
|
mounted () { |
||||||
|
this.$once('hook:beforeDestroy', function () { |
||||||
|
clearInterval(this.timer) |
||||||
|
}) |
||||||
|
this.getData() |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
getData () { |
||||||
|
this.$post(`${this.api.getCompetition}?competitionId=${this.id}`).then(({ competition }) => { |
||||||
|
this.form = competition |
||||||
|
this.timer = setInterval(this.handleStatus, 1000) |
||||||
|
this.getArch() |
||||||
|
}).catch(err => { }) |
||||||
}, |
}, |
||||||
mounted() { |
getArch () { |
||||||
this.$once('hook:beforeDestroy', function() { |
this.$post(this.api.detailsOfCompetitionStage, { |
||||||
clearInterval(this.timer) |
pageNum: 1, |
||||||
}) |
pageSize: 100, |
||||||
this.getData() |
contestId: this.id, |
||||||
|
}).then(({ page, applicantSize }) => { |
||||||
|
const list = page.records |
||||||
|
list.map(e => { |
||||||
|
e.methodName = Const.methods.find(n => n.id === e.method).name |
||||||
|
e.ruleName = Const.rules.find(n => n.id === e.rule).name |
||||||
|
}) |
||||||
|
this.curStep = list.map(e => e.stageId) |
||||||
|
this.list = list |
||||||
|
}).catch(res => { }); |
||||||
}, |
}, |
||||||
methods: { |
// 报名时间、比赛时间、状态处理 |
||||||
getData() { |
handleStatus () { |
||||||
this.$post(`${this.api.getCompetition}?competitionId=${this.id}`).then(({ competition }) => { |
const now = new Date() |
||||||
this.form = competition |
this.form.competitionStage.map(e => { |
||||||
this.timer = setInterval(this.handleStatus, 1000) |
const startTime = new Date(e.startTime) |
||||||
this.getArch() |
const endTime = new Date(e.endTime) |
||||||
}).catch(err => {}) |
const item = this.list.find(n => n.stageId == e.stageId) |
||||||
}, |
if (item) { |
||||||
getArch() { |
if (now < startTime) { |
||||||
this.$post(this.api.detailsOfCompetitionStage, { |
this.$set(item, 'status', '未开始') |
||||||
pageNum: 1, |
} else if (now >= startTime && now <= endTime) { |
||||||
pageSize: 100, |
this.$set(item, 'status', '比赛中') |
||||||
contestId: this.id, |
} else if (now > endTime) { |
||||||
}).then(({ page, applicantSize }) => { |
this.$set(item, 'status', '已完成') |
||||||
const list = page.records |
|
||||||
list.map(e => { |
|
||||||
e.methodName = Const.methods.find(n => n.id === e.method).name |
|
||||||
e.ruleName = Const.rules.find(n => n.id === e.rule).name |
|
||||||
}) |
|
||||||
this.curStep = list.map(e => e.stageId) |
|
||||||
this.list = list |
|
||||||
}).catch(res => {}); |
|
||||||
}, |
|
||||||
// 报名时间、比赛时间、状态处理 |
|
||||||
handleStatus() { |
|
||||||
const now = new Date() |
|
||||||
this.form.competitionStage.map(e => { |
|
||||||
const startTime = new Date(e.startTime) |
|
||||||
const endTime = new Date(e.endTime) |
|
||||||
const item = this.list.find(n => n.stageId == e.stageId) |
|
||||||
if (item) { |
|
||||||
if (now < startTime) { |
|
||||||
this.$set(item, 'status', '未开始') |
|
||||||
} else if (now >= startTime && now <= endTime) { |
|
||||||
this.$set(item, 'status', '比赛中') |
|
||||||
} else if (now > endTime) { |
|
||||||
this.$set(item, 'status', '已完成') |
|
||||||
} |
|
||||||
} |
} |
||||||
}) |
} |
||||||
console.log("🚀 ~ file: matchArch.vue:87 ~ handleStatus ~ this.status", this.list) |
}) |
||||||
}, |
console.log("🚀 ~ file: matchArch.vue:87 ~ handleStatus ~ this.status", this.list) |
||||||
// 排名 |
}, |
||||||
toRank(row, i) { |
// 排名 |
||||||
this.$router.push(`/matchRank?id=${this.id}&stageId=${row.stageId}&index=${i}&method=${row.method}&competitionType=${row.competitionType}&rule=${row.rule}`) |
toRank (row, i) { |
||||||
}, |
this.$router.push(`/matchRank?id=${this.id}&stageId=${row.stageId}&index=${i}&method=${row.method}&competitionType=${row.competitionType}&rule=${row.rule}`) |
||||||
// 成绩管理 |
}, |
||||||
toArch(row) { |
// 成绩管理 |
||||||
this.$router.push(`/matchArchList?id=${this.id}&stageId=${row.stageId}&method=${row.method}&competitionType=${row.competitionType}`) |
toArch (row) { |
||||||
} |
this.$router.push(`/matchArchList?id=${this.id}&stageId=${row.stageId}&method=${row.method}&competitionType=${row.competitionType}`) |
||||||
} |
} |
||||||
|
} |
||||||
}; |
}; |
||||||
</script> |
</script> |
||||||
|
|
||||||
<style lang="scss" scoped> |
<style lang="scss" scoped> |
||||||
/deep/.el-collapse-item__header { |
/deep/.el-collapse-item__header { |
||||||
font-size: 16px; |
font-size: 16px; |
||||||
color: #333; |
color: #333; |
||||||
} |
} |
||||||
.line { |
.line { |
||||||
display: flex; |
display: flex; |
||||||
justify-content: space-around; |
justify-content: space-around; |
||||||
align-items: center; |
align-items: center; |
||||||
span { |
span { |
||||||
margin-right: 30px; |
margin-right: 30px; |
||||||
} |
} |
||||||
} |
} |
||||||
</style> |
</style> |
||||||
Loading…
Reference in new issue