jsy-app/pages/head/index.vue

<template>
	<z-paging ref="paging" use-virtual-list @query="queryList" bg-color="#F3F3F3" :loading-more-enabled="false">
		<template #top>
			<custom-nav-bar :left="false" leftText="" @leftClick="" title="首部">
				<!-- <template v-slot:left>
					<view @click="$refs.landRef.open()">地块</view>
				</template> -->
			</custom-nav-bar>
		</template>
		<view class="text-intel" v-if="landName">
			<view class="iconfont icon-ditu">
			</view>
			<view>
				<span>{{landName}}</span>
			</view>
		</view>
		<template #cell="{item}">
			<view class="card" @click="onClickItem(item)">
				<view class="cards-title">
					<view>
						<view class="text" v-if="item.deviceTypeId==4">
							施肥机编号
						</view>
						<view class="text" v-if="item.deviceTypeId==5">
							首部控制器
						</view>
						<view>
							{{item.deviceCode}}
						</view>
					</view>
				</view>
				<view class="content">
					<view class="cards-content">
						<view class="txt-list">
							<view class="list2">
								<view><text>状态：</text><text
										:class="item.status=='offline'?'font-red':''">{{item.status=="online"?"在线":"离线"}}</text>
								</view>
								<view><text>水流：</text><text>{{item.deviceData.fs == 1 ? "有" : "无"}}</text></view>
								<view><text>水泵开关：</text><text>{{item.deviceData.sc=="1"?"启动":"停止"}}</text></view>
								<view><text>压力：</text><text>{{item.deviceData.wip?item.deviceData.wip:"--"}}Mpa</text>
								</view>
							</view>
							<view class="right">
								<view class="iconfont icon-you">
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</template>
	</z-paging>
	<!-- 地块选择 -->
	<custom-select-land ref="landRef" :data="ijs.companys" :defaultSelect="ijs.land" @getLand="getLand"
		@select="landChange" />

</template>
<script>
	import {
		checkPermi
	} from "@/utils/permission"
	import store from "@/store"
	import plugin from "@/plugins"
	import {
		getHeadDeviceList
	} from "@/api/controlHeadInterface";
	export default {
		data() {
			return {
				ijs: getApp().ijs, // 首页公共js
				title: "",
				isFirst: true,
				user: store.state.user.user,
				landName: null,
				query: {
					landId: null,
					landName: null
				},
			}
		},
		onShow() {
			if (this.ijs.land) {
				this.landName = this.ijs.land.landName;
				this.query.landId = this.ijs.land.id;
				this.queryList();
			}
		},
		methods: {
			queryList() {
				if (this.query.landId) {
					getHeadDeviceList(this.query.landId).then(res => {
						console.log(res)
						this.$refs.paging.complete(res.data)
					});
				}
			},
			// 获取地块信息
			getLand(e) {
				this.ijs.getLand(e.node).then(res => {
					this.$refs.landRef.addLand(e, res.data);
				});
			},
			// 地块选择回调
			landChange(e) {
				this.title = e.landName;
				this.query.landId = e.id;
				this.queryList();
			},
			onClickItem(item) {
				if (item.deviceTypeId === 4) {
					if (item.controlMode == 1) {
						plugin.tab.navigateTo("/pages/head/fertilizerapplicator/detail?item=" + encodeURIComponent(JSON
							.stringify(
								item)))
					}
					if (item.controlMode == 2) {
						plugin.tab.navigateTo("/pages/head/fertilizerapplicator/detailkl?item=" + encodeURIComponent(JSON
							.stringify(
								item)))
					}
				}
				if (item.deviceTypeId === 5) {
					plugin.tab.navigateTo("/pages/head/headdevice/detail?item=" + encodeURIComponent(JSON.stringify(item)))
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	// 顶部nav
	::v-deep.uni-navbar__header-container {
		align-items: center;
		justify-content: center;
	
		&>view {
			font-size: 36rpx;
		}
	}
	
	::v-deep.uni-navbar__header-btns-left {
		font-size: 27rpx;
	}
	
	::v-deep.uni-navbar__header-btns-right .icon {
		font-size: 44rpx;
		margin-left: 10px;
	}

</style>