lihenian
4 years ago
12 changed files with 911 additions and 110 deletions
|
After Width: | Height: | Size: 11 KiB |
@ -1,112 +1,124 @@ |
|||
{ |
|||
"setting": {}, |
|||
"condition": { |
|||
"plugin": { |
|||
"list": [] |
|||
"setting": {}, |
|||
"condition": { |
|||
"plugin": { |
|||
"list": [] |
|||
}, |
|||
"game": { |
|||
"list": [] |
|||
}, |
|||
"gamePlugin": { |
|||
"list": [] |
|||
}, |
|||
"miniprogram": { |
|||
"list": [ |
|||
{ |
|||
"name": "pages/formid/formid", |
|||
"pathName": "pages/formid/formid", |
|||
"query": "gid=1233274128467787777", |
|||
"scene": 1011 |
|||
}, |
|||
"game": { |
|||
"list": [] |
|||
{ |
|||
"id": 2, |
|||
"name": "网格长注册", |
|||
"pathName": "pages/index/index", |
|||
"query": "scene=gridLeader", |
|||
"scene": 1011 |
|||
}, |
|||
"gamePlugin": { |
|||
"list": [] |
|||
{ |
|||
"id": 3, |
|||
"name": "subpages/home/pages/newsDetail/newsDetail", |
|||
"pathName": "subpages/home/pages/newsDetail/newsDetail", |
|||
"query": "id=7c8bc749ff4b6380bf1d902c0bde0ba&defaultGridId=1233592630168813569", |
|||
"scene": null |
|||
}, |
|||
"miniprogram": { |
|||
"list": [ |
|||
{ |
|||
"name": "pages/formid/formid", |
|||
"pathName": "pages/formid/formid", |
|||
"query": "gid=1233274128467787777", |
|||
"scene": 1011 |
|||
}, |
|||
{ |
|||
"id": 2, |
|||
"name": "网格长注册", |
|||
"pathName": "pages/index/index", |
|||
"query": "scene=gridLeader", |
|||
"scene": 1011 |
|||
}, |
|||
{ |
|||
"id": 3, |
|||
"name": "subpages/home/pages/newsDetail/newsDetail", |
|||
"pathName": "subpages/home/pages/newsDetail/newsDetail", |
|||
"query": "id=7c8bc749ff4b6380bf1d902c0bde0ba&defaultGridId=1233592630168813569", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"id": -1, |
|||
"name": "社群列表", |
|||
"pathName": "subpages/associationNew/pages/associationlist/associationlist", |
|||
"query": "", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"id": 5, |
|||
"name": "数据端跳转", |
|||
"pathName": "pages/indexNew/indexNew", |
|||
"query": "scene=1277169327606366209&from=analysis", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"id": 7, |
|||
"name": "我有事说", |
|||
"pathName": "subpages/discussion/pages/addIssue/addIssue", |
|||
"query": "", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"id": 8, |
|||
"name": "搜索页面", |
|||
"pathName": "subpages/oneKeyService/pages/search/search", |
|||
"query": "", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"id": -1, |
|||
"name": "注册页面", |
|||
"pathName": "pages/toRegister/toRegister", |
|||
"query": "", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"id": -1, |
|||
"name": "subpages/heart/pages/leaderboardNew/leaderboardNew", |
|||
"pathName": "subpages/heart/pages/leaderboardNew/leaderboardNew", |
|||
"query": "", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"id": 9, |
|||
"name": "subpages/oneKeyService/pages/index/index", |
|||
"pathName": "subpages/oneKeyService/pages/index/index", |
|||
"query": "", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"id": -1, |
|||
"name": "subpages/oneKeyService/pages/moduleList/moduleList", |
|||
"pathName": "subpages/oneKeyService/pages/moduleList/moduleList", |
|||
"query": "pid=4d667ea4ff8fb045b03a68a9d24207e9&bannerflag=1&categorycode=notice_jsqf&modulestyle=2&categoryname=锦水清风", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"name": "积分中心", |
|||
"pathName": "subpages/integralCentre/pages/index/index", |
|||
"query": "", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"name": "积分中心", |
|||
"pathName": "subpages/integralCentre/pages/exchangeIndex/exchangeIndex", |
|||
"query": "", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"name": "带参网格码生成", |
|||
"pathName": "pages/index/index", |
|||
"query": "scene=1233592630168813569", |
|||
"scene": null |
|||
} |
|||
] |
|||
{ |
|||
"id": -1, |
|||
"name": "社群列表", |
|||
"pathName": "subpages/associationNew/pages/associationlist/associationlist", |
|||
"query": "", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"id": 5, |
|||
"name": "数据端跳转", |
|||
"pathName": "pages/indexNew/indexNew", |
|||
"query": "scene=1277169327606366209&from=analysis", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"id": 7, |
|||
"name": "我有事说", |
|||
"pathName": "subpages/discussion/pages/addIssue/addIssue", |
|||
"query": "", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"id": 8, |
|||
"name": "搜索页面", |
|||
"pathName": "subpages/oneKeyService/pages/search/search", |
|||
"query": "", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"id": -1, |
|||
"name": "注册页面", |
|||
"pathName": "pages/toRegister/toRegister", |
|||
"query": "", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"id": -1, |
|||
"name": "subpages/heart/pages/leaderboardNew/leaderboardNew", |
|||
"pathName": "subpages/heart/pages/leaderboardNew/leaderboardNew", |
|||
"query": "", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"id": 9, |
|||
"name": "subpages/oneKeyService/pages/index/index", |
|||
"pathName": "subpages/oneKeyService/pages/index/index", |
|||
"query": "", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"id": -1, |
|||
"name": "subpages/oneKeyService/pages/moduleList/moduleList", |
|||
"pathName": "subpages/oneKeyService/pages/moduleList/moduleList", |
|||
"query": "pid=4d667ea4ff8fb045b03a68a9d24207e9&bannerflag=1&categorycode=notice_jsqf&modulestyle=2&categoryname=锦水清风", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"name": "积分中心", |
|||
"pathName": "subpages/integralCentre/pages/index/index", |
|||
"query": "", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"name": "积分中心", |
|||
"pathName": "subpages/integralCentre/pages/exchangeIndex/exchangeIndex", |
|||
"query": "", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"name": "带参网格码生成", |
|||
"pathName": "pages/index/index", |
|||
"query": "scene=1233592630168813569", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"name": "选民登记", |
|||
"pathName": "subpages/voter/pages/register/register", |
|||
"query": "", |
|||
"scene": null |
|||
}, |
|||
{ |
|||
"name": "首页", |
|||
"pathName": "pages/indexNew/indexNew", |
|||
"query": "", |
|||
"scene": null |
|||
} |
|||
] |
|||
} |
|||
} |
|||
} |
|||
@ -0,0 +1,468 @@ |
|||
const api = require('../../../../utils/api') |
|||
|
|||
Page({ |
|||
data: { |
|||
districtPickerOptions: [], |
|||
districtPickerVisible: false, |
|||
districtPickerValue: [], |
|||
districtPickerLabel: '', |
|||
|
|||
groupPickerOptions: [], |
|||
groupPickerVisible: false, |
|||
groupPickerValue: [], |
|||
groupPickerLabel: '', |
|||
|
|||
nationPickerOptions: [], |
|||
nationPickerVisible: false, |
|||
nationPickerValue: [], |
|||
nationPickerLabel: '', |
|||
|
|||
rulePickerOptions: [], |
|||
rulePickerVisible: false, |
|||
rulePickerValue: [], |
|||
rulePickerLabel: '', |
|||
|
|||
name: '', |
|||
idCard: '', |
|||
address: '', |
|||
telephone: '', |
|||
smsCode: '', |
|||
note: '', |
|||
smsCodeText: '获取验证码', |
|||
id: '', |
|||
|
|||
submitBtnDisabled: false, |
|||
protocolChecked: false |
|||
}, |
|||
onLoad() { |
|||
Promise.all([this.getNationList(), this.getRuleList(), this.getDistrictList()]).then(res => { |
|||
this.getVoterDetail() |
|||
}) |
|||
}, |
|||
// 所选地区
|
|||
showDistrictPicker() { |
|||
this.setData({ |
|||
districtPickerVisible: true |
|||
}) |
|||
}, |
|||
onDistrictPickerConfirm(e) { |
|||
this.setData({ |
|||
districtPickerValue: e.detail.value, |
|||
districtPickerLabel: e.detail.label, |
|||
groupPickerValue: [], |
|||
groupPickerLabel: '' |
|||
}) |
|||
this.getGroupList() |
|||
}, |
|||
onDistrictPickerCancel() { |
|||
this.setData({ |
|||
districtPickerVisible: false |
|||
}) |
|||
}, |
|||
onDistrictPickerVisibleChange(e) { |
|||
this.setData({ |
|||
districtPickerVisible: e.detail.visible |
|||
}) |
|||
}, |
|||
|
|||
// 所选小组
|
|||
showGroupPicker() { |
|||
if ( this.data.districtPickerValue.length === 0) { |
|||
this.showToast("请先选择所在选区") |
|||
return false |
|||
} |
|||
this.setData({ |
|||
groupPickerVisible: true |
|||
}) |
|||
}, |
|||
onGroupPickerConfirm(e) { |
|||
this.setData({ |
|||
groupPickerValue: e.detail.value, |
|||
groupPickerLabel: e.detail.label |
|||
}) |
|||
}, |
|||
onGroupPickerCancel() { |
|||
this.setData({ |
|||
groupPickerVisible: false |
|||
}) |
|||
}, |
|||
onGroupPickerVisibleChange(e) { |
|||
this.setData({ |
|||
groupPickerVisible: e.detail.visible |
|||
}) |
|||
}, |
|||
|
|||
// 民族
|
|||
showNationPicker() { |
|||
this.setData({ |
|||
nationPickerVisible: true |
|||
}) |
|||
}, |
|||
onNationPickerConfirm(e) { |
|||
this.setData({ |
|||
nationPickerValue: e.detail.value, |
|||
nationPickerLabel: e.detail.label |
|||
}) |
|||
}, |
|||
onNationPickerCancel() { |
|||
this.setData({ |
|||
nationPickerVisible: false |
|||
}) |
|||
}, |
|||
onNationPickerVisibleChange(e) { |
|||
this.setData({ |
|||
nationPickerVisible: e.detail.visible |
|||
}) |
|||
}, |
|||
|
|||
// 参选原则
|
|||
showRulePicker() { |
|||
this.setData({ |
|||
rulePickerVisible: true |
|||
}) |
|||
}, |
|||
onRulePickerConfirm(e) { |
|||
this.setData({ |
|||
rulePickerValue: e.detail.value, |
|||
rulePickerLabel: e.detail.label |
|||
}) |
|||
}, |
|||
onRulePickerCancel() { |
|||
this.setData({ |
|||
rulePickerVisible: false |
|||
}) |
|||
}, |
|||
onRulePickerVisibleChange(e) { |
|||
this.setData({ |
|||
rulePickerVisible: e.detail.visible |
|||
}) |
|||
}, |
|||
|
|||
inputName(e) { |
|||
this.setData({ |
|||
name: e.detail.value |
|||
}) |
|||
}, |
|||
inputIdCard(e) { |
|||
this.setData({ |
|||
idCard: e.detail.value |
|||
}) |
|||
}, |
|||
inputAddress(e) { |
|||
this.setData({ |
|||
address: e.detail.value |
|||
}) |
|||
}, |
|||
inputTelephone(e) { |
|||
this.setData({ |
|||
telephone: e.detail.value |
|||
}) |
|||
}, |
|||
inputSmsCode(e) { |
|||
this.setData({ |
|||
smsCode: e.detail.value |
|||
}) |
|||
}, |
|||
inputNote(e) { |
|||
this.setData({ |
|||
note: e.detail.value |
|||
}) |
|||
}, |
|||
// 获取民族列表
|
|||
getNationList() { |
|||
return new Promise((resolve, reject) => { |
|||
api.getNationList().then(res => { |
|||
const arr = [] |
|||
res.data.forEach(item => { |
|||
arr.push({ |
|||
label: item.nationName, |
|||
value: item.nationNumericalCode |
|||
}) |
|||
}) |
|||
this.setData({ |
|||
nationPickerOptions: arr |
|||
}) |
|||
resolve(true) |
|||
}).catch(err => { |
|||
console.error(err) |
|||
reject(false) |
|||
}) |
|||
}) |
|||
}, |
|||
// 获取参选规则
|
|||
getRuleList() { |
|||
return new Promise((resolve, reject) => { |
|||
const params = { |
|||
configType: "2", |
|||
pid: "" |
|||
} |
|||
api.getVoterConfigList(params).then(res => { |
|||
console.log('参选规则列表', res) |
|||
const rulePickerOptions = [] |
|||
res.data.forEach(item => { |
|||
rulePickerOptions.push({ |
|||
label: item.configName, |
|||
value: item.configCode |
|||
}) |
|||
}) |
|||
this.setData({ |
|||
rulePickerOptions |
|||
}) |
|||
resolve(true) |
|||
}).catch(err => { |
|||
console.error(err) |
|||
reject(false) |
|||
}) |
|||
}) |
|||
}, |
|||
// 获取所选小区
|
|||
getDistrictList() { |
|||
return new Promise((resolve, reject) => { |
|||
const params = { |
|||
configType: "0", |
|||
pid: "" |
|||
} |
|||
api.getVoterConfigList(params).then(res => { |
|||
console.log('参选规则列表', res) |
|||
const districtPickerOptions = [] |
|||
res.data.forEach(item => { |
|||
districtPickerOptions.push({ |
|||
label: item.configName, |
|||
value: item.configCode, |
|||
id: item.id |
|||
}) |
|||
}) |
|||
this.setData({ |
|||
districtPickerOptions |
|||
}) |
|||
resolve(true) |
|||
}).catch(err => { |
|||
console.error(err) |
|||
reject(false) |
|||
}) |
|||
}) |
|||
}, |
|||
// 获取所在小组
|
|||
getGroupList() { |
|||
let pid = '' |
|||
this.data.districtPickerOptions.forEach(item => { |
|||
if (item.value === this.data.districtPickerValue[0]) { |
|||
pid = item.id |
|||
} |
|||
}) |
|||
const params = { |
|||
configType: "1", |
|||
pid |
|||
} |
|||
api.getVoterConfigList(params).then(res => { |
|||
console.log('参选规则列表', res) |
|||
const groupPickerOptions = [] |
|||
res.data.forEach(item => { |
|||
groupPickerOptions.push({ |
|||
label: item.configName, |
|||
value: item.configCode |
|||
}) |
|||
}) |
|||
this.setData({ |
|||
groupPickerOptions |
|||
}) |
|||
}).catch(err => { |
|||
console.error(err) |
|||
}) |
|||
}, |
|||
// 获取验证码
|
|||
getSmsCode () { |
|||
if (!this.data.telephone.trim('')) { |
|||
this.showToast("请先输入手机号") |
|||
return false |
|||
} |
|||
this.setData({ |
|||
smsCodeText: "获取中..." |
|||
}) |
|||
const mobile = this.data.telephone.trim('') |
|||
api.sendSms(mobile).then(() => { |
|||
this.showToast("验证码发送成功") |
|||
let num = 60 |
|||
this.setData({ |
|||
smsCodeText: "60s后重新获取" |
|||
}) |
|||
const timer = setInterval(() => { |
|||
if (num >= 1) { |
|||
this.setData({ |
|||
smsCodeText: `${num}s后重新获取` |
|||
}) |
|||
--num |
|||
} else { |
|||
clearInterval(timer) |
|||
this.setData({ |
|||
smsCodeText: "获取验证码" |
|||
}) |
|||
} |
|||
}, 1000) |
|||
}).catch(err => { |
|||
console.log(err) |
|||
this.setData({ |
|||
smsCodeText: "获取验证码" |
|||
}) |
|||
}) |
|||
}, |
|||
// 提交选民登记
|
|||
submitVoter() { |
|||
if (!this.data.protocolChecked) { |
|||
this.showToast('请勾选底部按钮') |
|||
return false |
|||
} |
|||
const { id, districtPickerValue, groupPickerValue, name, nationPickerValue, nationPickerLabel, idCard, address, rulePickerValue, note, telephone, smsCode } = this.data |
|||
if (districtPickerValue.length === 0) { |
|||
this.showToast('请选择所属选区') |
|||
return false |
|||
} else if (groupPickerValue.length === 0) { |
|||
this.showToast('请选择所在小组') |
|||
return false |
|||
} else if (!name) { |
|||
this.showToast('请输入真实姓名') |
|||
return false |
|||
} else if (nationPickerValue.length === 0) { |
|||
this.showToast('请选择民族') |
|||
return false |
|||
} else if (!idCard) { |
|||
this.showToast('请输入身份证号') |
|||
return false |
|||
} else if (!address) { |
|||
this.showToast('请输入户籍地址') |
|||
return false |
|||
} else if (rulePickerValue.length === 0) { |
|||
this.showToast('请选择参选原则') |
|||
return false |
|||
} else if (!telephone) { |
|||
this.showToast('请输入手机号码') |
|||
return false |
|||
} else if (!smsCode) { |
|||
this.showToast('请输入验证码') |
|||
return false |
|||
} |
|||
const params = { |
|||
id, |
|||
constituencyCode: districtPickerValue[0], |
|||
groupCode: groupPickerValue[0], |
|||
name, |
|||
nationName: nationPickerLabel, |
|||
nationNumericalCode: nationPickerValue[0], |
|||
idNumber: idCard, |
|||
domicile: address, |
|||
participationPrincipleCode: rulePickerValue[0], |
|||
remark: note, |
|||
mobile: telephone, |
|||
smsCode |
|||
} |
|||
wx.showLoading({ |
|||
title: '提交中...' |
|||
}) |
|||
this.setData({ |
|||
submitBtnDisabled: true |
|||
}) |
|||
api.submitVote(params).then(res => { |
|||
this.showToast('提交成功') |
|||
setTimeout(() => { |
|||
wx.navigateBack({ |
|||
delta: 1 |
|||
}); |
|||
}, 1000) |
|||
}).catch(err => { |
|||
console.error(err) |
|||
}).finally(() => { |
|||
this.setData({ |
|||
submitBtnDisabled: false |
|||
}) |
|||
}) |
|||
}, |
|||
// 获取详情
|
|||
getVoterDetail() { |
|||
api.getVoterDetail().then(res => { |
|||
if (res.data) { |
|||
const { id, constituencyCode, groupCode, name, nationNumericalCode, idNumber, domicile, participationPrincipleCode, remark, mobile } = res.data |
|||
let pid = '' |
|||
let districtPickerLabel = '' |
|||
this.data.districtPickerOptions.forEach(item => { |
|||
if (item.value === constituencyCode) { |
|||
districtPickerLabel = item.label |
|||
pid = item.id |
|||
} |
|||
}) |
|||
let nationPickerLabel = '' |
|||
this.data.nationPickerOptions.forEach(item => { |
|||
if (item.value === nationNumericalCode) { |
|||
nationPickerLabel = item.label |
|||
} |
|||
}) |
|||
let rulePickerLabel = '' |
|||
this.data.rulePickerOptions.forEach(item => { |
|||
if (item.value === participationPrincipleCode) { |
|||
rulePickerLabel = item.label |
|||
} |
|||
}) |
|||
this.getGroupDetail({ pid, groupCode }) |
|||
this.setData({ |
|||
id, |
|||
districtPickerLabel, |
|||
districtPickerValue: [constituencyCode], |
|||
name, |
|||
nationPickerLabel, |
|||
nationPickerValue: [nationNumericalCode], |
|||
idCard: idNumber, |
|||
address: domicile, |
|||
rulePickerLabel, |
|||
rulePickerValue: participationPrincipleCode, |
|||
note: remark, |
|||
telephone: mobile |
|||
}) |
|||
} |
|||
}).catch(err => { |
|||
console.error(err) |
|||
}) |
|||
}, |
|||
// 所选小组回显
|
|||
getGroupDetail({ pid, groupCode }) { |
|||
const params = { |
|||
configType: "1", |
|||
pid |
|||
} |
|||
api.getVoterConfigList(params).then(res => { |
|||
console.log('参选规则列表', res) |
|||
const groupPickerOptions = [] |
|||
res.data.forEach(item => { |
|||
groupPickerOptions.push({ |
|||
label: item.configName, |
|||
value: item.configCode |
|||
}) |
|||
}) |
|||
let groupPickerLabel = '' |
|||
groupPickerOptions.forEach(item => { |
|||
if (item.value === groupCode) { |
|||
groupPickerLabel = item.label |
|||
} |
|||
}) |
|||
this.setData({ |
|||
groupPickerLabel, |
|||
groupPickerOptions, |
|||
groupPickerValue: [groupCode] |
|||
}) |
|||
}).catch(err => { |
|||
console.error(err) |
|||
}) |
|||
}, |
|||
// 代码简化，弹窗统一封装
|
|||
showToast (title) { |
|||
wx.showToast({ |
|||
title: title, |
|||
icon: "none", |
|||
duration: 2000 |
|||
}) |
|||
}, |
|||
// 用户协议点选按钮
|
|||
changeCheckedState() { |
|||
this.setData({ |
|||
protocolChecked: !this.data.protocolChecked |
|||
}) |
|||
} |
|||
}) |
|||
@ -0,0 +1,6 @@ |
|||
{ |
|||
"navigationBarTitleText": "选民登记", |
|||
"usingComponents": { |
|||
"wux-picker": "/dist/picker/index" |
|||
} |
|||
} |
|||
@ -0,0 +1,86 @@ |
|||
<view class="register"> |
|||
<view class="register-item"> |
|||
<view class="label">所在选区</view> |
|||
<view class="content" bindtap="showDistrictPicker"> |
|||
<view class="tip" wx:if="{{!districtPickerLabel}}">请选择所属的选区</view> |
|||
<view class="select-content" wx:else>{{districtPickerLabel}}</view> |
|||
<view class="trigger"></view> |
|||
</view> |
|||
<wux-picker visible="{{ districtPickerVisible }}" controlled options="{{ districtPickerOptions }}" value="{{ districtPickerValue }}" bind:confirm="onDistrictPickerConfirm" bind:cancel="onDistrictPickerCancel" bind:visibleChange="onDistrictPickerVisibleChange"></wux-picker> |
|||
</view> |
|||
<view class="register-item"> |
|||
<view class="label">所在小组</view> |
|||
<view class="content" bindtap="showGroupPicker"> |
|||
<view class="tip" wx:if="{{!groupPickerLabel}}">请选择所属的选民小组</view> |
|||
<view class="select-content" wx:else>{{groupPickerLabel}}</view> |
|||
<view class="trigger"></view> |
|||
</view> |
|||
<wux-picker visible="{{ groupPickerVisible }}" controlled options="{{ groupPickerOptions }}" value="{{ groupPickerValue }}" bind:confirm="onGroupPickerConfirm" bind:cancel="onGroupPickerCancel" bind:visibleChange="onGroupPickerVisibleChange"></wux-picker> |
|||
</view> |
|||
<view class="register-item"> |
|||
<view class="label">姓名</view> |
|||
<view class="content"> |
|||
<input value="{{name}}" bind:input="inputName" type="text" placeholder="请输入真实姓名" /> |
|||
</view> |
|||
</view> |
|||
<view class="register-item"> |
|||
<view class="label">民族</view> |
|||
<view class="content" bindtap="showNationPicker"> |
|||
<view class="tip" wx:if="{{!nationPickerLabel}}">请选择你的民族</view> |
|||
<view class="select-content" wx:else>{{nationPickerLabel}}</view> |
|||
<view class="trigger"></view> |
|||
</view> |
|||
<wux-picker visible="{{ nationPickerVisible }}" controlled options="{{ nationPickerOptions }}" value="{{ nationPickerValue }}" bind:confirm="onNationPickerConfirm" bind:cancel="onNationPickerCancel" bind:visibleChange="onNationPickerVisibleChange"></wux-picker> |
|||
</view> |
|||
<view class="register-item"> |
|||
<view class="label">身份证号</view> |
|||
<view class="content"> |
|||
<input value="{{idCard}}" bind:input="inputIdCard" type="idcard" placeholder="请输入身份证号" /> |
|||
</view> |
|||
</view> |
|||
<view class="register-item"> |
|||
<view class="label">户籍地址</view> |
|||
<view class="content"> |
|||
<input value="{{address}}" bind:input="inputAddress" type="text" placeholder="请输入户籍地址" /> |
|||
</view> |
|||
</view> |
|||
<view class="register-item"> |
|||
<view class="label">参选原则</view> |
|||
<view class="content" bindtap="showRulePicker"> |
|||
<view class="tip" wx:if="{{!rulePickerLabel}}">请选择参选原则</view> |
|||
<view class="select-content" wx:else>{{rulePickerLabel}}</view> |
|||
<view class="trigger"></view> |
|||
</view> |
|||
<wux-picker visible="{{ rulePickerVisible }}" controlled options="{{ rulePickerOptions }}" value="{{ rulePickerValue }}" bind:confirm="onRulePickerConfirm" bind:cancel="onRulePickerCancel" bind:visibleChange="onRulePickerVisibleChange"></wux-picker> |
|||
</view> |
|||
<view class="register-item"> |
|||
<view class="label">手机号码</view> |
|||
<view class="content"> |
|||
<input value="{{telephone}}" bind:input="inputTelephone" type="number" placeholder="请输入手机号码" /> |
|||
<button disabled="{{smsCodeText !== '获取验证码'}}" bindtap="getSmsCode" hover-class="button-hover" class="get-code"> |
|||
{{smsCodeText}} |
|||
</button> |
|||
</view> |
|||
</view> |
|||
<view class="register-item"> |
|||
<view class="label">验证码</view> |
|||
<view class="content"> |
|||
<input value="{{smsCode}}" bind:input="inputSmsCode" type="number" placeholder="请输入验证码" /> |
|||
</view> |
|||
</view> |
|||
<view class="multi-register-item"> |
|||
<view class="label">备注</view> |
|||
<view class="content"> |
|||
<textarea value="{{note}}" bind:input="inputNote" placeholder="请输入备注" auto-height rows="3"></textarea> |
|||
</view> |
|||
</view> |
|||
<view class="protocol-container"> |
|||
<radio checked="{{protocolChecked}}" color="#df0006" bindtap="changeCheckedState"></radio> |
|||
<view class="protocol-content">本人承诺对所填写的内容真实性负责</view> |
|||
</view> |
|||
<view class="confirm-container"> |
|||
<view bindtap="submitVoter" class="confirm-btn" disabled="{{submitBtnDisabled}}" hover-class="hover-confirm-btn" hover-stay-time="150"> |
|||
确定 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
@ -0,0 +1,173 @@ |
|||
.register { |
|||
width: 100%; |
|||
} |
|||
|
|||
.register .register-item { |
|||
width: 100%; |
|||
height: 80rpx; |
|||
box-sizing: border-box; |
|||
padding: 0px 30rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
position: relative; |
|||
} |
|||
.register .register-item::before { |
|||
content: "*"; |
|||
position: absolute; |
|||
color: red; |
|||
left: 12rpx; |
|||
top: 25rpx; |
|||
} |
|||
|
|||
.register .register-item + .register-item { |
|||
margin-top: 35rpx; |
|||
} |
|||
|
|||
.register .register-item .label { |
|||
width: 140rpx; |
|||
height: 80rpx; |
|||
line-height: 80rpx; |
|||
color: #333; |
|||
font-size: 34rpx; |
|||
text-align: justify; |
|||
} |
|||
|
|||
.register .register-item .label:after { |
|||
content: ''; |
|||
width: 100%; |
|||
height: 0; |
|||
display: inline-block; |
|||
} |
|||
|
|||
.register .register-item .content { |
|||
width: calc(100% - 140rpx - 20rpx); |
|||
height: 100%; |
|||
background: #F0F0F0; |
|||
border-radius: 6px; |
|||
box-sizing: border-box; |
|||
padding: 0 30rpx; |
|||
margin-left: 20rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
} |
|||
|
|||
.register .register-item .content .tip { |
|||
font-size: 30rpx; |
|||
color: #7A7A7A; |
|||
} |
|||
|
|||
.register .register-item .content .select-content { |
|||
font-size: 30rpx; |
|||
color: #333; |
|||
} |
|||
|
|||
.register .register-item .content .trigger { |
|||
width: 0px; |
|||
height: 0px; |
|||
border: 16rpx solid transparent; |
|||
border-top: 16rpx solid #c2c2c2; |
|||
position: relative; |
|||
top: 4px; |
|||
} |
|||
|
|||
.register .register-item .content input { |
|||
width: 100%; |
|||
height: 100%; |
|||
} |
|||
|
|||
.register .register-item .content .get-code { |
|||
flex-shrink: 0; |
|||
padding: 0 15rpx; |
|||
height: 50rpx; |
|||
line-height: 50rpx; |
|||
background: linear-gradient(to right, #db1a1f, #e95027); |
|||
color: #fff; |
|||
font-size: 24rpx; |
|||
border-radius: 10rpx; |
|||
margin: 0; |
|||
margin-left: 25rpx; |
|||
} |
|||
|
|||
.register .register-item .content .button-hover { |
|||
background: rgb(175, 1, 1); |
|||
} |
|||
|
|||
.register .multi-register-item { |
|||
display: flex; |
|||
min-height: 80rpx; |
|||
box-sizing: border-box; |
|||
padding: 0 30rpx; |
|||
margin-top: 35rpx; |
|||
} |
|||
|
|||
.register .multi-register-item .label { |
|||
width: 140rpx; |
|||
height: 80rpx; |
|||
line-height: 80rpx; |
|||
color: #333; |
|||
font-size: 34rpx; |
|||
text-align: justify; |
|||
} |
|||
|
|||
.register .multi-register-item .label:after { |
|||
content: ''; |
|||
width: 100%; |
|||
height: 0; |
|||
display: inline-block; |
|||
} |
|||
|
|||
.register .multi-register-item .content { |
|||
width: calc(100% - 140rpx - 20rpx); |
|||
height: 100%; |
|||
background: #F0F0F0; |
|||
border-radius: 6px; |
|||
box-sizing: border-box; |
|||
padding: 15rpx 30rpx 0rpx; |
|||
margin-left: 20rpx; |
|||
} |
|||
|
|||
.register .multi-register-item .content textarea { |
|||
width: 100%; |
|||
min-height: 60rpx; |
|||
padding-bottom: 30rpx; |
|||
} |
|||
|
|||
.protocol-container { |
|||
width: 100%; |
|||
height: 100rpx; |
|||
box-sizing: border-box; |
|||
padding: 0px 30rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
} |
|||
|
|||
.protocol-container .protocol-content { |
|||
color: #7A7A7A; |
|||
font-size: 30rpx; |
|||
margin-left: 10rpx; |
|||
} |
|||
|
|||
.confirm-container { |
|||
width: 100%; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
margin: 100rpx 0; |
|||
} |
|||
|
|||
.confirm-container .confirm-btn { |
|||
width: 560rpx; |
|||
height: 85rpx; |
|||
border-radius: 40rpx; |
|||
background: #df0006; |
|||
color: #fff; |
|||
font-size: 34rpx; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
|
|||
.confirm-container .hover-confirm-btn { |
|||
background: #b30006; |
|||
} |
|||
Loading…
Reference in new issue