265 lines
7.0 KiB
TypeScript
265 lines
7.0 KiB
TypeScript
|
|
Page({
|
|||
|
|
data: {
|
|||
|
|
// 表单数据(与需求字段对应)
|
|||
|
|
form: {
|
|||
|
|
title: "", // 文章标题
|
|||
|
|
vote_type: "single", // 投票类型:single-单选,multiple-多选
|
|||
|
|
end_time: "", // 结束时间(ISO格式,如:2025-10-22T00:59:59+08:00)
|
|||
|
|
end_time_format: "", // 结束时间(展示用,如:2025-10-22 00:59)
|
|||
|
|
options: [
|
|||
|
|
{ content: "", sort_order: 1 }, // 默认1个选项,sort_order自动生成
|
|||
|
|
],
|
|||
|
|
},
|
|||
|
|
showTimePicker: false, // 时间选择器弹窗显隐
|
|||
|
|
currentTime: new Date().getTime(), // 当前选择的时间
|
|||
|
|
minDate: new Date().getTime(), // 最小可选时间(当前时间)
|
|||
|
|
isSubmitting: false, // 提交状态
|
|||
|
|
style: 'border: 2rpx solid var(--td-component-border);border-radius: 12rpx;',
|
|||
|
|
value: 0,
|
|||
|
|
value1: 0,
|
|||
|
|
|
|||
|
|
mode: '',
|
|||
|
|
datetimeVisible: false,
|
|||
|
|
datetime: new Date().getTime(),
|
|||
|
|
datetimeText: '',
|
|||
|
|
cityText: '',
|
|||
|
|
cityValue: [],
|
|||
|
|
citys: [
|
|||
|
|
{ label: '用户邀请码', value: '用户邀请码' },
|
|||
|
|
],
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 1. 输入框通用处理(标题)
|
|||
|
|
handleInput(e) {
|
|||
|
|
const { key } = e.currentTarget.dataset;
|
|||
|
|
this.setData({
|
|||
|
|
[`form.${key}`]: e.detail.value,
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 2. 投票类型切换(单选/多选)
|
|||
|
|
handleVoteTypeChange(e) {
|
|||
|
|
this.setData({
|
|||
|
|
"form.vote_type": e.detail,
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
showPicker(e) {
|
|||
|
|
console.log("截止")
|
|||
|
|
const { mode } = e?.currentTarget?.dataset;
|
|||
|
|
this.setData({
|
|||
|
|
mode,
|
|||
|
|
[`${mode}Visible`]: true,
|
|||
|
|
});
|
|||
|
|
console.log("截止2",mo)
|
|||
|
|
},
|
|||
|
|
hidePicker() {
|
|||
|
|
const { mode } = this.data;
|
|||
|
|
this.setData({
|
|||
|
|
[`${mode}Visible`]: false,
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
onConfirm(e) {
|
|||
|
|
const { value } = e?.detail;
|
|||
|
|
const { mode } = this.data;
|
|||
|
|
|
|||
|
|
console.log('confirm', value);
|
|||
|
|
|
|||
|
|
this.setData({
|
|||
|
|
[mode]: value,
|
|||
|
|
[`${mode}Text`]: value,
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
this.hidePicker();
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
onColumnChange(e) {
|
|||
|
|
console.log('pick', e?.detail?.value);
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
// 6. 投票选项输入
|
|||
|
|
handleOptionInput(e) {
|
|||
|
|
const { index, key } = e.currentTarget.dataset;
|
|||
|
|
this.setData({
|
|||
|
|
[`form.options[${index}].${key}`]: e.detail.value,
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
|
|||
|
|
// 8. 删除投票选项(至少保留1个)
|
|||
|
|
deleteOption(e) {
|
|||
|
|
const { index } = e.currentTarget.dataset;
|
|||
|
|
const { options } = this.data.form;
|
|||
|
|
if (options.length <= 1) return;
|
|||
|
|
|
|||
|
|
// 删除后重新排序sort_order
|
|||
|
|
const newOptions = options.filter((_, i) => i !== index);
|
|||
|
|
newOptions.forEach((item, i) => {
|
|||
|
|
item.sort_order = i + 1;
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
this.setData({
|
|||
|
|
"form.options": newOptions,
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 9. 表单校验
|
|||
|
|
validateForm() {
|
|||
|
|
const { title, end_time, options } = this.data.form;
|
|||
|
|
|
|||
|
|
// 校验标题
|
|||
|
|
if (!title.trim()) {
|
|||
|
|
wx.showToast({ title: "请输入文章标题", icon: "none" });
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 校验结束时间
|
|||
|
|
if (!end_time) {
|
|||
|
|
wx.showToast({ title: "请选择投票结束时间", icon: "none" });
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 校验选项(至少1个,且内容不为空)
|
|||
|
|
const hasEmptyOption = options.some(
|
|||
|
|
(item) => !item.content.trim()
|
|||
|
|
);
|
|||
|
|
if (hasEmptyOption) {
|
|||
|
|
wx.showToast({ title: "请完善所有选项内容", icon: "none" });
|
|||
|
|
return false;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
return true;
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 10. 提交发布
|
|||
|
|
handleSubmit() {
|
|||
|
|
// 1. 表单校验
|
|||
|
|
if (!this.validateForm()) return;
|
|||
|
|
|
|||
|
|
// 2. 整理提交数据(过滤空值,只保留需求字段)
|
|||
|
|
const { title, vote_type, end_time, options } = this.data.form;
|
|||
|
|
const submitData = {
|
|||
|
|
title: title.trim(),
|
|||
|
|
vote_type,
|
|||
|
|
end_time,
|
|||
|
|
options: options.map((item) => ({
|
|||
|
|
content: item.content.trim(),
|
|||
|
|
sort_order: item.sort_order,
|
|||
|
|
})),
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
// 3. 模拟提交(替换为实际接口请求)
|
|||
|
|
this.setData({ isSubmitting: true });
|
|||
|
|
console.log("发布投票文章数据:", submitData);
|
|||
|
|
|
|||
|
|
// 模拟接口请求(2秒后返回成功)
|
|||
|
|
setTimeout(() => {
|
|||
|
|
wx.showToast({ title: "发布成功" });
|
|||
|
|
this.setData({ isSubmitting: false });
|
|||
|
|
// 发布成功后返回上一页
|
|||
|
|
wx.navigateBack({ delta: 1 });
|
|||
|
|
}, 2000);
|
|||
|
|
},
|
|||
|
|
onChange(e) {
|
|||
|
|
this.setData({ value: e.detail.value });
|
|||
|
|
},
|
|||
|
|
onChange1(e) {
|
|||
|
|
this.setData({ value1: e.detail.value });
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
addOption1() {
|
|||
|
|
const { form } = this.data;
|
|||
|
|
// 最多3个选项
|
|||
|
|
if (form.options.length < 5) {
|
|||
|
|
// 创建新数组并添加新选项(保持原有选项数据)
|
|||
|
|
const newOptions = [...form.options];
|
|||
|
|
newOptions.push({
|
|||
|
|
content: "",
|
|||
|
|
sort_order: newOptions.length + 1
|
|||
|
|
});
|
|||
|
|
this.setData({
|
|||
|
|
'form.options': newOptions
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 删除选项
|
|||
|
|
removeOption(e) {
|
|||
|
|
const { index } = e.currentTarget.dataset;
|
|||
|
|
const { form } = this.data;
|
|||
|
|
|
|||
|
|
if (form.options.length > 1) {
|
|||
|
|
// 过滤掉要删除的选项,保留其他选项数据
|
|||
|
|
let newOptions = form.options.filter((_, i) => i !== index);
|
|||
|
|
|
|||
|
|
// 重新排序(不影响内容,只更新序号)
|
|||
|
|
newOptions = newOptions.map((item, i) => ({
|
|||
|
|
...item, // 保留原有内容
|
|||
|
|
sort_order: i + 1
|
|||
|
|
}));
|
|||
|
|
|
|||
|
|
this.setData({
|
|||
|
|
'form.options': newOptions
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 选项内容输入
|
|||
|
|
onOptionInput(e) {
|
|||
|
|
const { index } = e.currentTarget.dataset;
|
|||
|
|
const { form } = this.data;
|
|||
|
|
|
|||
|
|
|
|||
|
|
// 创建新数组避免直接修改原数据
|
|||
|
|
const newOptions = [...form.options];
|
|||
|
|
// 只更新当前输入的选项内容
|
|||
|
|
newOptions[index].content = e.detail.value;
|
|||
|
|
console.log("输入:",newOptions[index].content)
|
|||
|
|
this.setData({
|
|||
|
|
'form.options': newOptions
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
onColumnChange(e) {
|
|||
|
|
console.log('picker pick:', e);
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
onPickerChange(e) {
|
|||
|
|
const { key } = e.currentTarget.dataset;
|
|||
|
|
const { value } = e.detail;
|
|||
|
|
|
|||
|
|
console.log('picker change:', e.detail);
|
|||
|
|
this.setData({
|
|||
|
|
[`${key}Visible`]: false,
|
|||
|
|
[`${key}Value`]: value,
|
|||
|
|
[`${key}Text`]: value.join(' '),
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
onPickerCancel(e) {
|
|||
|
|
const { key } = e.currentTarget.dataset;
|
|||
|
|
console.log(e, '取消');
|
|||
|
|
console.log('picker1 cancel:');
|
|||
|
|
this.setData({
|
|||
|
|
[`${key}Visible`]: false,
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
onCityPicker() {
|
|||
|
|
this.setData({ cityVisible: true });
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
onSeasonPicker() {
|
|||
|
|
this.setData({ dateVisible: true });
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
});
|