更新SVG图标样式，优化灌溉计划和取水口页面逻辑，添加状态处理和信息提示功能；调整界面样式，提升用户体验。

zuoxiao

2025-04-09 50433e86b718fab0d94ea1410724b29b5f53fa0a

 pages/irrigationDetail/irrigationDetail.js

@@ -4,249 +4,144 @@
   */
  data: {
    planCode: '',
    projectName: '',
    startTime: '',
    projects: [],
    isRefreshing: false, // 下拉刷新状态
    planId: '' // 保存计划ID
    stopTime: '',
    isRefreshing: false,
    groupList: [],
    planId: '',
    planStatusText: '',
    planStatusClass: ''
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    if (options.id) {
    if (options.planId) {
      this.setData({
        planId: options.id
        planId: options.planId
      });
      // 从列表页面进入时，所有项目默认收起
      const fromListPage = options.fromList === 'true';
      this.loadIrrigationDetail(options.id, !fromListPage);
      this.fetchIrrigationData(options.planId);
    } else {
      wx.showToast({
        title: '缺少计划ID',
        icon: 'none'
      });
      setTimeout(() => {
        wx.navigateBack();
      }, 1500);
    }
  },

  /**
   * 加载灌溉计划详情
   * @param {string} id 灌溉计划ID
   * @param {boolean} isFirstLoad 是否首次加载
   * 获取灌溉计划数据
   */
  loadIrrigationDetail: function (id, isFirstLoad = false) {
    // 开始加载，设置刷新状态
    this.setData({
      isRefreshing: true
    });

    // 保存当前项目的展开状态
    const currentExpandStates = {};
    if (!isFirstLoad && this.data.projects.length > 0) {
      this.data.projects.forEach((project, index) => {
        currentExpandStates[project.id] = project.expanded;
  fetchIrrigationData: function(planId) {
    const { get } = require('../../api/request');
    
    const data = {
      planId: planId || this.data.planId,
    };
    
    get({
      url: 'wx/plan/getPublishResults',
      isShowLoding: true,
      useParams: true,
      data: data
    }).then(res => {
      if (res.success) {
        this.processIrrigationData(res.content);
      } else {
        wx.showToast({
          title: res.msg || '获取数据失败',
          icon: 'none'
        });
      }
    }).catch(err => {
      console.error('请求失败：', err);
      wx.showToast({
        title: '请求失败',
        icon: 'none'
      });
    }
    });
  },

    // 这里应该是从API获取数据
    // 以下是模拟数据
    const mockData = {
      planCode: 'IRG20240317001',
      startTime: '2024-03-17 08:00',
      projects: [
        {
          id: 1,
          name: '项目A',
          expanded: isFirstLoad ? true : false, // 仅在非列表页进入且首次加载时展开第一个项目
          groups: [
            {
              id: 1,
              name: '轮灌组A-1',
              status: 'irrigated', // 已灌溉
              statusText: '已灌溉',
              startTime: '2024-03-17 08:00',
              endTime: '2024-03-17 09:30',
              duration: 90
            },
            {
              id: 2,
              name: '轮灌组A-2',
              status: 'irrigating', // 正在灌溉
              statusText: '正在灌溉',
              startTime: '2024-03-17 09:30',
              endTime: '2024-03-17 11:00',
              duration: 90
            }
          ]
        },
        {
          id: 2,
          name: '项目B',
          expanded: false,
          groups: [
            {
              id: 3,
              name: '轮灌组B-1',
              status: 'waiting', // 未灌溉
              statusText: '未灌溉',
              startTime: '2024-03-17 11:00',
              endTime: '2024-03-17 12:30',
              duration: 90
            },
            {
              id: 4,
              name: '轮灌组B-2',
              status: 'waiting', // 未灌溉
              statusText: '未灌溉',
              startTime: '2024-03-17 12:30',
              endTime: '2024-03-17 14:00',
              duration: 90
            }
          ]
        },
        {
          id: 3,
          name: '项目C',
          expanded: false,
          groups: [
            {
              id: 5,
              name: '轮灌组C-1',
              status: 'waiting', // 未灌溉
              statusText: '未灌溉',
              startTime: '2024-03-17 14:00',
              endTime: '2024-03-17 15:30',
              duration: 90
            }
          ]
        }
      ]
  /**
   * 处理接口返回的数据
   */
  processIrrigationData: function(data) {
    console.log('灌溉计划详情数据：', data);
    
    // 处理轮灌组状态
    const statusMap = {
      2: {status: 'pending', statusText: '未开始'},
      3: {status: 'in_progress', statusText: '灌溉中'},
      4: {status: 'completed', statusText: '已结束'}
    };

    // 计算每个项目的总灌溉时长
    mockData.projects = this.calculateProjectTotalDuration(mockData.projects);

    // 如果不是首次加载，恢复项目的展开状态
    if (!isFirstLoad) {
      mockData.projects.forEach(project => {
        if (currentExpandStates[project.id] !== undefined) {
          project.expanded = currentExpandStates[project.id];
        }
      });
    // 处理计划状态
    let planStatusText = '';
    let planStatusClass = '';
    
    // 根据计划的状态设置不同的文本和样式
    // 注意：接口返回的是state而不是planState
    console.log('计划状态值：', data.state, '类型：', typeof data.state);
    
    // 确保state是数字类型
    const planState = parseInt(data.state);
    
    switch(planState) {
      case 1:
        planStatusText = '草稿';
        planStatusClass = 'draft';
        break;
      case 2:
        planStatusText = '未执行';
        planStatusClass = 'published';
        break;
      case 3:
        planStatusText = '执行中';
        planStatusClass = 'executing';
        break;
      case 4:
        planStatusText = '已完成';
        planStatusClass = 'completed';
        break;
      case 5:
        planStatusText = '已终止';
        planStatusClass = 'terminated';
        break;
      default:
        planStatusText = '未知状态';
        planStatusClass = 'draft';
        console.log('未识别的计划状态值：', planState);
    }

    // 模拟网络请求延迟
    setTimeout(() => {
      // 设置页面数据
      this.setData({
        planCode: mockData.planCode,
        startTime: mockData.startTime,
        projects: mockData.projects,
        isRefreshing: false // 结束刷新状态
      });
    }, 1000);

    // 实际项目中应该使用wx.request获取数据
    // wx.request({
    //   url: 'https://your-api-url/irrigation/' + id,
    //   method: 'GET',
    //   success: (res) => {
    //     if (res.data && res.data.code === 0) {
    //       // 获取新数据
    //       let projects = res.data.data.projects;
    //       
    //       // 如果是首次加载，设置默认展开状态
    //       if (isFirstLoad) {
    //         projects = projects.map((project, index) => {
    //           return {
    //             ...project,
    //             expanded: index === 0 // 默认只展开第一个项目
    //           };
    //         });
    //       } else {
    //         // 如果不是首次加载，恢复项目的展开状态
    //         projects = projects.map(project => {
    //           return {
    //             ...project,
    //             expanded: currentExpandStates[project.id] !== undefined 
    //               ? currentExpandStates[project.id] 
    //               : false
    //           };
    //         });
    //       }
    //       
    //       // 计算每个项目的总灌溉时长
    //       projects = this.calculateProjectTotalDuration(projects);
    //       
    //       this.setData({
    //         planCode: res.data.data.planCode,
    //         startTime: res.data.data.startTime,
    //         projects: projects,
    //         isRefreshing: false // 结束刷新状态
    //       });
    //     } else {
    //       wx.showToast({
    //         title: '获取数据失败',
    //         icon: 'none'
    //       });
    //       this.setData({
    //         isRefreshing: false // 结束刷新状态
    //       });
    //     }
    //   },
    //   fail: () => {
    //     wx.showToast({
    //       title: '网络错误',
    //       icon: 'none'
    //     });
    //     this.setData({
    //       isRefreshing: false // 结束刷新状态
    //     });
    //   }
    // });
  },

  /**
   * 计算每个项目的总灌溉时长
   */
  calculateProjectTotalDuration: function(projects) {
    return projects.map(project => {
      // 计算项目下所有轮灌组的总时长
      const totalDuration = project.groups.reduce((total, group) => {
        return total + (group.duration || 0);
      }, 0);
    // 转换数据格式
    const groupList = data.groups.map(group => {
      const statusInfo = statusMap[group.state] || {status: 'unknown', statusText: '未知状态'};
      
      return {
        ...project,
        totalDuration: totalDuration
        id: group.groupId,
        name: group.groupCode,
        status: statusInfo.status,
        statusText: statusInfo.statusText,
        startTime: group.startTime,
        endTime: group.stopTime,
        duration: group.duration,
        publishResult: group.publishResult || []
      };
    });
  },

  /**
   * 切换项目展开/收起状态
   */
  toggleProject: function (e) {
    const index = e.currentTarget.dataset.index;
    const expanded = this.data.projects[index].expanded;
    
    // 更新项目的展开状态
    const key = `projects[${index}].expanded`;
    this.setData({
      [key]: !expanded
    });
  },

  /**
   * 导航到轮灌组详情页面
   */
  navigateToGroupDetail: function (e) {
    const projectName = e.currentTarget.dataset.projectName;
    const groupName = e.currentTarget.dataset.groupName;
    const groupId = e.currentTarget.dataset.groupId;
    const status = e.currentTarget.dataset.status;
    
    console.log('跳转到组详情页面，原始状态:', status);
    
    // 导航到组详情页面，并传递参数
    // 注意：需要将status转换为isIrrigating参数，以便在组详情页面正确显示命令状态
    wx.navigateTo({
      url: `/pages/groupDetail/groupDetail?projectName=${projectName}&groupName=${groupName}&groupId=${groupId}&status=${status}&isIrrigating=${status === 'irrigating' ? 'true' : 'false'}`
      planCode: data.planName,
      projectName: data.projectName,
      startTime: data.planStartTime,
      stopTime: data.planStopTime,
      groupList: groupList,
      planStatusText: planStatusText,
      planStatusClass: planStatusClass
    });
  },

@@ -282,14 +177,18 @@
   * 下拉刷新处理函数
   */
  onPullDownRefresh: function () {
    // 重新加载数据，但保持展开状态
    if (this.data.planId) {
      this.loadIrrigationDetail(this.data.planId, false);
    } else {
    this.setData({
      isRefreshing: true
    });

    this.fetchIrrigationData(this.data.planId);
    
    // 完成刷新
    setTimeout(() => {
      this.setData({
        isRefreshing: false
      });
    }
    }, 1000);
  },

  /**
@@ -304,5 +203,15 @@
   */
  onShareAppMessage: function () {

  },

  /**
   * 导航到轮灌组详情页面
   */
  navigateToGroupDetail: function (e) {
    const { projectName, groupName, groupId, status } = e.currentTarget.dataset;
    wx.navigateTo({
      url: `/pages/groupDetail/groupDetail?projectName=${projectName}&groupName=${groupName}&groupId=${groupId}&status=${status}`
    });
  }
})