const app = getApp(); Page({ /** * 页面的初始数据 */ data: { // 表单数据 planCode: '', // 计划编号 startTime: '', // 灌溉开始时间 pickerValue: '', // 时间选择器的值 timePickerVisible: false, // 时间选择器是否可见 // 项目和轮灌组数据 projectList: [ { id: '1', name: '项目一', expanded: false, // 是否展开 totalDuration: 0, // 总时长 groups: [ { id: '1-1', name: '轮灌组1', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 } ] }, { id: '2', name: '项目二', expanded: false, totalDuration: 0, groups: [ { id: '2-1', name: '轮灌组A', selected: false, duration: 0 }, { id: '2-2', name: '轮灌组B', selected: false, duration: 0 } ] }, { id: '4', name: '项目一', expanded: false, // 是否展开 totalDuration: 0, // 总时长 groups: [ { id: '1-1', name: '轮灌组1', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 } ] }, { id: '5', name: '项目一', expanded: false, // 是否展开 totalDuration: 0, // 总时长 groups: [ { id: '1-1', name: '轮灌组1', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 } ] }, { id: '6', name: '项目一', expanded: false, // 是否展开 totalDuration: 0, // 总时长 groups: [ { id: '1-1', name: '轮灌组1', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 } ] }, { id: '7', name: '项目一', expanded: false, // 是否展开 totalDuration: 0, // 总时长 groups: [ { id: '1-1', name: '轮灌组1', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 } ] }, { id: '8', name: '项目8', expanded: false, // 是否展开 totalDuration: 0, // 总时长 groups: [ { id: '1-1', name: '轮灌组1', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 }, { id: '1-2', name: '轮灌组2', selected: false, duration: 0 }, { id: '1-3', name: '轮灌组3', selected: false, duration: 0 } ] }, { id: '3', name: '项目3', expanded: false, totalDuration: 0, groups: [ { id: '3-1', name: '轮灌组X', selected: false, duration: 0 }, { id: '3-2', name: '轮灌组Y', selected: false, duration: 0 }, { id: '3-3', name: '轮灌组Z', selected: false, duration: 0 } ] }, { id: '9', name: '项目9', expanded: false, totalDuration: 0, groups: [ { id: '3-1', name: '轮灌组X', selected: false, duration: 0 }, { id: '3-2', name: '轮灌组Y', selected: false, duration: 0 }, { id: '3-3', name: '轮灌组Z', selected: false, duration: 0 } ] } , { id: '10', name: '项目10', expanded: false, totalDuration: 0, groups: [ { id: '3-1', name: '轮灌组X', selected: false, duration: 0 }, { id: '3-2', name: '轮灌组Y', selected: false, duration: 0 }, { id: '3-3', name: '轮灌组Z', selected: false, duration: 0 } ] } , { id: '11', name: '项目11', expanded: false, totalDuration: 0, groups: [ { id: '3-1', name: '轮灌组X', selected: false, duration: 0 }, { id: '3-2', name: '轮灌组Y', selected: false, duration: 0 }, { id: '3-3', name: '轮灌组Z', selected: false, duration: 0 } ] } ] }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { // 页面加载时可以从API获取项目和轮灌组数据 // this.fetchProjectsAndGroups(); }, /** * 获取项目和轮灌组数据 */ fetchProjectsAndGroups: function () { // 这里可以添加API请求逻辑,获取真实数据 // wx.request({ // url: 'your-api-url', // success: (res) => { // this.setData({ // projectList: res.data // }); // } // }); }, /** * 处理计划编号输入 */ onPlanCodeInput: function (e) { this.setData({ planCode: e.detail.value }); }, /** * 显示时间选择器 */ showTimePicker: function () { this.setData({ timePickerVisible: true }); }, /** * 时间选择器确认回调 */ onTimePickerConfirm: function (e) { this.setData({ startTime: e.detail.formatValue, pickerValue: e.detail.value, timePickerVisible: false }); }, /** * 时间选择器取消回调 */ onTimePickerCancel: function () { this.setData({ timePickerVisible: false }); }, /** * 切换项目展开/折叠状态 */ toggleProject: function (e) { const index = e.currentTarget.dataset.index; const currentValue = this.data.projectList[index].expanded; // 创建新的项目列表,先将所有项目设为折叠状态 const newProjectList = this.data.projectList.map((item, idx) => { return { ...item, expanded: false }; }); // 如果当前点击的项目已经是展开状态,则保持所有项目折叠 // 否则,将当前点击的项目设为展开状态 if (!currentValue) { newProjectList[index].expanded = true; } this.setData({ projectList: newProjectList }); }, /** * 切换轮灌组选中状态 */ toggleGroupSelection: function (e) { const projectIndex = e.currentTarget.dataset.projectIndex; const groupIndex = e.currentTarget.dataset.groupIndex; const key = `projectList[${projectIndex}].groups[${groupIndex}].selected`; const currentValue = this.data.projectList[projectIndex].groups[groupIndex].selected; this.setData({ [key]: !currentValue }); // 更新项目总时长 this.updateProjectTotalDuration(projectIndex); }, /** * 处理时长输入 */ onDurationInput: function (e) { const projectIndex = e.currentTarget.dataset.projectIndex; const groupIndex = e.currentTarget.dataset.groupIndex; const value = parseInt(e.detail.value) || 0; // 更新轮灌组时长 const durationKey = `projectList[${projectIndex}].groups[${groupIndex}].duration`; this.setData({ [durationKey]: value }); // 自动选中该轮灌组 const selectedKey = `projectList[${projectIndex}].groups[${groupIndex}].selected`; if (value > 0 && !this.data.projectList[projectIndex].groups[groupIndex].selected) { this.setData({ [selectedKey]: true }); } // 计算并更新项目总时长 this.updateProjectTotalDuration(projectIndex); }, /** * 计算并更新项目总时长 */ updateProjectTotalDuration: function (projectIndex) { const project = this.data.projectList[projectIndex]; let totalDuration = 0; // 计算所有选中的轮灌组的时长总和 project.groups.forEach(group => { if (group.selected) { totalDuration += parseInt(group.duration) || 0; } }); // 更新项目总时长 const totalDurationKey = `projectList[${projectIndex}].totalDuration`; this.setData({ [totalDurationKey]: totalDuration }); }, /** * 阻止事件冒泡 */ stopPropagation: function (e) { // 阻止事件冒泡,防止点击输入框时触发父元素的点击事件 }, /** * 跳转到轮灌组详情页 */ navigateToGroupDetail: function (e) { const projectIndex = e.currentTarget.dataset.projectIndex; const groupIndex = e.currentTarget.dataset.groupIndex; const project = this.data.projectList[projectIndex]; const group = project.groups[groupIndex]; wx.navigateTo({ url: `/pages/groupDetail/groupDetail?projectId=${project.id}&projectName=${project.name}&groupId=${group.id}&groupName=${group.name}` }); }, /** * 确认按钮点击事件 */ onConfirm: function () { // 验证表单 if (!this.validateForm()) { return; } // 收集选中的轮灌组 const selectedGroups = this.getSelectedGroups(); // 构建提交数据 const formData = { planCode: this.data.planCode, startTime: this.data.startTime, groups: selectedGroups }; // 提交数据 this.submitForm(formData); }, /** * 验证表单 */ validateForm: function () { if (!this.data.planCode) { wx.showToast({ title: '请输入计划编号', icon: 'none' }); return false; } if (!this.data.startTime) { wx.showToast({ title: '请选择灌溉开始时间', icon: 'none' }); return false; } const selectedGroups = this.getSelectedGroups(); if (selectedGroups.length === 0) { wx.showToast({ title: '请至少选择一个轮灌组', icon: 'none' }); return false; } // 检查选中的轮灌组是否都设置了时长 const invalidGroups = selectedGroups.filter(group => !group.duration); if (invalidGroups.length > 0) { wx.showToast({ title: '请为所有选中的轮灌组设置时长', icon: 'none' }); return false; } return true; }, /** * 获取选中的轮灌组 */ getSelectedGroups: function () { const selectedGroups = []; this.data.projectList.forEach(project => { project.groups.forEach(group => { if (group.selected) { selectedGroups.push({ projectId: project.id, projectName: project.name, groupId: group.id, groupName: group.name, duration: group.duration }); } }); }); return selectedGroups; }, /** * 提交表单数据 */ submitForm: function (formData) { // 这里可以添加API请求逻辑,提交表单数据 console.log('提交的表单数据:', formData); // 模拟API请求 wx.showLoading({ title: '提交中...', }); setTimeout(() => { wx.hideLoading(); wx.showToast({ title: '创建成功', icon: 'success', duration: 2000, success: () => { // 延迟返回上一页 setTimeout(() => { wx.navigateBack(); }, 2000); } }); }, 1500); // 实际API请求示例 // wx.request({ // url: 'your-api-url', // method: 'POST', // data: formData, // success: (res) => { // wx.showToast({ // title: '创建成功', // icon: 'success', // duration: 2000, // success: () => { // setTimeout(() => { // wx.navigateBack(); // }, 2000); // } // }); // }, // fail: (err) => { // wx.showToast({ // title: '创建失败,请重试', // icon: 'none' // }); // } // }); } });