register.wxml
<!--pages/register/register.wxml-->
<view class='head'>
<text class='headTitle'>注册申请</text>
</view>
<form bindsubmit='formSubmit'>
<!-- 使用期限 -->
<view class='term_choose'>
<view class='term'>请选择使用期限:</view>
<view class="section section_gap" >
<radio-group class="radio-group" bindchange="radioChange" >
<radio class="radio" wx:for="{{paymentRules}}" wx:key="id" value="{{index}}">
<text class='radioText'>{{paymentRules[index].validDate}} 天</text>
</radio>
<text class='reasonText'>{{reasonText}}</text>
</radio-group>
</view>
</view>
<!-- 手机号 -->
<view class='register_phone'>
<view class='phone_input'>
<input class='phone' maxlength="11" type="number" placeholder="请输入手机号" bindinput='inputPhone' value='{{phone}}'/>
</view>
</view>
<!-- 省市学校选择 -->
<!-- 省份picker -->
<view class="section_province">
<view class='sectionText'>省份</view>
<picker bindchange="bindPickerChange" range="{{provincesList}}" range-key="{{'province'}}">
<input type='text' class='texts' value='{{provincesList[index1].province}}'></input>
</picker>
<span class='icon iconfont icon-weibiaoti34'></span>
</view>
<!-- 城市picker -->
<view class="section_city">
<view class='sectionText'>城市</view>
<picker bindchange="bindPickerChangef" value="{{index2}}" range="{{citiesList}}" range-key="{{'city'}}">
<input type='text' class='texts' value='{{citiesList[index2].city}}'></input>
</picker>
<span class='icon iconfont icon-weibiaoti34'></span>
</view>
<!-- 学校picker -->
<view class="section_school">
<view class='sectionText'>学校</view>
<picker bindchange="bindPickerChangew" value="{{index3}}" range="{{schoolList}}" range-key="{{'schoolName'}}">
<input type='text' class='texts' value='{{schoolList[index3].schoolName}}'></input>
</picker>
<span class='icon iconfont icon-weibiaoti34'></span>
</view>
<!-- 添加学校 -->
<view class='addSchool'>
<text class='add_school' bindtap='addschool'>
添加学校
</text>
</view>
<!-- 邮箱 -->
<view class='register_email'>
<view class='inputEmail'>
<input placeholder='请输入邮箱' bindinput='getEmailValue' value='{{email}}' class='emailInput'/>
</view>
<view class='inputCode'>
<input placeholder='请输入验证码' bindinput='getCodeValue' value='{{code}}' style='width:70%;' class='codeInput'/>
<button class='codeBtn' bindtap='getVerificationCode' disabled='{{disabled}}'>{{codename}}</button>
</view>
</view>
<!-- 二维码上传 -->
<view class='te'>
<text class='tex'>上传账户二维码</text>
</view>
<view class='uploadImage'>
<view class="addImg">
<!-- 已选图片 -->
<view wx:for="{{images}}" wx:key="key" class="upFile" bindtap="showImage" style="border-radius: 5px" data-id="{{index}}">
<image class="itemImg" src="{{item}}"></image>
<image class="closeImg" src="../../resources/images/delect.png" mode="scaleToFill" catchtap="deleteImg" data-id="{{index}}"></image>
</view>
<!-- 选择图片 -->
<view class="chooseView" bindtap="chooseImg" style="border-radius: 5px" wx:if="{{chooseViewShow}}">
<image class="chooseImv" src="../../resources/images/add.png"></image>
</view>
</view>
</view>
<view class='all'>
<button type='submit' form-type='submit' class='but-hover'>提交</button>
</view>
</form>
register.js
// pages/register/register.js
var userID = wx.getStorageSync('userID');
var list = []
const app = getApp()
var adds = {};
Page({
/**
* 页面的初始数据
*/
data: {
paymentRules: [],//缴费规则
checked:true,
index:'',
phone:'',
index1:'',
index2:'',
reasonText:'',//提示信息
validDate:[],//时间
provincesList: [],// 省市学校
provinceId: '',
cityId: '',
citiesList: [],
schoolList: [],
email:'',//邮箱
code: '',//验证码
iscode: null,//用于存放验证码接口里获取到的code
codename: '获取验证码',
images: [], //图片
chooseViewShow: true,
params:{
paymentRulesId: '',
phone: '',
provincesId: '',
citiesId: '',
schoolId: '',
code:'',
userId: userID,
imageFile:''
}
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
this.getPaymentRules()
this.getProvinces()
},
// 使用时间
radioChange: function (e) {
console.log('radio发生change事件，携带value值为：', e.detail.value)
this.setData({
index:e.detail.value,
reasonText: "使用期限：" + this.data.paymentRules[e.detail.value].reason
})
},
getPaymentRules() {
app.getPaymentRules().then(res => {
this.setData({
paymentRules: res.data.paymentRules
})
})
},
inputPhone:function(e){
this.setData({
phone: e.detail.value
})
},
// 省份选择器
bindPickerChange: function (e) {
console.log('picker发送选择改变，携带值为', e.detail.value)
this.getCity(this.data.provincesList[e.detail.value].provinceid);
this.setData({
index1:e.detail.value,
provinceId: this.data.provincesList[e.detail.value].provinceid
})
console.log(this.data.provincesList[e.detail.value].provinceid)
},
// 城市选择器
bindPickerChangef: function (e) {
console.log('picker发送选择改变，携带值为', e.detail.value)
this.getSchool(this.data.citiesList[e.detail.value].cityid);
this.setData({
index2: e.detail.value,
cityId: this.data.citiesList[e.detail.value].cityid
})
console.log(this.data.citiesList[e.detail.value].cityid)
},
// 学校选择器
bindPickerChangew: function (e) {
console.log('picker发送选择改变，携带值为', e.detail.value)
this.setData({
index3: e.detail.value
})
},
// 添加学校
addschool: function(e){
const id = e.currentTarget.id
wx.navigateTo({
url: '../addSchool/addSchool',
})
},
// 省份方法
getProvinces() {
app.getProvinces().then(res => {
this.setData({
provincesList: res.data.provincesList
})
})
},
// 城市方法
getCity(provinceId) {
let params = {
provinceId: provinceId
}
app.getCity(params).then(res => {
this.setData({
citiesList: res.data.citiesList
})
})
},
// 学校方法
getSchool(citiesId) {
let params = {
citiesId: citiesId
}
app.getSchool(params).then(res => {
this.setData({
schoolList: res.data.schoolList
})
})
},
// 邮箱验证
//获取input输入框的值
getEmailValue:function(e) {
this.setData({
email:e.detail.value
})
},
// 获取验证码输入框的值
getCodeValue:function(e) {
this.setData({
code:e.detail.value
})
},
// 获取验证码
getCode:function(){
var a = this.data.email;
var _this = this;
var myreg = /^([0-9A-Za-z\-_\.]+)@([0-9a-z]+\.[a-z]{2,3}(\.[a-z]{2})?)$/;
if(this.data.email == ""){
wx.showToast({
title: '邮箱不能为空',
icon: 'none',
duration: 1000
})
return false;
} else if (!myreg.test(a)){
wx.showToast({
title: '请输入正确的邮箱',
icon: 'none',
duration: 1000
})
return false
} else {
wx.request({
url: app.globalData.baseUrl + '/wechat/user/getCode',//接口地址
method:'POST',
data : {
email:a,
userID: userID
},
success(res){
if (res.data.state === 0){
wx.showToast({
title: '邮箱已经被占用！',
})
}else{
var num = 301;
var timer = setInterval(function () {
num--;
if (num <= 0) {
clearInterval(timer);
_this.setData({
codename: '重新发送',
disabled: false
})
} else {
_this.setData({
codename: num + "s",
disabled:true
})
}
}, 1000)
}
}
})
}
},
// 获取验证码
getVerificationCode(){
this.getCode();
},
// 上传二维码
/** 选择图片 */
chooseImg: function () {
var that = this;
wx.chooseImage({
count: 1,
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
success: function (res) {
// 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
console.log(res.tempFilePaths);
if (res.tempFilePaths.count == 0) {
return;
}
//上传图片
var imgArrNow = that.data.images;
imgArrNow = imgArrNow.concat(res.tempFilePaths);
that.setData({
images: imgArrNow,
noMore: false
})
that.chooseViewShow();
}
})
},
/** 删除图片Banner */
deleteImg: function (e) {
var images = this.data.images;
var itemIndex = e.currentTarget.dataset.id;
images.splice(itemIndex, 1);
this.setData({
images: images,
chooseViewShow: true
})
},
/** 查看大图Banner */
showImage: function (e) {
var images = this.data.images;
var itemIndex = e.currentTarget.dataset.id;
console.log("itemIndex:" + JSON.stringify(e))
wx.previewImage({
current: images[itemIndex], // 当前显示图片的http链接
urls: images // 需要预览的图片http链接列表
})
},
/** 是否隐藏图片选择Banner*/
chooseViewShow: function () {
if (this.data.images.length >= 0) {
this.setData({
chooseViewShow: false
})
} else {
this.setData({
chooseViewShow: true
})
}
},
// 提交
formSubmit: function(e) {
if(this.data.index == '') {
wx.showToast({
title: '请选择使用期限!',
icon: 'loading',
duration: 500
})
} else if (this.data.phone == ''){
wx.showToast({
title: '请填写手机号!',
icon: 'loading',
duration: 500
})
} else if (!(/^1(3|4|5|7|8)\d{9}$/.test(this.data.phone))){
wx.showToast({
title: '号码格式错误！',
icon: 'loading',
duration: 500
})
} else if (this.data.index1 == '') {
wx.showToast({
title: '请选择省份!',
icon: 'loading',
duration: 500
})
} else if (this.data.index2 == '') {
wx.showToast({
title: '请选择城市!',
icon: 'loading',
duration: 500
})
} else if (this.data.index3 == '') {
wx.showToast({
title: '请选择学校!',
icon: 'loading',
duration: 500
})
} else if (this.data.email == ''){
wx.showToast({
title: '请输入邮箱!',
icon: 'loading',
duration: 500
})
} else if ( !(/^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(this.data.email))) {
wx.showToast({
title: '邮箱格式错误!',
icon: 'loading',
duration: 500
})
} else if (this.data.code == '') {
wx.showToast({
title: '请输入验证码!',
icon: 'loading',
duration: 500
})
} else if (this.data.images.length === 0) {
wx.showToast({
title: '请选择二维码!',
icon: 'loading',
duration: 500
})
} else {
let that = this
that.data.params.paymentRulesId = that.data.paymentRules[that.data.index].id,
that.data.params.phone = that.data.phone,
that.data.params.provincesId = that.data.provincesList[that.data.index1].provinceid,
that.data.params.citiesId = that.data.citiesList[that.data.index2].cityid,
that.data.params.schoolId = that.data.schoolList[that.data.index3].id,
that.data.params.code = that.data.code,
that.data.params.userId = userID,
that.data.params.imageFile = that.data.imageFile
console.log(that.data.images)
wx.uploadFile({
url: app.globalData.baseUrl + '/wechat/user/insertRegister',
filePath: that.data.images[0],
name: 'file',
formData: {
'parameters': JSON.stringify(that.data.params)
},
success: function (res) {
let data = JSON.parse(res.data);
if(data.state === 0) {
wx.showToast({
title: data.msg,
icon: 'file',
duration: 1500
})
} else {
console.log(1111)
wx.showToast({
title: '提交成功！！！',
icon: 'success',
duration: 1000
})
that.setData({
phone: '',
index1: '',
index2: '',
index3: '',
email: '',//邮箱
code: '',//验证码
codename: '获取验证码',
images: [], //图片
})
that.onLoad()
}
}
})
}
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
},
})
修改注册信息
updateRegister.wxml
<view class='head'>
<text class='headTitle'>修改注册</text>
</view>
<form bindsubmit='updRegister'>
<!-- 手机号 -->
<view class='register_phone'>
<view class='phone_input'>
<input class='phone' maxlength="11" type="number" placeholder="手机号" bindblur='inputPhone'name="phone" value='{{registerList.phone}}' />
</view>
</view>
<!-- 学校 -->
<!-- 省市学校选择 -->
<!-- 省份picker -->
<view class="section_province">
<view class='sectionText'>省份</view>
<picker bindchange="bindPickerChange" range="{{provincesList}}" range-key="{{'province'}}" value='{{registerList}}'>
<input data-id='{{provincesList[index1].provinceid}}' type='text' class='texts' value='{{provincesList[index1].province}}' disabled='true' name="province"></input>
</picker>
<span class='icon iconfont icon-weibiaoti34'></span>
</view>
<!-- 城市picker -->
<view class="section_city">
<view class='sectionText'>城市</view>
<picker bindchange="bindPickerChangef" range="{{citiesList}}" range-key="{{'city'}}" value="{{registerList}}">
<input data-id='{{citiesList[index2].cityid}}' type='text' class='texts' value='{{citiesList[index2].city}}' name="city"></input>
</picker>
<span class='icon iconfont icon-weibiaoti34'></span>
</view>
<!-- 学校picker -->
<view class="section_school">
<view class='sectionText'>学校</view>
<picker bindchange="bindPickerChangew" range="{{schoolList}}" range-key="{{'schoolName'}}" value="{{registerList}}">
<input data-id='{{schoolList[index3].id}}' type='text' class='texts' value='{{schoolList[index3].schoolName}}' name="school"></input>
</picker>
<span class='icon iconfont icon-weibiaoti34'></span>
</view>
<!-- 邮箱 -->
<view class='register_email'>
<view class='email_input'>
<input class='email' placeholder="邮箱" bindinput='inputEmail' value='{{registerList.email}}' name="email"/>
</view>
</view>
<!-- 二维码上传 -->
<view class='te'>
<text class='tex'>账户二维码</text>
</view>
<view class='uploadImage'>
<view class="addImg">
<!-- 已选图片 -->
<view wx:for='{{images}}' wx:key="key" class="upFile" bindtap="showImage" style="border-radius: 5px" data-id="{{index}}">
<image class="itemImg" src="{{item}}"></image>
<image class="closeImg" src="../../resources/images/delect.png" mode="scaleToFill" catchtap="deleteImg" data-id="{{index}}"></image>
</view>
<!-- 选择图片 -->
<view class="chooseView" bindtap="chooseImg" style="border-radius: 5px" wx:if="{{chooseViewShow}}">
<image class="chooseImv" src="../../resources/images/add.png"></image>
</view>
</view>
</view>
<view class='all'>
<button form-type='submit' class='but-hover'>保存修改</button>
</view>
</form>
updateRegister.js
// pages/updateRegister/updateRegister.js
var list = []
var app = getApp();
var userID = wx.getStorageSync('userID');
Page({
/**
* 页面的初始数据
*/
data: {
registerList: [],
id: 0,
index1: -1,
index2: -1,
index3: -1,
provincesList: [], // 省市学校
provinceId: '',
cityId: '',
citiesList: [],
schoolList: [],
schoolId: '',
phone: '',
email: '',
images: [], //图片
chooseViewShow: true,
params: {
imageFile: ''
}
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
this.selectRegister()
// this.getProvinces()
},
// 手机号
inputPhone: function(e) {
this.setData({
phone: e.detail.value
})
},
// 省份选择器
bindPickerChange: function(e) {
// console.log('picker发送选择改变，携带值为', e.detail.value)
this.getCity(this.data.provincesList[e.detail.value].provinceid);
this.setData({
index1: e.detail.value,
provinceId: this.data.provincesList[e.detail.value].provinceid
})
},
// 城市选择器
bindPickerChangef: function(e) {
// console.log('picker发送选择改变，携带值为', e.detail.value)
this.getSchool(this.data.citiesList[e.detail.value].cityid);
this.setData({
index2: e.detail.value,
cityId: this.data.citiesList[e.detail.value].cityid
})
},
// 学校选择器
bindPickerChangew: function(e) {
// console.log('picker发送选择改变，携带值为', e.detail.value)
this.setData({
index3: e.detail.value
})
},
// 省份方法
getProvinces() {
app.getProvinces().then(res => {
this.setData({
provincesList: res.data.provincesList
})
})
},
// 城市方法
getCity(provinceId) {
let params = {
provinceId: provinceId
}
app.getCity(params).then(res => {
this.setData({
citiesList: res.data.citiesList
})
})
},
// 学校方法
getSchool(citiesId) {
let params = {
citiesId: citiesId
}
app.getSchool(params).then(res => {
this.setData({
schoolList: res.data.schoolList
})
})
},
inputEmail: function(e) {
this.setData({
email: e.detail.value
})
},
// 上传二维码
/** 选择图片images */
chooseImg: function() {
var that = this;
wx.chooseImage({
count: 1, //最多选择4张图片- that.data.imgArr.length,
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
success: function(res) {
// 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
console.log(res.tempFilePaths);
if (res.tempFilePaths.count == 0) {
return;
}
//上传图片
var imgArrNow = that.data.images;
imgArrNow = imgArrNow.concat(res.tempFilePaths);
that.setData({
images: imgArrNow
})
that.chooseViewShow();
}
})
},
/** 删除图片images */
deleteImg: function(e) {
var images = this.data.images;
var itemIndex = e.currentTarget.dataset.id;
images.splice(itemIndex, 1);
console.log(images);
this.setData({
images: images,
chooseViewShow: true
})
},
/** 是否隐藏图片选择images*/
chooseViewShow: function() {
if (this.data.images.length >= 0) {
this.setData({
chooseViewShow: false
})
} else {
this.setData({
chooseViewShow: true
})
}
},
/** 查看大图 */
showImage: function(e) {
var images = this.data.images;
var itemIndex = e.currentTarget.dataset.id;
wx.previewImage({
current: images[itemIndex], // 当前显示图片的http链接
urls: images // 需要预览的图片http链接列表
})
},
// 查询注册信息
selectRegister() {
let params = {
userId: userID,
}
app.selectRegister(params).then(res => {
let registerList = res.data.register;
this.setData({
provincesList: res.data.provincesList,
citiesList: res.data.citiesList,
schoolList: res.data.schoolList,
chooseViewShow: false,
images: res.data.img
})
let index1 = -1;
for (var i = 0; i < this.data.provincesList.length; i++) {
if (this.data.provincesList[i].provinceid === registerList.provinceId) {
index1 = i
break;
} else {
index1: -1;
}
}
let index2 = -1;
for (var j = 0; j < this.data.citiesList.length; j++) {
if (this.data.citiesList[j].cityid === registerList.cityId) {
index2 = j
break;
} else {
index2: -1;
}
}
let index3 = -1;
for (var k = 0; k < this.data.schoolList.length; k++) {
if (this.data.schoolList[k].id === registerList.schoolId) {
index3 = k
break;
} else {
index3: -1;
}
}
this.setData({
registerList: res.data.register,
index1: index1,
index2: index2,
index3: index3,
userID: userID,
id: res.data.register.id
})
})
},
// 修改提交
updRegister(e) {
let that = this;
console.log(e.detail.value.phone)
if (e.detail.value.phone === "") {
wx.showToast({
title: '手机号不能为空',
icon: "none",
duration: 1000,
mask: true,
})
} else if (!(/^1(3|4|5|7|8)\d{9}$/.test(e.detail.value.phone))) {
wx.showToast({
title: '号码格式错误！',
icon: 'loading',
duration: 1000
})
} else if (that.data.index1 === -1) {
wx.showToast({
title: '省份不能为空',
icon: "none",
duration: 1000,
mask: true,
})
} else if (that.data.index2 === -1) {
wx.showToast({
title: '城市不能为空',
icon: "none",
duration: 1000,
mask: true,
})
} else if (that.data.index3 === -1) {
wx.showToast({
title: '学校不能为空',
icon: "none",
duration: 1000,
mask: true,
})
} else if (e.detail.value.email === "") {
wx.showToast({
title: '邮箱不能为空',
icon: "none",
duration: 1000,
mask: true,
})
} else if (!(/^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(e.detail.value.email))) {
wx.showToast({
title: '邮箱格式错误!',
icon: 'loading',
duration: 1000
})
} else if (that.data.images.length === 0) {
wx.showToast({
title: '请选择账户二维码',
icon: "none",
duration: 1000,
mask: true,
})
} else {
let params = {
Id: that.data.id,
userId: userID,
phone: e.detail.value.phone,
email: e.detail.value.email,
provincesId: that.data.provincesList[that.data.index1].provinceid,
citiesId: that.data.citiesList[that.data.index2].cityid,
schoolId: that.data.schoolList[that.data.index3].id
}
wx.showModal({
title: '提示',
content: '只能修改一次，确定保存修改？',
success(res) {
if (res.confirm) {
that.sureRelease(params);
}
}
})
}
},
sureRelease(params) {
let that = this;
wx.uploadFile({
url: app.globalData.baseUrl + '/wechat/user/updRegister',
filePath: that.data.images[0],
name: 'file',
formData: {
'parameters': JSON.stringify(params)
},
success(res) {
wx.showToast({
title: '提交成功',
icon: "none",
duration: 2000,
mask: true,
success() {
setTimeout(function () {
wx.navigateBack({
delta: 1,
})
}, 1000);
}
})
}
})
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function() {
}
})
