✨ feat(新增活动): 录入年龄端逻辑调整

 <!--
  * @Date: 2022-09-27 17:13:05
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2022-10-20 15:44:06
+ * @LastEditTime: 2022-10-20 16:48:22
  * @FilePath: /swx/src/pages/joinActivity/index.vue
  * @Description: 活动报名
 -->
@@ -17,7 +17,7 @@
     <view class="at-input">
       <view class="at-input__container">
         <label class="h5-label at-input__title at-input__title--required">年龄段</label>
-        <input @tap="show_popup=true" class="h5-input at-input__input" placeholder-class="placeholder" :value="age_range" placeholder="请选择年龄范围" :disabled="true"/>
+        <input @tap="show_popup=true" class="h5-input at-input__input" placeholder-class="placeholder" :value="age_group" placeholder="请选择年龄范围" :disabled="true"/>
         <view style="margin-right: 1rem; margin-top: 0.5rem;"><van-icon :name="icon_sel" color="" /></view>
       </view>
     </view>
@@ -48,7 +48,7 @@
   <bottom-button @on-submit="onSubmit">确认报名</bottom-button>
 
   <!-- 年龄段弹出框 -->
-  <van-popup :show="show_popup" position="bottom" custom-style="height: 30%;" :lock-scroll="true">
+  <!-- <van-popup :show="show_popup" position="bottom" custom-style="height: 30%;" :lock-scroll="true">
     <view class="limit-wrapper">
       <view class="form-item border">
         <view class="form-item-title fix">年龄最小值</view>
@@ -79,6 +79,11 @@
         </view>
       </van-col>
     </van-row>
+  </van-popup> -->
+  <van-popup :show="show_popup" position="bottom" custom-style="height: 40%;" :lock-scroll="true">
+    <van-picker :show-toolbar="true" title="" confirm-button-text="确定" :columns="age_columns"
+      :default-index="defaultIndex"
+      toolbar-class="picker-toolbar" @confirm="onAgeConfirm" @cancel="onAgeCancel" @change="onAgeChange" />
   </van-popup>
   <van-toast id="van-toast" />
 </template>
@@ -98,11 +103,8 @@ import Toast from '@/components/vant-weapp/toast/toast';
 
 const username = ref('');
 const phone = ref('');
-const age_range = ref('');
 const user_sex = ref('');
 const fields = ref([]);
-const min_number = ref('');
-const max_number = ref('');
 
 onMounted(async () => {
   const { code, data } = await activityInfoAPI({ i: getCurrentPageParam().id });
@@ -115,49 +117,22 @@ onMounted(async () => {
   }
 })
 
-const temp_min_number = ref('');
-const changeMinNumber = ({detail}) => {
-  const pattern = /^([1-9][0-9]*){1,3}$/; // 非零正整数
-  if (!pattern.test(detail)) {// 如果包含特殊字符返回false
-    Toast('请输入非零正整数');
-    return false;
-  }
-  temp_min_number.value = detail;
-}
-const temp_max_number = ref('');
-const changeMaxNumber = ({detail}) => {
-  const pattern = /^([1-9][0-9]*){1,3}$/; // 非零正整数
-  if (!pattern.test(detail)) {// 如果包含特殊字符返回false
-    Toast('请输入非零正整数');
-    return false;
-  }
-  temp_max_number.value = detail;
-}
-
 const onSexChange = ({ detail }) => {
   user_sex.value = detail;
 }
 
 const show_popup = ref(false);
-const closeEditLimit = () => {
+const age_group = ref('');
+const age_columns = ['10-19岁', '20-29岁', '30-39岁', '40-49岁', '50-59岁', '60-69岁', '70-79岁', '80岁以上']
+const defaultIndex = ref(0);
+const onAgeChange = (event) => {
+}
+const onAgeConfirm = (event) => {
+  const detail = event.detail;
+  age_group.value = detail.value;
   show_popup.value = false;
 }
-const confirmEditLimit = () => {
-  if (!temp_min_number.value) {
-    Toast('年龄最小值不能为空');
-    return false;
-  }
-  if (!temp_max_number.value) {
-    Toast('年龄最大值不能为空');
-    return false;
-  }
-  if (+temp_min_number.value > +temp_max_number.value) {
-    Toast('年龄段非法录入');
-    return false;
-  }
-  min_number.value = +temp_min_number.value;
-  max_number.value = +temp_max_number.value;
-  age_range.value = min_number.value + '岁' + ' ~ ' + max_number.value + '岁';
+const onAgeCancel = (event) => {
   show_popup.value = false;
 }
 
@@ -174,7 +149,7 @@ const validForm = () => {
   if (!pattern.test(phone.value)) {
     Toast('请输入正确手机号');
   }
-  if (!age_range.value) {
+  if (!age_group.value) {
     Toast('年龄段不能为空');
     return false;
   }
@@ -204,9 +179,9 @@ const onSubmit = async (val) => {
       name: username.value,
       phone: phone.value,
       gender: user_sex.value,
-      age_group: JSON.stringify([min_number.value, max_number.value]),
+      age_group: age_group.value,
       post: '',
-      extend
+      extend: JSON.stringify(extend)
     }
     const { code } = await addRegAPI(params);
     if (code) {