From 576d28de6be2d75bfd5a213874dd8d06657635b5 Mon Sep 17 00:00:00 2001
From: zhuguifei <zhuguifei@zhuguifeideiMac.local>
Date: 星期三, 25 十二月 2024 08:40:20 +0800
Subject: [PATCH] 1.添加实时报警和历史报警 2.添加云服务和局域网模式切换界面
---
pages/tabBar/general.vue | 585 ++++++++++++++++++++++++++++++++++-----------------------
1 files changed, 346 insertions(+), 239 deletions(-)
diff --git a/pages/tabBar/general.vue b/pages/tabBar/general.vue
index d243264..5dd04a6 100644
--- a/pages/tabBar/general.vue
+++ b/pages/tabBar/general.vue
@@ -1,75 +1,10 @@
<template>
<view class="app">
- <!-- <view class="cu-custom custom-bar" :style="[{height:CustomBar + 'px'}]">
- <view class="select-equ-box">
- <u-icon name="setting" color="rgb(255,255,255)" :size="20"></u-icon>
- <text style="margin-left: 10rpx;" @click="show">1鍙峰共鐕ユ満</text>
- <u-icon name="arrow-right" color="rgb(255,255,255)" :size="12"></u-icon>
- </view>
- </view>
- <view class="blank" :style="[{height:CustomBar + 'px'}]">
- </view>
-
- -->
<cu-custom bgColor="bg-gradual-blue" :isBack="false">
- <block slot="content">骞茬嚗璁惧鐩戞帶绯荤粺</block>
+ <block slot="content">鍏版郸鏅鸿兘骞茬嚗</block>
</cu-custom>
-
- <!-- <view class="card-box dynamic shadow cu-list menu">
- <view class="title-box">
- <view class="left">
- <uni-text class="cuIcon-titles text-blue"></uni-text>
- <view class="title">缁熻</view>
- </view>
- </view>
-
- <view class="cu-item" style="padding: 0;">
- <view class="content">
- <image src='/static/me/icon/bianqian.png' class='png' mode='aspectFit'></image>
- <text class="text-lg">鐑樺共鎬婚噺</text>
- </view>
- <view class="action">
- <view class="cu-tag radius bg-blue light">
- 1200kg
- </view>
- </view>
- </view>
-
- <view class="cu-item" style="padding: 0;">
- <view class="content">
- <image src='/static/me/icon/bianqian.png' class='png' mode='aspectFit'></image>
- <text class="text-lg">鐑樺共鏃堕暱</text>
- </view>
- <view class="action">
- <view class="cu-tag radius bg-blue light">
- 300鍒嗛挓
- </view>
- </view>
- </view>
-
- <view class="bxBox">
- <image src="/static/me/icon/bianqian.png" class="png" style="width: 48upx;
- height: 48upx;" mode="aspectFit"></image>
- <view style="padding-left: 10rpx;" class="text-lg">鐑樺共鑽潗</view>
- </view>
-
- <view class='padding-bottom-sm flex flex-wrap bg-white' style="justify-content: flex-end;">
- <view class="cu-tag margin-right-xs bg-blue light radius">
- 褰撳綊
- </view>
- <view class="cu-tag bg-purple light radius">
- 浜哄弬
- </view>
- <view class="cu-tag bg-brown light radius">
- 榫欓』鑽�
- </view>
-
- </view>
-
-
- </view> -->
-
-
+
+ <u-toast ref="uToast"></u-toast>
<view class="card-box dynamic shadow">
<view class="title-box margin-bottom-sm">
<view class="left justify-between">
@@ -88,21 +23,27 @@
<view class="flex">
<view class="flex-sub flex flex-direction">
<text class="text-df">鐑樺共鏁伴噺</text>
- <text class="text-bold text-sl margin-top-xs text-cyan margin-top-sm">{{showValue(model.feed)}} <text
- class="text-gray text-sm margin-left-xs">绛�</text></text>
+ <text class="text-bold text-sl margin-top-xs text-cyan margin-top-sm">{{showValue(model.feed)}}
+ <text class="text-gray text-sm margin-left-xs">绛�</text></text>
</view>
<view class="flex-twice flex flex-direction justify-between">
<view class="flex-sub flex">
<view class="flex flex-direction flex-sub">
<text class="text-gray text-xs">鎵规淇℃伅</text>
- <text class="text-black"><text class="text-black">绉嶇被:</text> {{showValue(model.group)}} <text
- class="text-gray text-xs"></text></text>
+ <text class="text-black">
+ <text class="text-black">绉嶇被:</text>
+ <text class="margin-lr-xs">{{showValue(model.group)}}</text>
+ <text class="text-gray text-xs"></text>
+ </text>
</view>
<view class="flex flex-direction flex-sub">
<text class="text-white text-xs">鎵规</text>
- <text class="text-black"><text class="text-black">鎵规:</text> {{showValue(model.batch)}} <text
- class="text-gray text-xs"></text></text>
+ <text class="text-black">
+ <text class="text-black">鎵规:</text>
+ <text class="margin-lr-xs">{{showValue(model.batch)}}</text>
+ <text class="text-gray text-xs"></text>
+ </text>
</view>
@@ -110,14 +51,20 @@
<view class="flex-sub flex margin-top-sm">
<view class="flex flex-direction flex-sub">
<text class="text-gray text-xs">鐑樺共淇℃伅</text>
- <text class="text-cyan"><text class="text-black">閲嶉噺:</text> {{showValue(model.weight)}} <text
- class="text-gray text-xs">kg</text></text>
+ <text class="text-cyan">
+ <text class="text-black">閲嶉噺:</text>
+ <text class="margin-lr-xs">{{showValue(model.weight)}}</text>
+ <text class="text-gray text-xs">kg</text>
+ </text>
</view>
<view class="flex flex-direction flex-sub">
<text class="text-white text-xs">鏃堕棿</text>
- <text class="text-cyan"><text class="text-black">鏃堕棿:</text> {{showValue(model.dryTime)}} <text
- class="text-gray text-xs">min</text></text>
+ <text class="text-cyan">
+ <text class="text-black">鏃堕棿:</text>
+ <text class="margin-lr-xs">{{showValue(model.dryTime)}}</text>
+ <text class="text-gray text-xs">min</text>
+ </text>
</view>
</view>
@@ -146,78 +93,88 @@
</view>
</view>
- <lunc-calendar ref="calendar" @dayChange="dayChange" weekType="鏄熸湡" @monthChange="monthChange" :showShrink="true" shrinkState="week" :signList="monthList"></lunc-calendar>
+ <lunc-calendar ref="calendar" @dayChange="dayChange" weekType="鏄熸湡" @monthChange="monthChange"
+ :showShrink="true" shrinkState="week" :signList="monthList"></lunc-calendar>
</view>
- <view class="card-box dynamic shadow">
+ <view class="card-box dynamic shadow" >
<view class="title-box">
<view class="left">
<uni-text class="cuIcon-titles text-blue"></uni-text>
<view class="title">鏄庣粏</view>
</view>
</view>
-
- <view class="data-item" v-for="(item, index) in herbList" :key="item.id" style="padding: 0 10rpx;">
- <view class="flex justify-between text-lg align-center padding-tb-xs">
- <view class="flex">
- <text>涓崏鑽�</text>
- <text>涓�</text>
- <text>{{showValue(item.herbName)}}</text>
- <!-- <view class="margin-lr-sm">
+ <u-skeleton rows="20" :loading="loading" :title="false">
+ <view class="data-item" v-for="(item, index) in herbList" :key="item.id" style="padding: 0 10rpx;">
+ <view class="flex justify-between text-lg align-center padding-tb-xs">
+ <view class="flex">
+ <text>涓崏鑽�</text>
+ <text>涓�</text>
+ <text @click="showLongName(showValue(item.herbName))"
+ class="text-cut flex-twice">{{showValue(item.herbName)}}</text>
+ <!-- <view class="margin-lr-sm">
<u-tag text="鎶ヨ涓�娆�" plain size="mini" type="warning"></u-tag>
- </view> -->
- <view class="margin-lr-sm">
- <u-tag text="姝ｅ父" plain size="mini" type="success"></u-tag>
+ </view> -->
+ <view class="margin-lr-sm">
+ <u-tag text="姝ｅ父" plain size="mini" type="success"></u-tag>
+ </view>
+ </view>
+ <view style="width:160rpx;" class="flex align-center text-xs ">
+ <text>杩涘害:</text>
+ <view style="width: 100rpx;">
+ <u-line-progress :percentage="calcProgress(item.dryTime,item.et)"
+ height="10"></u-line-progress>
+ </view>
</view>
</view>
- <view style="width:160rpx;" class="flex align-center text-xs ">
- <text>杩涘害:</text>
- <view style="width: 100rpx;">
- <u-line-progress :percentage="calcProgress(item.dryTime,item.et)" height="10"></u-line-progress>
+
+ <view style="display: flex;flex-direction: row;height: 120rpx;">
+ <view class="image">
+ <image :src="dataList[0].goodsUrl" mode="aspectFill"></image>
+ </view>
+
+ <view class="flex flex-direction margin-left-xl margin-left-sm justify-center">
+ <view>
+ <text class="text-xxl text-green">{{showValue(item.target)}}%</text>
+ <text
+ class="text-xs margin-top-xs text-grey margin-left-xs text-line-through">{{showValue(item.initial)}}%</text>
+ </view>
+ <text class="text-xs margin-top-xs text-grey">鍚按鐜�</text>
+ </view>
+
+ <view class="flex flex-direction margin-left-xl margin-left-10p justify-center">
+ <view>
+ <text class="text-xxl">{{showValue(item.yield )}}kg</text>
+ <text
+ class="text-xs margin-top-xs text-grey margin-left-xs text-line-through">{{showValue(item.originWeight)}}kg</text>
+ </view>
+
+ <view class="text-xs margin-top-xs text-grey">
+ <text>{{showValue(item.feed)}}绛�</text>
+ <text style="margin: 0 10rpx;"> l </text>
+ <text>{{showValue(item.windTemp)}}鈩�</text>
+ <text style="margin: 0 10rpx;"> l </text>
+ <text>{{showValue(item.dryTime)}}min</text>
+ </view>
</view>
</view>
+ <u-gap height="10"></u-gap>
+ <view class="text-grey text-sm flex justify-between">
+ <text>{{showValue(item.code)}}</text>
+ <text>{{showValue(item.orderTime)}}</text>
+ </view>
+ <u-line color="#f1f1f1" margin="15rpx 0 15rpx 0"></u-line>
</view>
- <view style="display: flex;flex-direction: row;height: 120rpx;">
- <view class="image">
- <image :src="dataList[0].goodsUrl" mode="aspectFill"></image>
- </view>
- <view class="flex flex-direction margin-left-xl margin-left-sm justify-center">
- <view>
- <text class="text-xxl text-green">{{showValue(item.target)}}%</text>
- <text class="text-xs margin-top-xs text-grey text-line-through">{{showValue(item.initial)}}%</text>
- </view>
- <text class="text-xs margin-top-xs text-grey">鍚按鐜�</text>
- </view>
- <view class="flex flex-direction margin-left-xl margin-left-10p justify-center">
- <view>
- <text class="text-xxl">{{showValue(item.yield )}}kg</text>
- <text
- class="text-xs margin-top-xs text-grey text-line-through">{{showValue(item.originWeight)}}kg</text>
- </view>
-
- <view class="text-xs margin-top-xs text-grey">
- <text>{{showValue(item.feed)}}绛�</text>
- <text style="margin: 0 10rpx;"> l </text>
- <text>{{showValue(item.windTemp)}}鈩�</text>
- <text style="margin: 0 10rpx;"> l </text>
- <text>{{showValue(item.dryTime)}}min</text>
- </view>
- </view>
- </view>
- <u-gap height="10"></u-gap>
- <view class="text-grey text-sm flex justify-between">
- <text>{{showValue(item.code)}}</text>
- <text>{{showValue(item.orderTime)}}</text>
- </view>
- <u-line color="#f1f1f1" margin="15rpx 0 15rpx 0"></u-line>
- </view>
-
+ </u-skeleton>
</view>
+
+
+ <mqtt-view ref="mqttView"></mqtt-view>
<!--
<view class="page-box" v-show="false">
<view class="order" v-for="(res, index) in dataList" :key="res.id">
@@ -261,11 +218,15 @@
</view>
</view>
</view> -->
+
</view>
</template>
<script>
+ import get from 'lodash.get'
+
export default {
+
data() {
return {
list: [{
@@ -281,9 +242,10 @@
}],
StatusBar: this.StatusBar,
CustomBar: this.CustomBar,
+ loading: true,
percent: 50,
- activeColor: '#0081ff',
- monthList:[],
+ activeColor: '#0081ff',
+ monthList: [],
signList: [{
date: "2023-03-13",
title: "榫欓』鑽�",
@@ -329,137 +291,278 @@
time: '2021骞�10鏈�18鏃�'
}
],
- model: {
- date: uni.$u.timeFormat(new Date(), 'yyyy-mm-dd'),
+ model: {
+ date: uni.$u.timeFormat(new Date(), 'yyyy-mm-dd'),
},
herbList: []
}
},
onShow() {
- console.info('onShow')
-
-
- },
- onReady() {
- let month = uni.$u.timeFormat(new Date(), 'yyyy-mm')
- this.getMonth(month)
-
- let day = uni.$u.timeFormat(new Date(), 'yyyy-mm-dd')
- this.getOrderList(day,day)
-
- },
- methods: {
- dayChange(dayInfo) { // 鐐瑰嚮鏃ユ湡
- this.model.date = dayInfo.date
- console.log("鐐瑰嚮鏃ユ湡", JSON.parse(JSON.stringify(dayInfo)));
- this.getOrderList(dayInfo.date,dayInfo.date);
- },
- monthChange(monthInfo) { // 鍒囨崲鏈堜唤
- console.log("鍒囨崲鏈堜唤", JSON.parse(JSON.stringify(monthInfo)));
- let m = monthInfo.month
- if(m<10){
- m = '0' + m
- }
- let month = monthInfo.year + '-' + m
- console.info(month)
- this.getMonth(month)
- },
- showValue(value){
- if(value == null){
- return "--"
- }
- return value
- },
- show(e) {
- console.info(this.CustomBar)
+ },
+ mounted() {
+
+
+
+ },
+ onReady() {
+ //鎺ユ敹鎶ヨ淇℃伅锛屾暟鎹澶勭悊锛堟湭鎵撳紑tab鏃犳硶鎺ユ敹鏁版嵁锛�
+ uni.$on(this.$constant.MQTT_TOPIC_MESSAGE, (data) => {
+ let json = JSON.parse(data);
+ if (json == null || json.data == null || json.topic == null) {
+ return false
+ }
+ //鍦ㄦ姤璀﹂〉闈㈡椂涓嶆樉绀虹孩鐐�
+ if (getApp().globalData.selectTab === 2) {
+ uni.hideTabBarRedDot({
+ index: 2
+ });
+ return false
+ }
+
+ let wdata = json.data
+ let topic = json.topic
+ switch (topic) {
+ //topic 瀹炴椂鎶ヨ
+ case this.$constant.SERVICE_BROADCAST_TENANT_REAL_FAULT.replace('%s', this.tenantId):
+ if (wdata.length > 0) {
+ uni.showTabBarRedDot({
+ index: 2 // 鏄剧ず绗�2涓猼abbar椤癸紙绱㈠紩浠�0寮�濮嬶級鐨勭孩鐐�
+ });
+ }
+ break
+ }
+
+ });
+
+ this.$refs.mqttView.initMqtt()
+
+ let month = uni.$u.timeFormat(new Date(), 'yyyy-mm')
+ this.getMonth(month)
+
+ let day = uni.$u.timeFormat(new Date(), 'yyyy-mm-dd')
+ this.getOrderList(day, day);
+
+
+ },
+ onLoad() {},
+ onTabItemTap: function(e) {
+ getApp().globalData.selectTab = e.index
+ },
+ methods: {
+
+ /* 杩炴帴MQTT */
+ async startConnect() {
+ var _this = this
+ const account = uni.getStorageSync('account');
+
+
+ if (!account) {
+
+ return false
+ }
+ let opts = {
+ // #ifdef H5
+ url: 'ws://' + this.$api.mqttBaseUrl + ':8083/mqtt',
+ // #endif
+ // #ifdef APP-PLUS
+ url: 'wx://' + this.$api.mqttBaseUrl + ':8083/mqtt',
+ // #endif
+ clientId: this.deviceId,
+ username: account.username,
+ password: account.password
+ }
+ if (!this.$mqttTool.client) {
+ var client = await this.$mqttTool.connect(opts);
+ }
+ //璁㈤槄鏌ヨ璁惧鐘舵�佽繑鍥炴暟鎹�
+ this.$mqttTool.subscribe({
+ topic: this.$constant.SERVICE_DOWN + '/' + deviceid + '/#',
+ qos: 0
+ }).then(res => {
+ console.error(res)
+ })
+
+ //璁㈤槄璁惧瀹炴椂鏁呴殰骞挎挱锛堝箍鎾笉鍦ㄤ箮瀹㈡埛绔痠d锛屽彂閫佺粰绉熸埛涓嬫墍鏈夊湪绾跨殑璁惧锛�
+ this.$mqttTool.subscribe({
+ topic: this.$constant.SERVICE_BROADCAST_TENANT_REAL_FAULT.replace('%s', this.tenantId),
+ qos: 0
+ }).then(res => {
+ console.error(res)
+ })
+
+ //璁㈤槄璁惧瀹炴椂鏁呴殰锛堜富鍔ㄨ姹傚彧鍙戠粰璇锋眰璁惧锛�
+ this.$mqttTool.subscribe({
+ topic: this.$constant.SERVICE_BROADCAST_TENANT_REAL_FAULT.replace('%s', this.deviceId),
+ qos: 0
+ }).then(res => {
+ console.error(res)
+ })
+ //璁㈤槄鍙戦�佹寚浠よ繑鍥炵粨鏋�
+ // this.$mqttTool.subscribe({
+ // topic: this.$constant.SERVICE_RES_EQU_CMD,
+ // qos: 0
+ // }).then(res => {
+ // console.error(res)
+ // })
+ // if (!client) {
+ // return false
+ // }
+
+ client.on('connect', function(res) {
+ console.error('杩炴帴鎴愬姛')
+ })
+ client.on('reconnect', function(res) {
+ console.error('閲嶆柊杩炴帴')
+ })
+ client.on('error', function(res) {
+ console.info('杩炴帴閿欒')
+ })
+ client.on('close', function(res) {
+
+ console.error('鍏抽棴鎴愬姛')
+
+ })
+ client.on('message', function(topic, message, buffer) {
+ //console.info(message)
+ })
+ },
+
+
+ showLongName(longName) {
+ this.$refs.uToast.show({
+ type: 'default',
+ message: longName
+ })
+
+ },
+ dayChange(dayInfo) { // 鐐瑰嚮鏃ユ湡
+ this.model.date = dayInfo.date
+ this.getOrderList(dayInfo.date, dayInfo.date);
+ },
+ monthChange(monthInfo) { // 鍒囨崲鏈堜唤
+ let m = monthInfo.month
+ if (m < 10) {
+ m = '0' + m
+ }
+ let month = monthInfo.year + '-' + m
+ this.getMonth(month)
+ },
+ showValue(value) {
+ if (value == null) {
+ return "--"
+ }
+ return value
},
goCharts(e) {
uni.navigateTo({
url: "/pages/charts/charts"
})
},
- getOrderList(date1,date2) {
- let params = {
- "orderTime_begin":date1 + " 00:00:00",
- "orderTime_end":date2 + " 23:59:59",
+ getOrderList(date1, date2) {
+ let params = {
+ "orderTime_begin": date1 + " 00:00:00",
+ "orderTime_end": date2 + " 23:59:59",
}
+ this.loading = true;
this.$api.getOrderList(params).then((res) => {
+ setTimeout(()=>{
+ this.loading = false
+ },200)
if (res.success) {
- this.herbList = res.result.records
-
- let feed = this.countTotal(this.herbList,"feed");
- let weight = this.countTotal(this.herbList,"originWeight");
- let dryTime = this.countTotal(this.herbList,"dryTime");
-
- let gList = [];
- this.herbList.forEach(item => {
- if(!gList.includes(item.herbName)){
- gList.push(item.herbName)
- }
- });
- this.model.feed = feed
- this.model.group = gList.length
- this.model.batch = this.herbList.length
- this.model.weight = weight
- this.model.dryTime = dryTime
-
- console.info(this.model)
+ this.herbList = res.result.records
+
+ let feed = this.countTotal(this.herbList, "feed");
+ let weight = this.countTotal(this.herbList, "originWeight");
+ let dryTime = this.countTotal(this.herbList, "dryTime");
+
+ let gList = [];
+ this.herbList.forEach(item => {
+ if (!gList.includes(item.herbName)) {
+ gList.push(item.herbName)
+ }
+ });
+
+ if (weight) {
+ weight = weight.toFixed(1)
+ }
+ this.model.feed = feed
+ this.model.group = gList.length
+ this.model.batch = this.herbList.length
+ this.model.weight = weight
+ this.model.dryTime = dryTime
}
})
},
- getMonth(month){
- let params = {
- month:month
- }
- this.$api.getMonth(params).then((res) => {
- if(res.success){
- let list = res.result || []
- list = list.map(item => {
- let rec = {}
- rec.date = item;
- rec.title = "鐢熶骇";
- rec.info = "";
-
- return rec
- })
- this.monthList = [...this.monthList,...list]
- this.$refs.calendar.addSignList(this.monthList);
-
- if(res.result&&res.result.length>0){
- let date = res.result[0]
- let array = date.split('-')
- if(array && array.length == 3){
- this.$refs.calendar.clickDay({"day":array[2],"month":array[1],"year":array[0]})
- }
-
- }
-
-
-
- }
-
- })
- },
+ getMonth(month) {
+ let params = {
+ month: month
+ }
+ this.$api.getMonth(params).then((res) => {
+ if (res.success) {
+ let list = res.result || []
+ list = list.map(item => {
+ let rec = {}
+ rec.date = item;
+ rec.title = "鐢熶骇";
+ rec.info = "";
+
+ return rec
+ })
+ this.monthList = [...this.monthList, ...list]
+ this.$refs.calendar.addSignList(this.monthList);
+
+ if (res.result && res.result.length > 0) {
+ let date = res.result[0]
+ let array = date.split('-')
+ if (array && array.length == 3) {
+ this.$refs.calendar.clickDay({
+ "day": parseInt(array[2]),
+ "month": parseInt(array[1]),
+ "year": parseInt(array[0])
+ })
+ }
+
+ }
+
+
+
+ }
+
+ })
+ },
//璁＄畻棰勬祴杩涘害
calcProgress(dryTime, et) {
if (dryTime && et) {
let res = dryTime / et * 100
res = res.toFixed(2)
return res
- }
+ }
return 0;
- },
- //璁＄畻瀵硅薄鏁扮粍涓煇涓睘鎬у悎璁�
- countTotal(arr, keyName) {
- let $total = 0;
- $total = arr.reduce(function (total, currentValue, currentIndex, arr){
- return currentValue[keyName] ? (total + currentValue[keyName]) : total;
- }, 0);
- return $total;
- }
-
+ },
+ //璁＄畻瀵硅薄鏁扮粍涓煇涓睘鎬у悎璁�
+ countTotal(arr, keyName) {
+ let $total = 0;
+ $total = arr.reduce(function(total, currentValue, currentIndex, arr) {
+ return currentValue[keyName] ? (total + currentValue[keyName]) : total;
+ }, 0);
+ return $total;
+ }
+
+
+
+ },
+ computed: {
+ tenantId() {
+ const userinfo = uni.getStorageSync('userinfo');
+ const tenantid = userinfo.loginTenantId
+ return tenantid;
+ },
+ deviceId() {
+
+ return uni.getStorageSync(this.$constant.DEVICE_ID);
+ },
}
@@ -468,7 +571,11 @@
</script>
<style lang="scss" scoped>
- .app {}
+ .app {
+ width: 100%;
+ max-height: 100vh;
+ overflow: hidden;
+ }
.custom-bar {
background-image: linear-gradient(to right, #0381FF, #0381FF);
@@ -675,4 +782,4 @@
text-align: center;
}
}
-</style>
+</style>
\ No newline at end of file
--
Gitblit v1.9.3