Commit 63453188 authored by tao.huang's avatar tao.huang

fix: 修复选择器、注册

parent 5167dfb5
......@@ -8,13 +8,20 @@
class="baby-item"
@click="selectBaby(baby)"
>
<text>{{ baby.babyName || "暂无昵称" }}</text>
<text v-if="baby.babyStage == 0">备孕</text>
<text v-else-if="baby.babyStage == 1">孕中</text>
<text v-else>{{ baby.babyName || "暂无昵称" }}</text>
<view
class="selected-icon"
:style="{ backgroundColor: baby.selected ? '#d3a358' : '#E8E8E8' }"
/>
</view>
<view v-if="babyList.length < 3" class="baby-item add-item" @click="onAdd">
<view
v-if="babyList.length < 3"
class="baby-item add-item"
@click="onAdd"
>
<image :src="addIcon" class="add-icon" />
</view>
</view>
......
......@@ -23,6 +23,7 @@
mask-style="background: rgb(246, 248, 250); z-index: 0;"
indicator-style="border-radius: 10px; height: 50px; background:#ffffff; z-index:0"
:value="pickerValue"
:immediate-change="true"
@change="onChange"
>
<template v-if="mode === 'date'">
......@@ -118,18 +119,8 @@ const futureYear = futureDate.getFullYear();
const futureMonth = futureDate.getMonth() + 1;
const futureDay = futureDate.getDate();
// 工具函数:根据日期字符串获取索引
function getPickerIndexByDate(dateStr) {
if (!dateStr) return null;
const [year, month, day] = dateStr.split('-').map(Number);
const yearIdx = years.value.findIndex(y => y === year);
const monthIdx = months.value.findIndex(m => m === month);
const dayIdx = days.value.findIndex(d => d === day);
if (yearIdx < 0 || monthIdx < 0 || dayIdx < 0) return null;
return [yearIdx, monthIdx, dayIdx];
}
const years = computed(() => {
// 工具函数:生成年份数组
function getYears() {
const arr = [];
const startYear = currentYear - 3;
const endYear = futureYear;
......@@ -137,62 +128,42 @@ const years = computed(() => {
arr.push(i);
}
return arr;
});
const months = computed(() => {
const [yearIdx] = pickerValue.value;
const selectedYear = years.value[yearIdx];
const arr = [];
}
// 工具函数:生成月份数组
function getMonths(selectedYear) {
let startMonth = 1;
let endMonth = 12;
if (selectedYear === currentYear - 3) {
startMonth = currentMonth;
}
if (selectedYear === futureYear) {
endMonth = futureMonth;
}
const arr = [];
for (let i = startMonth; i <= endMonth; i++) {
arr.push(i);
}
return arr;
});
const days = computed(() => {
const [yearIdx, monthIdx] = pickerValue.value;
const selectedYear = years.value[yearIdx];
const selectedMonth = months.value[monthIdx];
}
// 工具函数:生成天数数组(含"请选择")
function getDays(selectedYear, selectedMonth) {
const dayCount = new Date(selectedYear, selectedMonth, 0).getDate();
const arr = ["请选择"];
let startDay = 1;
let endDay = dayCount;
if (selectedYear === currentYear - 3 && selectedMonth === currentMonth) {
startDay = currentDay;
}
if (selectedYear === futureYear && selectedMonth === futureMonth) {
endDay = futureDay;
}
const arr = ["请选择"];
for (let i = startDay; i <= endDay; i++) {
arr.push(i);
}
return arr;
});
// custom模式相关
const columns = computed(() => {
if (Array.isArray(props.range[0])) {
return props.range;
} else {
return [props.range];
}
});
}
const years = computed(() => getYears());
const defaultValue = computed(() => {
if (props.mode === "date") {
// 1. value为索引数组
......@@ -200,31 +171,38 @@ const defaultValue = computed(() => {
return props.value;
}
// 2. value为日期字符串
if (typeof props.value === "string" && props.value.match(/^\d{4}-\d{2}-\d{2}$/)) {
if (
typeof props.value === "string" &&
props.value.match(/^\d{4}-\d{2}-\d{2}$/)
) {
const idxArr = getPickerIndexByDate(props.value);
if (idxArr) return idxArr;
}
// 3. 默认选中今天
const yearIdx = years.value.findIndex(y => y === currentYear);
const yearIdx = years.value.findIndex((y) => y === currentYear);
// 直接用当前年推算可用月份
let tempMonths = [];
let startMonth = 1, endMonth = 12;
let startMonth = 1,
endMonth = 12;
if (yearIdx === 0) startMonth = currentMonth;
if (yearIdx === years.value.length - 1) endMonth = futureMonth;
for (let i = startMonth; i <= endMonth; i++) tempMonths.push(i);
const monthIdx = tempMonths.findIndex(m => m === currentMonth);
const monthIdx = tempMonths.findIndex((m) => m === currentMonth);
// days
let tempDays = ["请选择"];
if (yearIdx >= 0 && monthIdx >= 0) {
const selectedYear = years.value[yearIdx];
const selectedMonth = tempMonths[monthIdx];
const dayCount = new Date(selectedYear, selectedMonth, 0).getDate();
let startDay = 1, endDay = dayCount;
if (yearIdx === 0 && selectedMonth === currentMonth) startDay = currentDay;
if (yearIdx === years.value.length - 1 && selectedMonth === futureMonth) endDay = futureDay;
let startDay = 1,
endDay = dayCount;
if (yearIdx === 0 && selectedMonth === currentMonth)
startDay = currentDay;
if (yearIdx === years.value.length - 1 && selectedMonth === futureMonth)
endDay = futureDay;
for (let i = startDay; i <= endDay; i++) tempDays.push(i);
}
const dayIdx = tempDays.findIndex(d => d === currentDay);
const dayIdx = tempDays.findIndex((d) => d === currentDay);
return [
yearIdx >= 0 ? yearIdx : 0,
monthIdx >= 0 ? monthIdx : 0,
......@@ -252,6 +230,45 @@ watch(
}
);
const months = computed(() => {
const [yearIdx] = pickerValue.value;
const selectedYear = years.value[yearIdx];
return getMonths(selectedYear);
});
const days = computed(() => {
const [yearIdx, monthIdx] = pickerValue.value;
const selectedYear = years.value[yearIdx];
const selectedMonth = months.value[monthIdx];
return getDays(selectedYear, selectedMonth);
});
// custom模式相关
const columns = computed(() => {
if (Array.isArray(props.range[0])) {
return props.range;
} else {
return [props.range];
}
});
// 工具函数:根据日期字符串获取索引
function getPickerIndexByDate(dateStr) {
if (!dateStr) return null;
const [year, month, day] = dateStr.split("-").map(Number);
const yearsArr = getYears();
const yearIdx = yearsArr.findIndex((y) => y === year);
if (yearIdx < 0) return null;
const selectedYear = yearsArr[yearIdx];
const monthsArr = getMonths(selectedYear);
const monthIdx = monthsArr.findIndex((m) => m === month);
if (monthIdx < 0) return null;
const daysArr = getDays(selectedYear, month);
const dayIdx = daysArr.findIndex((d) => d === day);
if (dayIdx < 0) return null;
return [yearIdx, monthIdx, dayIdx];
}
function open() {
if (props.disabled) return;
pickerValue.value = [...defaultValue.value];
......@@ -267,6 +284,7 @@ function confirm() {
if (props.mode === "date") {
const [yIdx, mIdx, dIdx] = pickerValue.value;
if (dIdx === 0) {
props.onPickerChange("");
return;
......@@ -278,7 +296,6 @@ function confirm() {
const dateStr = `${year}-${String(month).padStart(2, "0")}-${String(
day
).padStart(2, "0")}`;
props.onPickerChange(dateStr);
// 新增:判断状态并回调
const today = new Date();
......@@ -292,7 +309,12 @@ function confirm() {
} else {
status = 1;
}
props.onStatusChange(status);
console.log("status", status);
const changeRes = props.onStatusChange(status);
if (changeRes) {
props.onPickerChange(dateStr);
}
} else {
// 单列时只返回索引,否则返回数组
if (columns.value.length === 1) {
......@@ -304,6 +326,7 @@ function confirm() {
}
function onChange(e) {
let val = e.detail.value;
console.log('onChange', val);
if (props.mode === "date") {
// 如果天数溢出,自动修正到最大天数
const maxDay = days.value.length;
......
......@@ -240,6 +240,7 @@ function openAgreement(e) {
function onStatusChange(v) {
status.value = v;
return true;
}
function onLayerVisibleChange() {}
......@@ -262,6 +263,7 @@ const handleBabyInfoConfirm = throttleTap(async () => {
if (!isBtnActive.value) {
return;
}
console.log('handleBabyInfoConfirm');
showLoading();
......@@ -278,6 +280,8 @@ const handleBabyInfoConfirm = throttleTap(async () => {
hideLoading();
visible.value = false;
if (res.success) {
emit("confirm", {
date: date.value,
......
......@@ -95,6 +95,14 @@
formData[item.name] || item.placeholder
}}</view>
</view>
<view
v-else-if="item.type === 'display-obj'"
class="form-input-box"
>
<view class="form-input" style="color: #222">{{
getLabelByValue(item, formData[item.name])
}}</view>
</view>
<!-- 选择器类型 -->
<picker-custom
v-else-if="item.type === 'picker'"
......@@ -127,9 +135,12 @@
<view class="form-input-box">
<view class="form-input">
{{
(formData[item.name] &&
(formData[item.name] &&
(formData[item.name].split(",").join("、").length > 11
? formData[item.name].split(",").join("、").slice(0, 11) + "..."
? formData[item.name]
.split(",")
.join("、")
.slice(0, 11) + "..."
: formData[item.name].split(",").join("、"))) ||
item.placeholder
}}
......@@ -305,7 +316,7 @@ const specialAttentionOptions = ref([]);
const channelOptions = ref([]);
// 表单项配置
const formItems = [
const formItems = ref([
{
label: "当前状态",
name: "babyStage",
......@@ -411,7 +422,22 @@ const formItems = [
range: [],
mode: "custom",
},
];
]);
const clearFormFields = () => {
formData.value.babyBirthday = "";
formData.value.dueDate = "";
if (userStore.babyInfo.content?.babyType == "") {
formData.value.babyType = "";
}
formData.value.babyGender = "";
formData.value.feedingType = "";
formData.value.contentPreference = "";
formData.value.productPreference = "";
formData.value.followInfo = "";
formData.value.purchaseChannel = "";
formData.value.gestationalWeeks = "";
};
const getPickerIndex = (item) => {
const val = formData.value[item.name];
......@@ -448,11 +474,11 @@ const getPickerIndex = (item) => {
}
};
const onPickerChange = (e, name) => {
const item = formItems.find((i) => i.name === name);
const item = formItems.value.find((i) => i.name === name);
if (name === "babyStage") {
if (
pageType.value === "edit" &&
babyStageMap[e].value < formData.value[name]
babyStageMap[e].value < userStore.babyInfo.babyStage
) {
uni.showToast({
title: "不能选择更早的阶段",
......@@ -463,16 +489,7 @@ const onPickerChange = (e, name) => {
// 当阶段变化时清空相关表单项
if (formData.value[name] !== babyStageMap[e].value) {
formData.value.babyBirthday = "";
formData.value.dueDate = "";
formData.value.babyType = "";
formData.value.babyGender = "";
formData.value.feedingType = "";
formData.value.contentPreference = "";
formData.value.productPreference = "";
formData.value.followInfo = "";
formData.value.purchaseChannel = "";
formData.value.gestationalWeeks = "";
clearFormFields();
}
formData.value[name] = babyStageMap[e].value;
......@@ -494,6 +511,7 @@ const onPickerChange = (e, name) => {
formData.value[name] = item.range[e];
}
};
const onRadioChange = (e, name) => {
formData.value[name] = e.detail.value;
};
......@@ -506,7 +524,7 @@ const onSubmit = async (e) => {
console.log("fieldsToValidate", formData.value);
// 获取必填的表单项
const requiredFields = formItems
const requiredFields = formItems.value
.filter((item) => fieldsToValidate.includes(item.name) && item.required)
.map((item) => ({
name: item.name,
......@@ -626,7 +644,18 @@ const handleUploadBackground = async (e) => {
});
};
function onDateStatusChange(status) {
if (pageType.value === "edit" && status < userStore.babyInfo.babyStage) {
uni.showToast({
title: "不能选择更早的阶段",
icon: "none",
});
return false;
}
formData.value.babyStage = status;
if (status !== formData.value.babyStage) {
clearFormFields();
}
return true;
}
// getLabelByValue 支持所有映射字段
......@@ -677,7 +706,7 @@ const initData = () => {
channelOptions.value = contentCfg.channelOptions;
// 更新表单项的选项数据
formItems.forEach((item) => {
formItems.value.forEach((item) => {
if (item.name === "contentPreference") {
item.range = contentLikeOptions.value;
} else if (item.name === "productPreference") {
......@@ -686,6 +715,11 @@ const initData = () => {
item.range = specialAttentionOptions.value;
} else if (item.name === "purchaseChannel") {
item.range = channelOptions.value;
} else if (
item.name === "babyType" &&
userStore.babyInfo.content?.babyType != ""
) {
item.type = "display-obj";
}
});
};
......@@ -712,7 +746,6 @@ onLoad((options) => {
formData.value.purchaseChannel = baby.content?.purchaseChannel || "";
formData.value.babyAvatar = baby.content?.babyAvatar || "";
formData.value.backgroundImg = baby.content?.backgroundImg || "";
formData.value.gestationalWeeks = baby.content?.gestationalWeeks || "";
} else {
Object.assign(formData.value, {
......
......@@ -61,7 +61,6 @@ export function throttleTap(fn, delay = 1000) {
return function (...args) {
const now = Date.now();
if (now - lastTime < delay) {
// 小于间隔时间,阻止执行
console.log('防连点')
......@@ -71,8 +70,11 @@ export function throttleTap(fn, delay = 1000) {
lastTime = now;
clearTimeout(timer);
// 立即执行一次
fn.apply(this, args);
timer = setTimeout(() => {
fn.apply(this, args);
lastTime = 0; // 重置时间
}, delay);
}
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment