Compare commits
No commits in common. '2c0b3433f82deff385d95c23648df679534a121a' and '23215471f1e81b150ccbcd30c112fce122105f68' have entirely different histories.
2c0b3433f8
...
23215471f1
@ -1,371 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1"/>
|
|
||||||
<title>夏令营报名</title>
|
|
||||||
<script src="/vue.min.js"></script>
|
|
||||||
<script src="/axios.min.js"></script>
|
|
||||||
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
|
|
||||||
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
|
|
||||||
<link rel="stylesheet" type="text/css" href="/index.css?640523">
|
|
||||||
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="app" class='summer' >
|
|
||||||
<!-- <div class="title center">夏令营报名</div> -->
|
|
||||||
<!-- 选择课程 -->
|
|
||||||
<el-row class="titleRow align-center" style="margin-top: 50px;">
|
|
||||||
<span class="text right">
|
|
||||||
选择课程：
|
|
||||||
</span>
|
|
||||||
<el-col :span='20'>
|
|
||||||
<el-select v-model="curriculum" placeholder="请选择" @change='selectCurriculum'>
|
|
||||||
<el-option
|
|
||||||
v-for="item in curriculumOpts"
|
|
||||||
:key="item.name"
|
|
||||||
:label="item.name"
|
|
||||||
:value="item.name">
|
|
||||||
</el-option>
|
|
||||||
</el-select>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
<!-- 选择课程 几期 -->
|
|
||||||
<el-row class="titleRow">
|
|
||||||
<span class="text right" style="line-height: 28px;">
|
|
||||||
选择课程：
|
|
||||||
</span>
|
|
||||||
<el-col :span='20' class="flex flex-wrap">
|
|
||||||
<div v-for='(item, index) in stage' :key='index' @click='select(item)' class="stage" :class="item.id === selectStage ? 'activeStage' : '' ">
|
|
||||||
{{item.name}}
|
|
||||||
</div>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
<!-- 活动时间 -->
|
|
||||||
<el-row class="titleRow align-center">
|
|
||||||
<span class="text right">
|
|
||||||
活动时间：
|
|
||||||
</span>
|
|
||||||
<el-col :span='20'>
|
|
||||||
{{activeTime}}
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
<!-- 报名截止： -->
|
|
||||||
<el-row class="titleRow align-center">
|
|
||||||
<span class="text right">
|
|
||||||
报名截止：
|
|
||||||
</span>
|
|
||||||
<el-col :span='20'>
|
|
||||||
{{endTime}}
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
<!-- 分割线 -->
|
|
||||||
<div class="flex align-center" style="margin: 40px 0px 20px">
|
|
||||||
<div class="divider"></div>
|
|
||||||
<div style="margin: 0px 15px">信息填写</div>
|
|
||||||
<div class="divider"></div>
|
|
||||||
</div>
|
|
||||||
<!-- 姓名 -->
|
|
||||||
<div class="infoRow align-center">
|
|
||||||
<span class="text right">
|
|
||||||
<span class="red " >*</span>
|
|
||||||
姓名
|
|
||||||
</span>
|
|
||||||
<el-col :span='16'>
|
|
||||||
<el-input v-model='name' placeholder='请输入学生姓名'></el-input>
|
|
||||||
</el-col>
|
|
||||||
</div>
|
|
||||||
<!-- 性别 -->
|
|
||||||
<div class="infoRow align-center">
|
|
||||||
<span class="text right" >
|
|
||||||
<span class="red " >*</span>
|
|
||||||
性别
|
|
||||||
|
|
||||||
</span>
|
|
||||||
<el-col :span='16'>
|
|
||||||
<el-radio v-model="sex" label="1">男</el-radio>
|
|
||||||
<el-radio v-model="sex" label="2">女</el-radio>
|
|
||||||
</el-col>
|
|
||||||
</div>
|
|
||||||
<!-- 手机 -->
|
|
||||||
<div class="infoRow align-center">
|
|
||||||
<span class="text right">
|
|
||||||
<span class="red " >*</span>
|
|
||||||
手机
|
|
||||||
</span>
|
|
||||||
<el-col :span='16'>
|
|
||||||
<el-input v-model='phone' placeholder='请填写手机号'></el-input>
|
|
||||||
</el-col>
|
|
||||||
</div>
|
|
||||||
<!-- 学校 -->
|
|
||||||
<div class="infoRow align-center">
|
|
||||||
<span class="text right">
|
|
||||||
学校
|
|
||||||
</span>
|
|
||||||
<el-col :span='16'>
|
|
||||||
<el-input v-model='school' placeholder='请填写学校名称'></el-input>
|
|
||||||
</el-col>
|
|
||||||
</div>
|
|
||||||
<!-- 班级 -->
|
|
||||||
<div class="infoRow align-center">
|
|
||||||
<span class="text right">
|
|
||||||
班级
|
|
||||||
</span>
|
|
||||||
<el-col :span='16'>
|
|
||||||
<el-input v-model='studentClass' placeholder='请填写班级'></el-input>
|
|
||||||
</el-col>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-row class="flex btnBox" v-if='btnStatus'>
|
|
||||||
已截止报名
|
|
||||||
</el-row>
|
|
||||||
<el-row class="flex btnBox" v-else>
|
|
||||||
<el-button class="btn" @click='submit' >提交信息</el-button>
|
|
||||||
</el-row>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
<script>
|
|
||||||
new Vue({
|
|
||||||
el: '#app',
|
|
||||||
data: {
|
|
||||||
newDate: '',
|
|
||||||
dataList: [],
|
|
||||||
curriculum: '',
|
|
||||||
curriculumOpts: [],
|
|
||||||
selectStage: '',
|
|
||||||
stage: [],
|
|
||||||
activeTime: '',
|
|
||||||
endTime: '',
|
|
||||||
name: null,
|
|
||||||
sex: '1',
|
|
||||||
phone: '',
|
|
||||||
school: '',
|
|
||||||
studentClass: '',
|
|
||||||
btnStatus: false
|
|
||||||
},
|
|
||||||
created () {
|
|
||||||
let data = new Date()
|
|
||||||
this.newDate = data.getFullYear() + '-' + this.buling(data.getMonth() + 1) + '-' + this.buling(data.getDate())
|
|
||||||
this.getData()
|
|
||||||
},
|
|
||||||
watch: {
|
|
||||||
endTime(val) {
|
|
||||||
console.log(val)
|
|
||||||
if (val <= this.newDate) {
|
|
||||||
this.btnStatus = true
|
|
||||||
} else {
|
|
||||||
this.btnStatus = false
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
methods:{
|
|
||||||
buling (val) {
|
|
||||||
if (Number(val) < 10) {
|
|
||||||
return '0' + val
|
|
||||||
}
|
|
||||||
return val
|
|
||||||
},
|
|
||||||
getData () {
|
|
||||||
axios.post('/index.php/index/index/orderList',{type:1}).then(res=>{
|
|
||||||
console.log(res)
|
|
||||||
this.dataList = res.data
|
|
||||||
this.curriculumOpts = []
|
|
||||||
this.stage = []
|
|
||||||
if (res.data) {
|
|
||||||
res.data.forEach(item => {
|
|
||||||
let obj = {
|
|
||||||
name: item.title
|
|
||||||
}
|
|
||||||
this.curriculumOpts.push(obj)
|
|
||||||
})
|
|
||||||
this.curriculum = res.data[0].title
|
|
||||||
res.data[0].son.forEach(item => {
|
|
||||||
let obj = {
|
|
||||||
id: item.id,
|
|
||||||
name: item.title,
|
|
||||||
start_time_temp: item.start_time_temp,
|
|
||||||
end_time: item.start_time
|
|
||||||
}
|
|
||||||
this.stage.push(obj)
|
|
||||||
})
|
|
||||||
this.selectStage = res.data[0].son[0].id
|
|
||||||
this.activeTime = res.data[0].son[0].start_time_temp
|
|
||||||
this.endTime = res.data[0].son[0].start_time + ' 00:00'
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
submitData(){
|
|
||||||
if(!this.name){
|
|
||||||
alert('请填写姓名')
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
if(!this.phone){
|
|
||||||
alert('请填写手机')
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
if(!this.sex){
|
|
||||||
alert('请选择性别')
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
return true
|
|
||||||
},
|
|
||||||
selectCurriculum (val) {
|
|
||||||
this.dataList.forEach(item => {
|
|
||||||
if (val === item.title) {
|
|
||||||
this.stage = []
|
|
||||||
this.selectStage = item.son[0].id
|
|
||||||
item.son.forEach(items => {
|
|
||||||
let obj = {
|
|
||||||
id: items.id,
|
|
||||||
name: items.title,
|
|
||||||
start_time_temp: items.start_time_temp,
|
|
||||||
end_time: items.start_time
|
|
||||||
}
|
|
||||||
this.stage.push(obj)
|
|
||||||
})
|
|
||||||
this.activeTime = this.stage[0].start_time_temp
|
|
||||||
this.endTime = this.stage[0].end_time + ' 00:00'
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
// 选择第几期
|
|
||||||
select (val) {
|
|
||||||
console.log(val)
|
|
||||||
this.selectStage = val.id
|
|
||||||
this.activeTime = val.start_time_temp
|
|
||||||
this.endTime = val.end_time + ' 00:00'
|
|
||||||
},
|
|
||||||
submit () {
|
|
||||||
let pass = this.submitData()
|
|
||||||
if (pass) {
|
|
||||||
let params = {
|
|
||||||
id: this.selectStage,
|
|
||||||
grade: this.studentClass,
|
|
||||||
name: this.name,
|
|
||||||
school: this.school,
|
|
||||||
sex: this.sex,
|
|
||||||
phone: this.phone,
|
|
||||||
type: 2
|
|
||||||
}
|
|
||||||
axios.post('/index.php/index/index/insertOrder',params).then(res=>{
|
|
||||||
console.log(res)
|
|
||||||
if(res.data.code=='SUCCESS'){
|
|
||||||
//调用支付
|
|
||||||
// location.href = "{:HTTP}{:SITE_URL}/index.php/index/index/summerpay/"+res.data.id
|
|
||||||
location.href = "{:HTTP}{:SITE_URL}/index.php/index/index/dopay/id/"+res.data.id;
|
|
||||||
}else{
|
|
||||||
alert(res.data.msg)
|
|
||||||
}
|
|
||||||
}).catch(function (error) { // 请求失败处理
|
|
||||||
console.log(error)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
},
|
|
||||||
},
|
|
||||||
})
|
|
||||||
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
* {
|
|
||||||
padding: 0px;
|
|
||||||
margin: 0px;
|
|
||||||
}
|
|
||||||
.red {
|
|
||||||
color: red;
|
|
||||||
}
|
|
||||||
.flex {
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
.flex-wrap {
|
|
||||||
flex-wrap: wrap;
|
|
||||||
}
|
|
||||||
.center {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
.right {
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
.align-center{
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
.summer{
|
|
||||||
position: relative;
|
|
||||||
padding: 0px 15px;
|
|
||||||
font-size: 14px;
|
|
||||||
font-family: PingFangSC-Regular, PingFang SC;
|
|
||||||
font-weight: 400;
|
|
||||||
color: #333333;
|
|
||||||
height: 100vh;
|
|
||||||
}
|
|
||||||
.title{
|
|
||||||
margin-top: 10px;
|
|
||||||
margin-bottom: 30px;
|
|
||||||
width: 100%;
|
|
||||||
height: 25px;
|
|
||||||
font-size: 18px;
|
|
||||||
font-family: PingFangSC-Regular, PingFang SC;
|
|
||||||
font-weight: 400;
|
|
||||||
color: #333333;
|
|
||||||
line-height: 25px;
|
|
||||||
}
|
|
||||||
.titleRow{
|
|
||||||
display: flex;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.summer .text{
|
|
||||||
width: 100px;
|
|
||||||
}
|
|
||||||
.el-select .el-input__inner{
|
|
||||||
border-radius: 30px;
|
|
||||||
height: 34px;
|
|
||||||
line-height: 34px;
|
|
||||||
}
|
|
||||||
.el-select .el-input__icon{
|
|
||||||
line-height: 24px;
|
|
||||||
}
|
|
||||||
.infoRow .el-input {
|
|
||||||
height: 34px;
|
|
||||||
line-height: 34px;
|
|
||||||
}
|
|
||||||
.stage{
|
|
||||||
margin-right: 10px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
background: #F8F8F8;
|
|
||||||
padding: 4px 20px;
|
|
||||||
background: #F8F8F8;
|
|
||||||
border-radius: 4px;
|
|
||||||
}
|
|
||||||
.activeStage{
|
|
||||||
background: #5FD19B;
|
|
||||||
color: white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.divider{
|
|
||||||
flex-grow: 1;
|
|
||||||
height: 1px;
|
|
||||||
background: #E6E6E6;
|
|
||||||
}
|
|
||||||
.infoRow{
|
|
||||||
display: flex;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.infoRow .text{
|
|
||||||
width: 80px;
|
|
||||||
margin-right: 10px;
|
|
||||||
}
|
|
||||||
.btnBox{
|
|
||||||
margin-top: 50px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
.el-button{
|
|
||||||
width: 300px;
|
|
||||||
height: 40px;
|
|
||||||
border-radius: 17px;
|
|
||||||
background: linear-gradient(#5FD19B, #31A462);
|
|
||||||
color: #FFFFFF;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</html>
|
|
||||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in new issue