ewide/number_zj
22
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

3.修改:将活动日期分开,

Browse Source 
4.将线路分开,分成3个页面,每个线路一个页面
5.调整报名后查看页面可直接获取报名信息
6.增加手机号码验证页面
7.后台管理页面增加姓名,手机号码,线路,日期 查询检索
This commit is contained in:
范露尧
2023-03-13 09:45:50 +08:00
parent 539a3185b3
commit 2406733fd2
7 changed files with 628 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

142
20220330_Vote/Ewide.Web.Entry/Views/Manage/nbczResult.cshtml
View File

@@ -19,6 +19,37 @@
<body>
<div id="app" v-loading="loading">
<h3 style="text-align:center;">共赴宁波之春 报名结果</h3>
<el-form label-position="left" ref="form" :model="form" label-width="120px" style="margin-top:15px;">
<el-form-item label="姓名：" prop="name">
<el-input v-model="form.name"></el-input>
</el-form-item>
<el-form-item label="手机号码：" prop="phone">
<el-input v-model="form.phone"></el-input>
</el-form-item>
<el-form-item label="线路：" prop="line">
<el-radio-group v-model="form.line" size="small">
<el-radio-button label="慈溪" border></el-radio-button>
<el-radio-button label="奉化" border></el-radio-button>
<el-radio-button label="象山" border></el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item label="参加时间：" prop="date">
<el-radio-group v-model="form.date" size="small">
<el-radio-button label="2023-03-18" border></el-radio-button>
<el-radio-button label="2023-03-19" border></el-radio-button>
<el-radio-button label="2023-03-25" border></el-radio-button>
<el-radio-button label="2023-03-26" border></el-radio-button>
<el-radio-button label="2023-04-08" border></el-radio-button>
<el-radio-button label="2023-04-09" border></el-radio-button>
<el-radio-button label="2023-04-15" border></el-radio-button>
<el-radio-button label="2023-04-16" border></el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item>
<el-button type="primary" @@click.prevent="onSubmit('form')">查询</el-button>
<el-button @@click.prevent="reset('form')">重置</el-button>
</el-form-item>
</el-form>
<el-table :data="tableData" style="width: 100%">
<el-table-column type="expand">
<template slot-scope="props">
@@ -79,7 +110,7 @@
</el-table-column>
<el-table-column label="报名日期"><template slot-scope="props">{{ dateFormat("mm-dd", props.row.createdTime )}}</template></el-table-column>
<el-table-column label="姓名/手机号码"><template slot-scope="props">{{ props.row.name}}<br />{{ props.row.phone}}</template></el-table-column>
<el-table-column label="日期/线路"><template slot-scope="props">{{ props.row.date}} 线路{{ props.row.line}}</template></el-table-column>
<el-table-column label="日期/线路"><template slot-scope="props">{{ props.row.date}} {{ props.row.line}}</template></el-table-column>
</el-table>
@@ -89,32 +120,24 @@
</h3>
</div>
</body>
<style scoped>
.buhuanhang {
white-space: nowrap;
width: 21%;
}
.demo-table-expand {
font-size: 0;
}
.demo-table-expand label {
width: 90px;
color: #99a9bf;
}
.demo-table-expand .el-form-item {
margin-right: 0;
margin-bottom: 0;
width: 50%;
}
</style>
<script>
new Vue({
el: '#app',
data: function () {
return {
form: {
name: '',
phone: '',
weixin_number: '',
cardno: '',
hangye: '',
address: '',
date: '',
line: '',
code: '',
token: ''
//,remark: ''
},
tableData: [],
loading: false,
token: ''
@@ -127,6 +150,44 @@
},
methods: {
onSubmit(formName) {
console.log('submit!');
let _this = this;
this.$refs[formName].validate((valid) => { // 为表单绑定验证功能
if (valid) {
//this.$alert("成功", "提示")
axios({
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
method: 'post',
url: '/gb/yjb/api/ningbozhichun/query',
data: _this.form,
responseType: "json",
headers: {
Authorization: 'Bearer ' + _this.token
}
}).then(async response => {
if (response.data?.data?.success == true) {
_this.tableData = response.data?.data?.result;
} else {
_this.$alert(`<div>` + response.data.message + `</div>`, '错误', {
confirmButtonText: '确定', dangerouslyUseHTMLString: true, center: true, closeOnClickModal: true
}).then(a => { }).catch(err => { console.log(err) });
}
_this.loading = false;
}).catch(async error => {
console.log(error)
_this.$message({
type: 'error',
message: error.message
})
_this.loading = false;
})
}
});
}, reset(formName) {
this.form = {}
},
export_excel() {
this.loading = true;
this.download('/gb/yjb/api/ningbozhichun/export_excel', this.dateFormat("YYYYmmddHHMMSS", new Date()) + "-共赴宁波之春.xlsx", this.loading_false);
@@ -235,5 +296,42 @@
}
})
</script>
<style scoped>
.buhuanhang {
white-space: nowrap;
width: 21%;
}
.text {
font-size: 14px;
}
.item {
padding: 18px 0;
}
.box-card {
width: 98%;
margin: 0 auto;
}
.el-card__body {
padding: 12px;
}
.el-card__body p {
margin: 0px;
margin-bottom: 5px;
line-height: 1.2;
}
.el-radio.is-bordered {
margin-bottom: 10px;
}
.el-radio-button--small .el-radio-button__inner {
border-left: 1px solid #DCDFE6;
}
</style>
</html>