Showing
1 changed file
with
20 additions
and
45 deletions
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date: 2022-09-27 17:13:05 | 2 | * @Date: 2022-09-27 17:13:05 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2022-10-20 15:44:06 | 4 | + * @LastEditTime: 2022-10-20 16:48:22 |
| 5 | * @FilePath: /swx/src/pages/joinActivity/index.vue | 5 | * @FilePath: /swx/src/pages/joinActivity/index.vue |
| 6 | * @Description: 活动报名 | 6 | * @Description: 活动报名 |
| 7 | --> | 7 | --> |
| ... | @@ -17,7 +17,7 @@ | ... | @@ -17,7 +17,7 @@ |
| 17 | <view class="at-input"> | 17 | <view class="at-input"> |
| 18 | <view class="at-input__container"> | 18 | <view class="at-input__container"> |
| 19 | <label class="h5-label at-input__title at-input__title--required">年龄段</label> | 19 | <label class="h5-label at-input__title at-input__title--required">年龄段</label> |
| 20 | - <input @tap="show_popup=true" class="h5-input at-input__input" placeholder-class="placeholder" :value="age_range" placeholder="请选择年龄范围" :disabled="true"/> | 20 | + <input @tap="show_popup=true" class="h5-input at-input__input" placeholder-class="placeholder" :value="age_group" placeholder="请选择年龄范围" :disabled="true"/> |
| 21 | <view style="margin-right: 1rem; margin-top: 0.5rem;"><van-icon :name="icon_sel" color="" /></view> | 21 | <view style="margin-right: 1rem; margin-top: 0.5rem;"><van-icon :name="icon_sel" color="" /></view> |
| 22 | </view> | 22 | </view> |
| 23 | </view> | 23 | </view> |
| ... | @@ -48,7 +48,7 @@ | ... | @@ -48,7 +48,7 @@ |
| 48 | <bottom-button @on-submit="onSubmit">确认报名</bottom-button> | 48 | <bottom-button @on-submit="onSubmit">确认报名</bottom-button> |
| 49 | 49 | ||
| 50 | <!-- 年龄段弹出框 --> | 50 | <!-- 年龄段弹出框 --> |
| 51 | - <van-popup :show="show_popup" position="bottom" custom-style="height: 30%;" :lock-scroll="true"> | 51 | + <!-- <van-popup :show="show_popup" position="bottom" custom-style="height: 30%;" :lock-scroll="true"> |
| 52 | <view class="limit-wrapper"> | 52 | <view class="limit-wrapper"> |
| 53 | <view class="form-item border"> | 53 | <view class="form-item border"> |
| 54 | <view class="form-item-title fix">年龄最小值</view> | 54 | <view class="form-item-title fix">年龄最小值</view> |
| ... | @@ -79,6 +79,11 @@ | ... | @@ -79,6 +79,11 @@ |
| 79 | </view> | 79 | </view> |
| 80 | </van-col> | 80 | </van-col> |
| 81 | </van-row> | 81 | </van-row> |
| 82 | + </van-popup> --> | ||
| 83 | + <van-popup :show="show_popup" position="bottom" custom-style="height: 40%;" :lock-scroll="true"> | ||
| 84 | + <van-picker :show-toolbar="true" title="" confirm-button-text="确定" :columns="age_columns" | ||
| 85 | + :default-index="defaultIndex" | ||
| 86 | + toolbar-class="picker-toolbar" @confirm="onAgeConfirm" @cancel="onAgeCancel" @change="onAgeChange" /> | ||
| 82 | </van-popup> | 87 | </van-popup> |
| 83 | <van-toast id="van-toast" /> | 88 | <van-toast id="van-toast" /> |
| 84 | </template> | 89 | </template> |
| ... | @@ -98,11 +103,8 @@ import Toast from '@/components/vant-weapp/toast/toast'; | ... | @@ -98,11 +103,8 @@ import Toast from '@/components/vant-weapp/toast/toast'; |
| 98 | 103 | ||
| 99 | const username = ref(''); | 104 | const username = ref(''); |
| 100 | const phone = ref(''); | 105 | const phone = ref(''); |
| 101 | -const age_range = ref(''); | ||
| 102 | const user_sex = ref(''); | 106 | const user_sex = ref(''); |
| 103 | const fields = ref([]); | 107 | const fields = ref([]); |
| 104 | -const min_number = ref(''); | ||
| 105 | -const max_number = ref(''); | ||
| 106 | 108 | ||
| 107 | onMounted(async () => { | 109 | onMounted(async () => { |
| 108 | const { code, data } = await activityInfoAPI({ i: getCurrentPageParam().id }); | 110 | const { code, data } = await activityInfoAPI({ i: getCurrentPageParam().id }); |
| ... | @@ -115,49 +117,22 @@ onMounted(async () => { | ... | @@ -115,49 +117,22 @@ onMounted(async () => { |
| 115 | } | 117 | } |
| 116 | }) | 118 | }) |
| 117 | 119 | ||
| 118 | -const temp_min_number = ref(''); | ||
| 119 | -const changeMinNumber = ({detail}) => { | ||
| 120 | - const pattern = /^([1-9][0-9]*){1,3}$/; // 非零正整数 | ||
| 121 | - if (!pattern.test(detail)) {// 如果包含特殊字符返回false | ||
| 122 | - Toast('请输入非零正整数'); | ||
| 123 | - return false; | ||
| 124 | - } | ||
| 125 | - temp_min_number.value = detail; | ||
| 126 | -} | ||
| 127 | -const temp_max_number = ref(''); | ||
| 128 | -const changeMaxNumber = ({detail}) => { | ||
| 129 | - const pattern = /^([1-9][0-9]*){1,3}$/; // 非零正整数 | ||
| 130 | - if (!pattern.test(detail)) {// 如果包含特殊字符返回false | ||
| 131 | - Toast('请输入非零正整数'); | ||
| 132 | - return false; | ||
| 133 | - } | ||
| 134 | - temp_max_number.value = detail; | ||
| 135 | -} | ||
| 136 | - | ||
| 137 | const onSexChange = ({ detail }) => { | 120 | const onSexChange = ({ detail }) => { |
| 138 | user_sex.value = detail; | 121 | user_sex.value = detail; |
| 139 | } | 122 | } |
| 140 | 123 | ||
| 141 | const show_popup = ref(false); | 124 | const show_popup = ref(false); |
| 142 | -const closeEditLimit = () => { | 125 | +const age_group = ref(''); |
| 126 | +const age_columns = ['10-19岁', '20-29岁', '30-39岁', '40-49岁', '50-59岁', '60-69岁', '70-79岁', '80岁以上'] | ||
| 127 | +const defaultIndex = ref(0); | ||
| 128 | +const onAgeChange = (event) => { | ||
| 129 | +} | ||
| 130 | +const onAgeConfirm = (event) => { | ||
| 131 | + const detail = event.detail; | ||
| 132 | + age_group.value = detail.value; | ||
| 143 | show_popup.value = false; | 133 | show_popup.value = false; |
| 144 | } | 134 | } |
| 145 | -const confirmEditLimit = () => { | 135 | +const onAgeCancel = (event) => { |
| 146 | - if (!temp_min_number.value) { | ||
| 147 | - Toast('年龄最小值不能为空'); | ||
| 148 | - return false; | ||
| 149 | - } | ||
| 150 | - if (!temp_max_number.value) { | ||
| 151 | - Toast('年龄最大值不能为空'); | ||
| 152 | - return false; | ||
| 153 | - } | ||
| 154 | - if (+temp_min_number.value > +temp_max_number.value) { | ||
| 155 | - Toast('年龄段非法录入'); | ||
| 156 | - return false; | ||
| 157 | - } | ||
| 158 | - min_number.value = +temp_min_number.value; | ||
| 159 | - max_number.value = +temp_max_number.value; | ||
| 160 | - age_range.value = min_number.value + '岁' + ' ~ ' + max_number.value + '岁'; | ||
| 161 | show_popup.value = false; | 136 | show_popup.value = false; |
| 162 | } | 137 | } |
| 163 | 138 | ||
| ... | @@ -174,7 +149,7 @@ const validForm = () => { | ... | @@ -174,7 +149,7 @@ const validForm = () => { |
| 174 | if (!pattern.test(phone.value)) { | 149 | if (!pattern.test(phone.value)) { |
| 175 | Toast('请输入正确手机号'); | 150 | Toast('请输入正确手机号'); |
| 176 | } | 151 | } |
| 177 | - if (!age_range.value) { | 152 | + if (!age_group.value) { |
| 178 | Toast('年龄段不能为空'); | 153 | Toast('年龄段不能为空'); |
| 179 | return false; | 154 | return false; |
| 180 | } | 155 | } |
| ... | @@ -204,9 +179,9 @@ const onSubmit = async (val) => { | ... | @@ -204,9 +179,9 @@ const onSubmit = async (val) => { |
| 204 | name: username.value, | 179 | name: username.value, |
| 205 | phone: phone.value, | 180 | phone: phone.value, |
| 206 | gender: user_sex.value, | 181 | gender: user_sex.value, |
| 207 | - age_group: JSON.stringify([min_number.value, max_number.value]), | 182 | + age_group: age_group.value, |
| 208 | post: '', | 183 | post: '', |
| 209 | - extend | 184 | + extend: JSON.stringify(extend) |
| 210 | } | 185 | } |
| 211 | const { code } = await addRegAPI(params); | 186 | const { code } = await addRegAPI(params); |
| 212 | if (code) { | 187 | if (code) { | ... | ... |
-
Please register or login to post a comment