jsy-app/pages/fourmonitor/index.vue

203 lines
5.4 KiB
Vue
Raw Normal View History

2024-12-19 12:41:30 +08:00
<template>
2025-01-13 18:30:46 +08:00
<z-paging ref="paging" use-virtual-list @query="queryList" bg-color="#F3F3F3" :loading-more-enabled="false">
<template #top>
<custom-nav-bar :left="true" title="农情"></custom-nav-bar>
</template>
2025-01-17 14:24:40 +08:00
<!-- <template #cell="{item}">
2025-01-13 18:30:46 +08:00
<view class="card" @click="onClickItem(item)">
2025-01-16 15:20:52 +08:00
<view class="cards-title">
<view>
<view class="text" v-if="item.deviceTypeId==6">气象站</view>
<view class="text" v-if="item.deviceTypeId==7">虫情</view>
<view class="text" v-if="item.deviceTypeId==8">孢子</view>
<view class="text" v-if="item.deviceTypeId==9">监控</view>
<view v-if="item.deviceCode">{{item.deviceCode}}</view>
<view v-else>-</view>
</view>
</view>
2025-01-13 18:30:46 +08:00
<view class="content">
<view class="cards-content">
<view class="txt-list">
2025-01-16 15:20:52 +08:00
<view class="list2">
<view><text>状态</text><text class="font-green" v-if="item.status == 'online'">在线</text>
<text class="font-red" v-else>离线</text></view>
2024-12-19 18:12:16 +08:00
</view>
2025-01-13 18:30:46 +08:00
<view class="right">
<view class="iconfont icon-you">
2024-12-19 18:12:16 +08:00
</view>
</view>
</view>
</view>
2024-12-19 12:41:30 +08:00
</view>
2025-01-13 18:30:46 +08:00
</view>
2025-01-17 14:24:40 +08:00
</template> -->
2025-01-16 15:20:52 +08:00
<view class="card">
<view class="cards-title">
<view>
<view class="text">气象站F0000000</view>
</view>
</view>
<view class="content">
<view class="cards-content">
<view class="txt-list">
<view class="list2">
<view><text>降雨</text>1254mm</view>
<view><text>风速</text>2.0m/s </view>
<view><text>状态</text><text class="font-green">在线</text>
<!-- <text class="font-red">离线</text> --></view>
</view>
<view class="right">
<view class="iconfont icon-you">
</view>
</view>
</view>
</view>
</view>
</view>
<view class="card">
<view class="cards-title">
<view>
<view class="text">虫情:F0000000</view>
</view>
</view>
<view class="content">
<view class="cards-content">
<view class="txt-list">
<view class="list1">
<view><text>虫情报告</text>内容内容内容内容内容内容</view>
<view><text>报告时间</text>2024-12-11</view>
</view>
<view class="right">
<view class="iconfont icon-you">
</view>
</view>
</view>
</view>
</view>
</view>
<view class="card">
<view class="cards-title">
<view>
<view class="text">孢子F0000000</view>
</view>
</view>
<view class="content">
<view class="cards-content">
<view class="txt-list">
<view class="list1">
<view><text>孢子报告</text>内容内容内容内容内容内容</view>
<view><text>报告时间</text>2024-12-11</view>
</view>
<view class="right">
<view class="iconfont icon-you">
</view>
</view>
</view>
</view>
</view>
</view>
<view class="card">
<view class="cards-title">
<view>
<view class="text">监控F0000000</view>
</view>
</view>
<view class="content">
<view class="cards-content">
<view class="txt-list">
<view class="list2">
<view><text>状态</text><!-- <text class="font-green">在线</text> -->
<text class="font-red">离线</text></view>
</view>
<view class="right">
<view class="iconfont icon-you">
</view>
</view>
</view>
</view>
</view>
</view>
2025-01-13 18:30:46 +08:00
</z-paging>
2024-12-19 12:41:30 +08:00
</template>
2024-12-19 18:12:16 +08:00
<script>
2024-12-19 12:41:30 +08:00
import {
2024-12-19 18:12:16 +08:00
checkPermi
} from "@/utils/permission"
import store from "@/store"
import plugin from "@/plugins"
2024-12-19 12:41:30 +08:00
import {
2024-12-19 18:12:16 +08:00
getOtherDeviceList
} from "@/api/system/controlOtherInterface"
2025-01-13 18:30:46 +08:00
import {
getAccessTokenAndUrl
} from "@/api/system/outdevice";
2024-12-19 18:12:16 +08:00
export default {
data() {
return {
ijs: getApp().ijs, // 首页公共js
title: "",
isFirst: true,
user: store.state.user.user,
query: {
companyGroupId: null,
},
2025-01-13 18:30:46 +08:00
accessToken: null,
ezopenUrl: null
2024-12-19 18:12:16 +08:00
}
},
onShow() {
if (this.ijs.land) {
2024-12-19 19:35:43 +08:00
console.log(this.ijs.land)
2024-12-19 18:12:16 +08:00
this.query.companyGroupId = this.ijs.land.companyGroupId;
this.queryList();
}
},
methods: {
queryList() {
2025-01-13 18:30:46 +08:00
if (!this.query.companyGroupId) {
2024-12-19 18:12:16 +08:00
return;
}
getOtherDeviceList(this.query.companyGroupId).then(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 = land.id;
queryList();
},
onClickItem(item) {
if (item.deviceTypeId === 6) {
2025-01-13 18:30:46 +08:00
plugin.tab.navigateTo("/pages/fourmonitor/weatherstation?item=" + encodeURIComponent(JSON.stringify(
item)))
2024-12-19 18:12:16 +08:00
}
if (item.deviceTypeId === 7) {
plugin.tab.navigateTo("/pages/fourmonitor/pest?item=" + encodeURIComponent(JSON.stringify(item)))
}
if (item.deviceTypeId === 8) {
plugin.tab.navigateTo("/pages/fourmonitor/spore?item=" + encodeURIComponent(JSON.stringify(item)))
}
if (item.deviceTypeId === 9) {
2025-01-13 18:30:46 +08:00
if (!item.ezopenUrl1 || !item.ezopenUrl2) {
2024-12-19 22:23:23 +08:00
plugin.modal.msgError("获取播放地址失败!");
return;
2024-12-19 19:35:43 +08:00
}
2024-12-19 22:23:23 +08:00
plugin.tab.navigateTo("/pages/fourmonitor/camera?item=" + encodeURIComponent(JSON.stringify(item)))
2024-12-19 18:12:16 +08:00
}
2024-12-19 12:41:30 +08:00
}
}
}
</script>
2025-01-13 18:30:46 +08:00
<style lang="scss" scoped>
2025-01-16 15:20:52 +08:00
.txt-list .left ::v-deep text:first-child {
width: auto;
}
2024-12-19 12:41:30 +08:00
</style>