<view class="irrigation-container">
|
<!-- 顶部两个标签页 -->
|
<view class="tabs">
|
<view class="tab {{currentTab === 0 ? 'active' : ''}}" hover-class="tab-hover" bindtap="switchTab" data-index="0">
|
<text>当前灌溉计划</text>
|
</view>
|
<view class="tab {{currentTab === 1 ? 'active' : ''}}" hover-class="tab-hover" bindtap="switchTab" data-index="1">
|
<text>历史计划</text>
|
</view>
|
</view>
|
|
<!-- 中间列表 - 使用scroll-view实现下拉刷新 -->
|
<scroll-view class="scroll-view" scroll-x="false" scroll-y="true" refresher-enabled="{{isRefreshing==false?true:false}}" refresher-threshold="50" bindrefresherrefresh="onPullDownRefresh" refresher-triggered="{{isWXRefreshing}}">
|
<view wx:if="{{isRefreshing}}" class="refresh-view">
|
<view class="dot"></view>
|
<view class="dot"></view>
|
<view class="dot"></view>
|
</view>
|
<view class="scroll-bg">
|
<block wx:if="{{currentList.length > 0}}">
|
<view class="list-item" wx:for="{{currentList}}" wx:key="id" bindtap="onItemTap" data-id="{{item.id}}" data-status="{{item.status}}">
|
<!-- 状态标签 -->
|
<view class="status-tag {{item.status === '1' ? 'draft' : item.status === '2' ? 'published' : item.status === '3' ? 'executing' : item.status === '5' ? 'terminated' : 'completed'}}">
|
{{item.status === '1' ? '草稿' : item.status === '2' ? '未执行' : item.status === '3' ? '执行中' : item.status === '5' ? '已终止' : '已完成'}}
|
</view>
|
|
<!-- 主要内容区 -->
|
<view class="item-content">
|
<!-- 标题区域 -->
|
<view class="item-header">
|
<view class="title-section">
|
<view class="plan-title">{{item.title}}</view>
|
<view class="project-name">{{item.projectName}}</view>
|
</view>
|
</view>
|
|
<!-- 信息区域 -->
|
<view class="info-section">
|
<!-- 草稿状态(1)时横向排列，其他状态纵向排列 -->
|
<view class="info-grid {{item.status === '1' ? '' : 'vertical-layout'}} {{currentTab === 1 ? 'history-grid' : ''}}">
|
<view class="info-item">
|
<view class="info-icon">
|
<image src="/images/time-icon.svg" mode="aspectFit"></image>
|
</view>
|
<view class="info-content">
|
<view class="info-label">灌溉时间</view>
|
<view class="info-value">{{(item.planStartTime ? item.planStartTime : '手动发布') + (item.planStopTime ? ' - ' + item.planStopTime : '')}}</view>
|
</view>
|
</view>
|
<view class="info-item">
|
<view class="info-icon duration-icon">
|
<image src="/images/hourglass.svg" mode="aspectFit"></image>
|
</view>
|
<view class="info-content">
|
<view class="info-label">灌溉时长</view>
|
<view class="info-value">{{item.duration}}分钟</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
|
<!-- 操作按钮区域 -->
|
<view class="action-section" catchtap="stopPropagation" wx:if="{{item.status !== '4'}}">
|
<block wx:if="{{item.status === '1'}}">
|
<view class="action-buttons">
|
<button class="action-button delete-button" hover-class="delete-button-hover" bindtap="onDelete" data-id="{{item.id}}">
|
<image src="/images/delete_bt.svg" mode="aspectFit"></image>
|
<text>删除</text>
|
</button>
|
<button class="action-button publish-button" hover-class="publish-button-hover" bindtap="onPublish" data-id="{{item.id}}">
|
<image src="/images/publish-icon.svg" mode="aspectFit"></image>
|
<text>发布</text>
|
</button>
|
</view>
|
</block>
|
<block wx:if="{{item.status === '2'}}">
|
<view class="action-buttons">
|
<button class="action-button stop-button" hover-class="stop-button-hover" bindtap="onStop" data-id="{{item.id}}">
|
<image src="/images/stop-icon.svg" mode="aspectFit"></image>
|
<text>终止</text>
|
</button>
|
</view>
|
</block>
|
<block wx:if="{{item.status === '3'}}">
|
<view class="action-buttons">
|
<button class="action-button stop-button" hover-class="stop-button-hover" bindtap="onStop" data-id="{{item.id}}">
|
<image src="/images/stop-icon.svg" mode="aspectFit"></image>
|
<text>终止</text>
|
</button>
|
</view>
|
</block>
|
</view>
|
</view>
|
</view>
|
</block>
|
|
<block wx:else>
|
<view class="empty-list">
|
<image class="empty-icon" src="/images/no_more.svg" mode="aspectFit"></image>
|
<view class="empty-text">暂无轮灌记录</view>
|
</view>
|
</block>
|
</view>
|
</scroll-view>
|
|
<!-- 底部新建按钮 -->
|
<view class="bottom-button">
|
<button class="add-button" hover-class="add-button-hover" bindtap="onAddIrrigation">
|
<image src="/images/add-icon.svg" mode="aspectFit"></image>
|
<text>创建灌溉计划</text>
|
</button>
|
</view>
|
</view>
|
