管灌系统农户端微信小程序(嘉峪关应用)
重构灌溉组详情页面的请求逻辑,改用请求库简化API调用;更新WXML以优化组名展示样式,提升用户体验。
3个文件已修改
119 ■■■■ 已修改文件
pages/groupDetail/groupDetail.js 114 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
pages/groupDetail/groupDetail.wxml 3 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
pages/groupDetail/groupDetail.wxss 2 ●●● 补丁 | 查看 | 原始文档 | blame | 历史
pages/groupDetail/groupDetail.js
@@ -1,4 +1,5 @@
const app = getApp();
const { get } = require('../../api/request');
Page({
  /**
@@ -46,112 +47,15 @@
      refreshing: true
    });
    
    console.log('开始加载轮灌组详情,groupId:', this.data.groupId);
    // 检查apiBaseUrl是否存在
    if (!app.globalData.apiBaseUrl) {
      try {
        // 从config模块获取基础URL
        const config = require('../../api/config');
        const { PROJECT_CONFIG } = require('../../utils/projectConfig');
        // 获取当前选中的项目标识
        const tag = wx.getStorageSync('projectTag') || app.globalData.tag || 'mq';
        // 根据tag找到对应项目配置
        let selectedProject = 'MQ'; // 默认为民勤项目
        for (const key in PROJECT_CONFIG) {
          if (PROJECT_CONFIG[key].tag === tag) {
            selectedProject = key;
            break;
          }
        }
        // 设置apiBaseUrl
        app.globalData.apiBaseUrl = PROJECT_CONFIG[selectedProject].serverUrl;
        console.log('从配置中获取apiBaseUrl:', app.globalData.apiBaseUrl);
      } catch (error) {
        console.error('获取apiBaseUrl失败:', error);
        // 使用请求库中的方法
        const { get } = require('../../api/request');
        get({
          url: '/wx/irrigation/getGroupDetails',
          data: { groupId: this.data.groupId },
          isShowLoding: true
        }).then(res => {
          if (res.success) {
            this.handleGroupDetailsResponse(res);
          } else {
            wx.showToast({
              title: res.msg || '获取数据失败',
              icon: 'none'
            });
          }
        }).catch(err => {
          console.error('请求失败:', err);
          wx.showToast({
            title: '网络错误',
            icon: 'none'
          });
        }).finally(() => {
          this.setData({
            refreshing: false
          });
        });
        return; // 已经使用请求库处理,直接返回
      }
    }
    // 使用wx.request发送请求
    wx.request({
      url: `${app.globalData.apiBaseUrl}/wx/irrigation/getGroupDetails`,
      method: 'GET',
    get({
      url: '/wx/irrigation/getGroupDetails',
      data: {
        groupId: this.data.groupId
      },
      header: {
        'content-type': 'application/json',
        'Authorization': wx.getStorageSync('token') || '',
        'tag': wx.getStorageSync('projectTag') || app.globalData.tag || '',
        'appId': app.globalData.AppID || ''
      },
      success: (res) => {
        console.log('轮灌组详情接口返回:', res.data);
        if (res.data && res.data.success) {
          this.handleGroupDetailsResponse(res.data);
        } else {
          wx.showToast({
            title: res.data.msg || '获取数据失败',
            icon: 'none'
          });
          this.setData({
            refreshing: false
          });
        }
      },
      fail: (err) => {
        console.error('请求失败:', err);
        // 尝试使用请求库重试
        this.retryUsingRequestLib();
      }
    });
  },
  /**
   * 使用请求库重试获取数据
   */
  retryUsingRequestLib: function() {
    console.log('使用请求库重试获取数据');
    const { get } = require('../../api/request');
    get({
      url: '/wx/irrigation/getGroupDetails',
      data: { groupId: this.data.groupId },
      isShowLoding: true
    }).then(res => {
      console.log('轮灌组详情接口返回:', res);
      if (res.success) {
        this.handleGroupDetailsResponse(res);
      } else {
@@ -159,20 +63,22 @@
          title: res.msg || '获取数据失败',
          icon: 'none'
        });
        this.setData({
          refreshing: false
        });
      }
    }).catch(err => {
      console.error('请求库重试失败:', err);
      console.error('请求失败:', err);
      wx.showToast({
        title: '网络错误',
        icon: 'none'
      });
    }).finally(() => {
      this.setData({
        refreshing: false
      });
    });
  },
  /**
   * 处理轮灌组详情响应数据
   */
pages/groupDetail/groupDetail.wxml
@@ -3,11 +3,12 @@
  <view class="page-header">
    <view class="header-content">
      <view class="project-info">
        <view class="group-name">{{groupName}}</view>
        <view class="project-name">
          <text class="project-label">所属项目:</text>
          <text>{{projectName}}</text>
        </view>
        <view class="group-name">{{groupName}}</view>
      </view>
    </view>
  </view>
pages/groupDetail/groupDetail.wxss
@@ -26,7 +26,6 @@
.project-name {
  font-size: 28rpx;
  color: #666666;
  margin-bottom: 10rpx;
  display: flex;
  align-items: center;
}
@@ -40,6 +39,7 @@
  font-size: 36rpx;
  font-weight: bold;
  color: #333333;
  margin-bottom: 10rpx;
}
/* 取水口列表容器 */