parent
121b50bc31
commit
edacc49466
15 changed files with 508 additions and 136 deletions
@ -0,0 +1,53 @@ |
|||||||
|
<template> |
||||||
|
<div class="wrap"> |
||||||
|
<div class="modal"> |
||||||
|
<el-steps :space="200" :active="4" finish-status="success"> |
||||||
|
<el-step title="大赛信息填写"></el-step> |
||||||
|
<el-step title="赛程与规则设置"></el-step> |
||||||
|
<el-step title="比赛内容设置"></el-step> |
||||||
|
<el-step title="发布"></el-step> |
||||||
|
</el-steps> |
||||||
|
<h1>大赛已发布！</h1> |
||||||
|
<div class="btns"> |
||||||
|
<el-button type="primary" @click="back">确定</el-button> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
|
||||||
|
}; |
||||||
|
}, |
||||||
|
mounted() { |
||||||
|
|
||||||
|
}, |
||||||
|
methods: { |
||||||
|
back() { |
||||||
|
this.$router.push(`/match?page=${this.$store.state.matchPage}`) |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped lang="scss"> |
||||||
|
.wrap { |
||||||
|
height: calc(100vh - 300px); |
||||||
|
background-color: #fefefe; |
||||||
|
} |
||||||
|
.modal { |
||||||
|
width: 500px; |
||||||
|
padding-top: 150px; |
||||||
|
margin: 0 auto ; |
||||||
|
h1 { |
||||||
|
margin: 20px; |
||||||
|
text-align: center; |
||||||
|
} |
||||||
|
.btns { |
||||||
|
text-align: center; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,118 @@ |
|||||||
|
<template> |
||||||
|
<!-- 报名人员 --> |
||||||
|
<div class="page-content" style="padding: 24px"> |
||||||
|
<el-collapse v-model="curStep" accordion> |
||||||
|
<el-collapse-item title="一致性 Consistency" :name="1"> |
||||||
|
<div>与现实生活一致：与现实生活的流程、逻辑保持一致，遵循用户习惯的语言和概念；</div> |
||||||
|
<div>在界面中一致：所有的元素和结构需保持一致，比如：设计样式、图标和文本、元素的位置等。</div> |
||||||
|
</el-collapse-item> |
||||||
|
<el-collapse-item title="反馈 Feedback" :name="2"> |
||||||
|
<div>控制反馈：通过界面样式和交互动效让用户可以清晰的感知自己的操作；</div> |
||||||
|
<div>页面反馈：操作后，通过页面元素的变化清晰地展现当前状态。</div> |
||||||
|
</el-collapse-item> |
||||||
|
<el-collapse-item title="效率 Efficiency" :name="3"> |
||||||
|
<div>简化流程：设计简洁直观的操作流程；</div> |
||||||
|
<div>清晰明确：语言表达清晰且表意明确，让用户快速理解进而作出决策；</div> |
||||||
|
<div>帮助用户识别：界面简单直白，让用户快速识别而非回忆，减少用户记忆负担。</div> |
||||||
|
</el-collapse-item> |
||||||
|
</el-collapse> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import util from "@/libs/util"; |
||||||
|
import axios from 'axios' |
||||||
|
|
||||||
|
export default { |
||||||
|
name: "matchArch", |
||||||
|
data() { |
||||||
|
return { |
||||||
|
curStep: 1 |
||||||
|
}; |
||||||
|
}, |
||||||
|
watch: { |
||||||
|
keyword: function(val) { |
||||||
|
clearTimeout(this.searchTimer); |
||||||
|
this.searchTimer = setTimeout(() => { |
||||||
|
this.getData(); |
||||||
|
}, 500); |
||||||
|
} |
||||||
|
}, |
||||||
|
mounted() { |
||||||
|
// this.getData(); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
getData() { |
||||||
|
this.$post(this.api.queryApplicantByCondition, { |
||||||
|
pageNum: this.page, |
||||||
|
pageSize: this.pageSize, |
||||||
|
contestId: this.id, |
||||||
|
keyWord: this.keyword, |
||||||
|
}).then(({ data }) => { |
||||||
|
this.listData = data.records; |
||||||
|
this.totals = data.total; |
||||||
|
this.$refs.table.clearSelection(); |
||||||
|
}).catch(res => { |
||||||
|
}); |
||||||
|
}, |
||||||
|
handleSelectionChange(val) { |
||||||
|
this.multipleSelection = val; |
||||||
|
}, |
||||||
|
handleCurrentChange(val) { |
||||||
|
this.page = val; |
||||||
|
this.getData(); |
||||||
|
}, |
||||||
|
switchOff(val, row, index) { |
||||||
|
this.$put(`${this.api.disableApplicant}/${row.id}/${val}`) |
||||||
|
.then(res => { |
||||||
|
}) |
||||||
|
.catch(err => { |
||||||
|
}); |
||||||
|
}, |
||||||
|
disalbeAllData() { |
||||||
|
if (this.multipleSelection.length != "") { |
||||||
|
let newArr = this.multipleSelection; |
||||||
|
let delList = newArr.map(item => { |
||||||
|
return item.id; |
||||||
|
}); |
||||||
|
|
||||||
|
this.$confirm("确定要禁用吗？", "提示", { |
||||||
|
type: "warning" |
||||||
|
}) |
||||||
|
.then(() => { |
||||||
|
this.$put(`${this.api.disableContests}?ids=${delList.join(",")}`).then(res => { |
||||||
|
this.multipleSelection = []; |
||||||
|
util.successMsg("禁用成功"); |
||||||
|
this.getData(); |
||||||
|
}).catch(res => { |
||||||
|
}); |
||||||
|
}) |
||||||
|
.catch(() => { |
||||||
|
}); |
||||||
|
} else { |
||||||
|
util.errorMsg("请先选择数据 ！"); |
||||||
|
} |
||||||
|
}, |
||||||
|
exportAll() { |
||||||
|
const data = this.multipleSelection |
||||||
|
if (data.length) { |
||||||
|
data.map((e, i) => e.id = i + 1) |
||||||
|
axios.post(this.api.exportDataInBatches, data, { |
||||||
|
headers: { |
||||||
|
token: this.token |
||||||
|
}, |
||||||
|
responseType: 'blob' |
||||||
|
}).then((res) => { |
||||||
|
util.downloadFileDirect(`报名人员.xls`, new Blob([res.data])) |
||||||
|
}).catch(res => {}) |
||||||
|
} else { |
||||||
|
location.href = `${this.api.excelExport}?contestId=${this.id}` |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
|
||||||
|
</style> |
||||||
Loading…
Reference in new issue