1

src/pages/signUp/addPost.vue

@@ -176,7 +176,7 @@
                 </view>
 
                 <form-item title="年龄" icon="" :required="true">
-                    <wd-col-picker
+                    <!-- <wd-col-picker
                         v-model="ageValue"
                         :columns="ageColumns"
                         :column-change="ageColumnChange"
@@ -186,7 +186,10 @@
                         <view :class="`inner flex-between ${item.ageText ? '' : 'placeholder'}`">
                             {{ item.ageText || "请选择年龄范围" }}
                         </view>
-                    </wd-col-picker>
+                    </wd-col-picker> -->
+                    <view @click="showAgeSelect(index)" :class="`inner flex-between ${item.ageText ? '' : 'placeholder'}`">
+                        {{ item.ageText || "请选择年龄范围" }}
+                    </view>
                 </form-item>
                 <form-row :fill="false">
                     <form-item title="专业技术职称（选填）" icon="edit">
@@ -277,6 +280,17 @@
                 ><wd-button style="width: 80%" @click="handleClose" block :round="false">确定</wd-button></view
             >
         </wd-popup>
+        <!-- 年龄选择器 -->
+        <wd-action-sheet v-model="isShowAgeSelect" title="年龄选择" :actions="actions" @close="close">
+            <div class="age-action-sheet">
+                <div class="age-select-tips">
+                    <p>最小年龄</p>
+                    <p>最大年龄</p>
+                </div>
+                <wd-picker-view :columns="ageColumns" v-model="ageValue" :column-change="onChangeAge" />
+                <wd-button block @click="ageSelectConfirm">确认</wd-button>
+            </div>
+        </wd-action-sheet>
         <wd-tabbar
             v-if="pageType == 'update'"
             custom-style="display: flex;justify-content: center !important;z-index:1;"
@@ -314,6 +328,7 @@ import town from "@/assets/town.json";
 import { getEumData } from "@/utils/utils";
 const tab = ref(0);
 const value = ref([]);
+const ageValue = ref(["", ""]);
 const gwList = ref([]);
 const columns = ref([]);
 /* 获取省市区 */
@@ -347,7 +362,7 @@ const pageType = ref("");
 
 /* 等级选择项 */
 const levelOptions = ref(["初级", "中级", "高级", "高级以上"]);
-const ageValue = ref([]);
+const isShowAgeSelect = ref(false);
 const ageColumns = ref([]);
 const jobForm = ref([
     {
@@ -495,7 +510,16 @@ const initageColumns = () => {
             next: true
         });
     }
-    ageColumns.value.push(temp);
+    // columns.value.push(temp);
+    ageColumns.value = [temp, temp];
+    // for (let i = 16; i < 81; i++) {
+    //     temp.push({
+    //         value: i,
+    //         label: i + "岁",
+    //         next: true
+    //     });
+    // }
+    // ageColumns.value.push(temp);
 };
 initageColumns();
 const getEnumWorkMode = async () => {
@@ -591,6 +615,55 @@ const handleConfirmCity = (params, item) => {
     item.districtCode = district?.code;
     item.street = street ? street.name : "";
 };
+
+const onChangeAge = (pickerView, value, columnIndex, resolve) => {
+    const minAge = 16;
+    const maxAge = 81;
+    const createColumns = (min, max) => {
+        const temp = [];
+        for (let i = min; i < max; i++) {
+            temp.push({
+                value: i,
+                label: i + "岁",
+                next: true
+            });
+        }
+        return temp;
+    };
+    if (columnIndex === 0) {
+        const min = value[0].value;
+        const columns = min
+            ? createColumns(min, maxAge)
+            : [
+                  {
+                      value: "",
+                      label: "不限",
+                      next: false
+                  }
+              ];
+        pickerView.setColumnData(1, columns);
+    }
+
+    // console.log(pickerView, "value", value, "columnIndex", columnIndex, resolve);
+    resolve();
+};
+
+const ageSelectConfirm = () => {
+    if (ageValue.value[0]) {
+        const [min, max] = ageValue.value;
+        jobForm.value[activeIndex.value].ageText = `${ageValue.value[0]}-${ageValue.value[1]}岁`;
+        jobForm.value[activeIndex.value].minAgeRequirement = min;
+        jobForm.value[activeIndex.value].maxAgeRequirement = max;
+    } else {
+        jobForm.value[activeIndex.value].ageText = "不限";
+    }
+    isShowAgeSelect.value = false;
+};
+const showAgeSelect = index => {
+    isShowAgeSelect.value = true;
+    activeIndex.value = index;
+    console.log("activeIndex.value ", activeIndex.value);
+};
 // 地址
 
 // 薪资-fun
@@ -898,6 +971,19 @@ function addPost() {
 <style lang="scss" scoped>
 .page {
     width: 100%;
+
+    .age-action-sheet {
+        .age-select-tips {
+            display: flex;
+            p {
+                flex: 1;
+                text-align: center;
+            }
+        }
+        .wd-button {
+            margin: 32rpx;
+        }
+    }
     .title-box {
         box-sizing: border-box;
         display: flex;