292 lines
8.6 KiB
Vue
292 lines
8.6 KiB
Vue
<template>
|
||
<!-- 顶部导航栏 -->
|
||
<custom-nav-bar :left="false" leftText="" @leftClick="" title="轮灌">
|
||
<template v-slot:right>
|
||
<view class="fixed">
|
||
<view align="right" class="iconfont icon-jia1 icon" @click="add"></view>
|
||
</view>
|
||
</template>
|
||
</custom-nav-bar>
|
||
<!-- 选项卡 -->
|
||
<uni-segmented-control :current="tab.current" :values="tab.items" @clickItem="onClickItem" styleType="text"
|
||
activeColor="#39ac4f"></uni-segmented-control>
|
||
|
||
<view class="content">
|
||
<view v-show="tab.current === 0">
|
||
<z-paging ref="pagingTask" @query="queryTask" v-model="task" :auto-show-system-loading="true"
|
||
:default-page-size="pageSize" empty-view-text="抱歉，暂时还没有相关数据！" class="custom-z-paging">
|
||
<view class="card">
|
||
<uni-collapse>
|
||
<uni-collapse-item title-border="none" :border="false" :show-arrow="false" :open="true">
|
||
<template v-slot:title>
|
||
<view class="cards-title">
|
||
<view>
|
||
<view class="text">任务名称：006</view>
|
||
</view>
|
||
<view class="title-r">
|
||
<uni-tag class="bg-green" :circle="true" text="轮灌中" />
|
||
</view>
|
||
</view>
|
||
</template>
|
||
<view class="content">
|
||
<view class="cards-content">
|
||
<view class="txt-list" @click="taskdetails">
|
||
<view class="list1">
|
||
<view><text>轮灌方案：</text>全设备</view>
|
||
<view><text>起始值：</text>外部程曦</view>
|
||
<view><text>开始时间：</text>2025-01-05 10:11</view>
|
||
<view><text>结束时间：</text>2025-01-05 10:11</view>
|
||
<view><text>是否调压：</text>是</view>
|
||
</view>
|
||
<view class="right">
|
||
<view class="iconfont icon-you">
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</uni-collapse-item>
|
||
</uni-collapse>
|
||
</view>
|
||
<view class="card">
|
||
<uni-collapse>
|
||
<uni-collapse-item title-border="none" :border="false" :show-arrow="false">
|
||
<template v-slot:title>
|
||
<view class="cards-title">
|
||
<view>
|
||
<view class="text">任务名称：006</view>
|
||
</view>
|
||
<view class="title-r">
|
||
<uni-tag class="bg-orange" :circle="true" text="暂停" />
|
||
</view>
|
||
</view>
|
||
</template>
|
||
<view class="content">
|
||
<view class="cards-content">
|
||
<view class="txt-list">
|
||
<view class="list1">
|
||
<view><text>轮灌方案：</text>全设备</view>
|
||
<view><text>起始值：</text>外部程曦</view>
|
||
<view><text>开始时间：</text>2025-01-05 10:11</view>
|
||
<view><text>结束时间：</text>2025-01-05 10:11</view>
|
||
<view><text>是否调压：</text>是</view>
|
||
</view>
|
||
<view class="right">
|
||
<view class="iconfont icon-you">
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</uni-collapse-item>
|
||
</uni-collapse>
|
||
</view>
|
||
<view class="card">
|
||
<uni-collapse>
|
||
<uni-collapse-item title-border="none" :border="false" :show-arrow="false">
|
||
<template v-slot:title>
|
||
<view class="cards-title">
|
||
<view>
|
||
<view class="text">任务名称：006</view>
|
||
</view>
|
||
<view class="title-r">
|
||
<uni-tag class="bg-red" :circle="true" text="终止" />
|
||
</view>
|
||
</view>
|
||
</template>
|
||
<view class="content">
|
||
<view class="cards-content">
|
||
<view class="txt-list">
|
||
<view class="list1">
|
||
<view><text>轮灌方案：</text>全设备</view>
|
||
<view><text>起始组：</text>外部程曦</view>
|
||
<view><text>开始时间：</text>2025-01-05 10:11</view>
|
||
<view><text>结束时间：</text>2025-01-05 10:11</view>
|
||
<view><text>是否调压：</text>是</view>
|
||
</view>
|
||
<view class="right">
|
||
<view class="iconfont icon-you">
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</uni-collapse-item>
|
||
</uni-collapse>
|
||
</view>
|
||
</z-paging>
|
||
</view>
|
||
<view v-show="tab.current === 1">
|
||
<z-paging ref="pagingScenario" @query="queryScenario" v-model="scenario" :auto-show-system-loading="true"
|
||
:default-page-size="pageSize" empty-view-text="抱歉，暂时还没有相关数据！" class="custom-z-paging">
|
||
<view class="card">
|
||
<uni-collapse>
|
||
<uni-collapse-item title-border="none" :border="false" :show-arrow="false" :open="true"
|
||
v-for="item in scenario">
|
||
<template v-slot:title>
|
||
<view class="cards-title">
|
||
<view>
|
||
<view class="text">方案名称：{{item.scenarioName}}</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
<view class="content">
|
||
<view class="cards-content">
|
||
<view class="txt-list" @click="irrigationgroup(item)">
|
||
<view class="list2">
|
||
<view><text>轮灌组数量：</text>{{item.groupNum}}</view>
|
||
<view><text>压力：</text>{{item.pressureMin}}-{{item.pressureMax}}</view>
|
||
<view><text>总时长：</text>{{item.irrigateTotalDuration}}</view>
|
||
</view>
|
||
<view class="right">
|
||
<view class="iconfont icon-you">
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="card-font">
|
||
<u-button type="success" size="mini" text="编辑" @click="editScenario(item)" />
|
||
<u-button type="success" size="mini" text="启用" />
|
||
<u-button type="success" size="mini" text="禁用" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</uni-collapse-item>
|
||
</uni-collapse>
|
||
</view>
|
||
<!-- <view class="card">
|
||
<uni-collapse>
|
||
<uni-collapse-item title-border="none" :border="false" :show-arrow="false">
|
||
<template v-slot:title>
|
||
<view class="cards-title">
|
||
<view>
|
||
<view class="text">方案名称：006</view>
|
||
</view>
|
||
|
||
</view>
|
||
</template>
|
||
<view class="content">
|
||
<view class="cards-content">
|
||
<view class="txt-list">
|
||
<view class="list2">
|
||
<view><text>轮灌组数量：</text>5</view>
|
||
<view><text>压力：</text>0.2</view>
|
||
<view><text>总时长：</text>10</view>
|
||
</view>
|
||
<view class="right">
|
||
<view class="iconfont icon-you">
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="card-font">
|
||
<u-button class="bg-red" type="success" size="mini" text="禁用" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</uni-collapse-item>
|
||
</uni-collapse>
|
||
</view> -->
|
||
</z-paging>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import * as isApi from '@/api/irrigate/irrigateScenario.js'
|
||
|
||
export default {
|
||
data() {
|
||
return {
|
||
tab: {
|
||
items: ['轮灌详情', '轮灌方案'],
|
||
current: 0,
|
||
},
|
||
pageSize: 20,
|
||
task: [],
|
||
scenario: [],
|
||
};
|
||
},
|
||
onShow() {},
|
||
mounted() {},
|
||
methods: {
|
||
onClickItem(e) {
|
||
if (this.tab.current != e.currentIndex) {
|
||
this.tab.current = e.currentIndex;
|
||
}
|
||
},
|
||
async queryTask() {
|
||
this.$refs.pagingTask.completeByTotal([]);
|
||
// this.$refs.pagingTask.completeByTotal(res.rows, res.total);
|
||
},
|
||
async queryScenario() {
|
||
isApi.list({
|
||
scenarioType: 2,
|
||
status: "0",
|
||
delFlag: "0",
|
||
}).then(res => {
|
||
this.scenario = res.rows;
|
||
this.$refs.pagingScenario.completeByTotal(res.rows, res.total);
|
||
})
|
||
},
|
||
add() {
|
||
if (this.tab.current === 0) { //新增任务
|
||
|
||
}
|
||
if (this.tab.current === 1) { //新增轮灌
|
||
uni.navigateTo({
|
||
url: '/pages/irrigation/scenario/scenario'
|
||
});
|
||
}
|
||
},
|
||
/********************************* 任务 *********************************/
|
||
//页面跳转
|
||
taskdetails() {
|
||
uni.navigateTo({
|
||
url: '/pages/irrigation/details/taskdetails'
|
||
});
|
||
},
|
||
|
||
/********************************* 方案 *********************************/
|
||
//方案详情
|
||
irrigationgroup(item) {
|
||
uni.navigateTo({
|
||
url: `/pages/irrigation/scenario/detail?id=${item.id}`
|
||
});
|
||
},
|
||
editScenario(item) {
|
||
uni.navigateTo({
|
||
url: `/pages/irrigation/scenario/scenario?id=${item.id}`
|
||
});
|
||
},
|
||
|
||
|
||
|
||
// // 页面跳转
|
||
// config() {
|
||
// uni.navigateTo({
|
||
// url: '/pages/irrigation/config'
|
||
// });
|
||
// }
|
||
|
||
},
|
||
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
// 选项卡
|
||
.segmented-control {
|
||
background-color: #fff;
|
||
}
|
||
|
||
.segmented-control__item--text {
|
||
font-weight: bold;
|
||
}
|
||
|
||
::v-deep .segmented-control__text {
|
||
font-size: 16px;
|
||
}
|
||
|
||
.custom-z-paging {
|
||
margin-top: 80px;
|
||
}
|
||
</style> |