const app = getApp(); Page({ /** * 页面的初始数据 */ data: { // 表单数据 planCode: '', // 计划编号 startTime: '', // 灌溉开始时间 pickerValue: '', // 时间选择器的值 timePickerVisible: false, // 时间选择器是否可见 // 项目选择器相关 projectPickerVisible: false, projectPickerValue: [], selectedProject: null, projectOptions: [], totalDuration: 0, // 添加总灌溉时间 // 测试数据 projectList: [ { id: 1, name: '测试项目一', groups: [ { id: 101, name: '轮灌组A', duration: 30, selected: false }, { id: 102, name: '轮灌组B', duration: 45, selected: false }, { id: 103, name: '轮灌组C', duration: 60, selected: false } ] }, { id: 2, name: '测试项目二', groups: [ { id: 201, name: '轮灌组1', duration: 40, selected: false }, { id: 202, name: '轮灌组2', duration: 50, selected: false } ] }, { id: 3, name: '测试项目三', groups: [ { id: 301, name: '东区轮灌组', duration: 35, selected: false }, { id: 302, name: '西区轮灌组', duration: 55, selected: false }, { id: 303, name: '南区轮灌组', duration: 25, selected: false } ] } ] }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { // 初始化项目选择器选项 const projectOptions = this.data.projectList.map(project => ({ label: project.name, value: project.id })); this.setData({ projectOptions: projectOptions // 直接使用一维数组,不需要包装成二维数组 }); }, /** * 获取项目和轮灌组数据 */ 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) { const { value } = e.detail; this.setData({ timePickerVisible: false, startTime: value }); }, /** * 时间选择器取消回调 */ 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 { groupIndex } = e.currentTarget.dataset; const duration = parseInt(e.detail.value) || 0; const selectedProject = { ...this.data.selectedProject }; selectedProject.groups[groupIndex].duration = duration; this.setData({ selectedProject }, () => { // 输入时长后重新计算总时间 this.calculateTotalDuration(); }); }, /** * 计算并更新项目总时长 */ 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 () { // 阻止事件冒泡,防止点击输入框时触发父元素的点击事件 }, /** * 跳转到轮灌组详情页 */ navigateToGroupDetail: function (e) { const { groupIndex } = e.currentTarget.dataset; // TODO: 实现跳转逻辑 }, /** * 确认按钮点击事件 */ onConfirm: function () { const { planCode, startTime, selectedProject } = this.data; if (!planCode) { wx.showToast({ title: '请输入计划编号', icon: 'none' }); return; } if (!startTime) { wx.showToast({ title: '请选择灌溉开始时间', icon: 'none' }); return; } if (!selectedProject) { wx.showToast({ title: '请选择项目', icon: 'none' }); return; } // TODO: 实现确认逻辑 console.log('提交数据:', { planCode, startTime, project: selectedProject }); }, // 显示项目选择器 showProjectPicker() { this.setData({ projectPickerVisible: true }); }, // 项目选择器确认 onProjectPickerConfirm(e) { const { value } = e.detail; const selectedProject = this.data.projectList.find(project => project.id === value[0]); this.setData({ projectPickerVisible: false, selectedProject: selectedProject, projectPickerValue: value }, () => { // 选择项目后计算总时间 this.calculateTotalDuration(); }); }, // 项目选择器取消 onProjectPickerCancel() { this.setData({ projectPickerVisible: false }); }, // 计算总灌溉时间 calculateTotalDuration() { if (!this.data.selectedProject) return; const totalDuration = this.data.selectedProject.groups.reduce((sum, group) => { return sum + (parseInt(group.duration) || 0); }, 0); this.setData({ totalDuration }); }, });