|  |  | 
 |  |  |   <view class="page-header"> | 
 |  |  |     <view class="header-content"> | 
 |  |  |       <view class="project-info"> | 
 |  |  |         <view class="project-name">{{projectName}}</view> | 
 |  |  |         <view class="group-name">{{groupName}}</view> | 
 |  |  |         <view class="project-name"> | 
 |  |  |           <text class="project-label">所属项目:</text> | 
 |  |  |           <text>{{projectName}}</text> | 
 |  |  |         </view> | 
 |  |  |  | 
 |  |  |       </view> | 
 |  |  |     </view> | 
 |  |  |   </view> | 
 |  |  |  | 
 |  |  |   <!-- 阀控器列表 --> | 
 |  |  |   <!-- 取水口列表 --> | 
 |  |  |   <view class="valve-list-container"> | 
 |  |  |     <view class="section-title">取水口阀控器列表</view> | 
 |  |  |      | 
 |  |  |     <!-- 加载中 --> | 
 |  |  |   | 
 |  |  |     <!-- 加载中 | 
 |  |  |     <view class="loading-container" wx:if="{{loading}}"> | 
 |  |  |       <view class="loading-icon"></view> | 
 |  |  |       <view class="loading-text">加载中...</view> | 
 |  |  |     </view> | 
 |  |  |     </view> --> | 
 |  |  |      | 
 |  |  |     <!-- 阀控器列表 --> | 
 |  |  |     <view class="valve-list" wx:else> | 
 |  |  |       <block wx:for="{{valveList}}" wx:key="id"> | 
 |  |  |     <!-- 取水口列表 - 可下拉刷新的scroll-view --> | 
 |  |  |     <scroll-view  | 
 |  |  |       class="valve-list"  | 
 |  |  |       scroll-y="true" | 
 |  |  |       refresher-enabled="{{true}}" | 
 |  |  |       refresher-threshold="50" | 
 |  |  |       refresher-default-style="black" | 
 |  |  |       refresher-background="#f2f2f2" | 
 |  |  |       refresher-triggered="{{refreshing}}" | 
 |  |  |       bindrefresherrefresh="onRefresh" | 
 |  |  |      > | 
 |  |  |       <block wx:for="{{waterOutletList}}" wx:key="id"> | 
 |  |  |         <view class="valve-item"> | 
 |  |  |           <view class="valve-info"> | 
 |  |  |             <view class="valve-name">{{item.name}}</view> | 
 |  |  |             <view class="valve-location">{{item.location}}</view> | 
 |  |  |             <view class="valve-name-container"> | 
 |  |  |               <text class="name-text">{{item.name}}</text> | 
 |  |  |             </view> | 
 |  |  |             <view class="valve-rtu-addr"> | 
 |  |  |               <text class="rtu-label">设备地址: </text> | 
 |  |  |               <text class="rtu-value">{{item.rtuAddr}}</text> | 
 |  |  |             </view> | 
 |  |  |           </view> | 
 |  |  |           <view class="valve-status {{item.status === 'online' ? 'online' : 'offline'}}"> | 
 |  |  |             {{item.status === 'online' ? '在线' : '离线'}} | 
 |  |  |           <view class="valve-status-container"> | 
 |  |  |             <view class="valve-status-inline {{item.status === 'online' ? 'online' : 'offline'}}"> | 
 |  |  |               {{item.status === 'online' ? '在线' : '离线'}} | 
 |  |  |             </view> | 
 |  |  |           </view> | 
 |  |  |         </view> | 
 |  |  |       </block> | 
 |  |  |     </view> | 
 |  |  |      | 
 |  |  |     <!-- 空状态 --> | 
 |  |  |     <view class="empty-state" wx:if="{{!loading && valveList.length === 0}}"> | 
 |  |  |       <image class="empty-icon" src="/images/empty.svg" mode="aspectFit"></image> | 
 |  |  |       <view class="empty-text">暂无阀控器数据</view> | 
 |  |  |     </view> | 
 |  |  |        | 
 |  |  |       <!-- 空状态 --> | 
 |  |  |       <view class="empty-state" wx:if="{{waterOutletList.length === 0}}"> | 
 |  |  |         <image class="empty-icon" src="/images/empty.svg" mode="aspectFit"></image> | 
 |  |  |         <view class="empty-text">暂无取水口数据</view> | 
 |  |  |       </view> | 
 |  |  |     </scroll-view> | 
 |  |  |   </view> | 
 |  |  |  | 
 |  |  |   <!-- 底部按钮 --> | 
 |  |  |   <view class="bottom-button"> | 
 |  |  |     <button class="back-button" hover-class="back-button-hover" bindtap="goBack">返回</button> | 
 |  |  |   </view> | 
 |  |  |  | 
 |  |  | </view>  |