From ba616e9307681da4781b7610ec3c27721d793379 Mon Sep 17 00:00:00 2001
From: guifei zhu <guifeizhu@guifeideiMac.local>
Date: 星期三, 18 九月 2024 12:13:37 +0800
Subject: [PATCH] 添加mqtt通讯
---
pages/tabBar/device.vue | 200 ++++++++++++++++++++++++++-----------------------
1 files changed, 105 insertions(+), 95 deletions(-)
diff --git a/pages/tabBar/device.vue b/pages/tabBar/device.vue
index f6ca562..faff43c 100644
--- a/pages/tabBar/device.vue
+++ b/pages/tabBar/device.vue
@@ -12,13 +12,14 @@
<view class="card-box dynamic shadow">
<view class="title-box margin-bottom-sm">
- <view style="width: 100vw;" class="left justify-between">
+ <view style="width: 100vw;" class="left justify-between">
<view class="flex align-center">
<uni-text class="cuIcon-titles text-blue"></uni-text>
<view class="title">鎬昏</view>
</view>
<view>
- <text class="text-gray margin-right-lg">2024-07-14</text>
+ <text
+ class="text-gray margin-right-lg">{{new Date().toLocaleDateString().replace(/\//g, '-')}}</text>
</view>
</view>
@@ -28,20 +29,20 @@
<view class="flex">
<view class="flex-sub flex flex-direction text-center">
<text class="text-df">璁惧鎬绘暟</text>
- <text class="text-bold text-sl margin-top-xs text-gray margin-top-sm">20
+ <text class="text-bold text-sl margin-top-xs text-gray margin-top-sm">{{equCount}}
<text class="text-gray text-sm margin-left-xs">鍙�</text></text>
- </view>
-
- <view class="flex-sub flex flex-direction text-center">
- <text class="text-df">寮�鏈鸿澶�</text>
- <text class="text-bold text-sl margin-top-xs text-gray margin-top-sm">10
- <text class="text-gray text-sm margin-left-xs">鍙�</text></text>
- </view>
-
- <view class="flex-sub flex flex-direction text-center">
- <text class="text-df">杩愯璁惧</text>
- <text class="text-bold text-sl margin-top-xs text-cyan margin-top-sm">10
- <text class="text-gray text-sm margin-left-xs">鍙�</text></text>
+ </view>
+
+ <view class="flex-sub flex flex-direction text-center">
+ <text class="text-df">寮�鏈鸿澶�</text>
+ <text class="text-bold text-sl margin-top-xs text-gray margin-top-sm">{{onlineCount}}
+ <text class="text-gray text-sm margin-left-xs">鍙�</text></text>
+ </view>
+
+ <view class="flex-sub flex flex-direction text-center">
+ <text class="text-df">杩愯璁惧</text>
+ <text class="text-bold text-sl margin-top-xs text-cyan margin-top-sm">{{onlineCount}}
+ <text class="text-gray text-sm margin-left-xs">鍙�</text></text>
</view>
</view>
<view class="margin-top">
@@ -58,62 +59,64 @@
</template>
-
-
-
- <u-skeleton
- class=" "
- rows="20"
- :loading="loading"
- :title="false"
- >
- <!-- 濡傛灉甯屾湜鍏朵粬view璺熺潃椤甸潰婊氬姩锛屽彲浠ユ斁鍦▃-paging鏍囩鍐� -->
- <view class="card-box dynamic shadow" v-for="(item,index) in dataList" :key="index"
- @click="itemClick(item)">
- <view class="title-box">
- <view class="left flex-sub">
- <uni-text class="cuIcon-titles text-blue"></uni-text>
- <view class="title text-cut">1#鏅鸿兘骞茬嚗鏈�</view>
- <view class="flex title text-green text-sm">
- <u-tag size="mini" text="鍦ㄧ嚎" type="success" plain plainFill></u-tag>
- <u-tag class="margin-left-xs" size="mini" text="鍋滄満" type="error" plain plainFill></u-tag>
+
+
+
+ <u-skeleton class=" " rows="20" :loading="loading" :title="false">
+ <!-- 濡傛灉甯屾湜鍏朵粬view璺熺潃椤甸潰婊氬姩锛屽彲浠ユ斁鍦▃-paging鏍囩鍐� -->
+ <view class="card-box dynamic shadow" v-for="(item,index) in dataList" :key="index"
+ @click="itemClick(item)">
+ <view class="title-box">
+ <view class="left flex-sub">
+ <uni-text class="cuIcon-titles text-blue"></uni-text>
+ <view class="title text-cut">{{$lget(item,'name')}}</view>
+ <view class="flex title text-green text-sm">
+ <u-tag v-if="item.online" size="mini" text="鍦ㄧ嚎" type="success" plain plainFill></u-tag>
+ <u-tag v-else class="" size="mini" text="鍋滄満" type="error" plain plainFill></u-tag>
+ </view>
</view>
- </view>
- <view class="right" style="min-width: 240rpx;">
- <!-- <u-badge :isDot="true" type="success"></u-badge> -->
- <view class="title text-gray text-sm">寮�鏈烘椂闂�:</view>
- <view class="title text-gray text-sm">10:00:10</view>
- </view>
- </view>
-
- <view class="info-box">
- <view class="left flex-sub">
- <view class="title text-sm">鐑樺共鑽潗:</view>
- <view class="title text-sm">鐢熷湴榛�</view>
- </view>
- <view class="right" style="min-width: 240rpx;">
- <view class="title text-sm">鐑樺共鏃堕棿:</view>
- <view class="title text-sm">01:20:00</view>
- </view>
- </view>
-
- <view class="info-box">
- <view class="left flex-sub">
- <view class="title text-sm text-cut">鎶ヨ淇℃伅:</view>
- <view class="flex title text-sm">
- <u-tag size="mini" text="娓╁害浼犳劅鍣ㄦ姤璀�" type="warning" plain plainFill></u-tag>
- <u-tag size="mini" class="margin-left-xs" text="鍓嶉棬鏈叧" type="warning" plain
- plainFill></u-tag>
- <u-tag size="mini" class="margin-left-xs" text="椋庣浣庝綅鎶ヨ" type="error" plain
- plainFill></u-tag>
+ <view class="right" style="min-width: 240rpx;">
+ <!-- <u-badge :isDot="true" type="success"></u-badge> -->
+ <!-- <view class="title text-gray text-sm">寮�鏈烘椂闂�:</view> -->
+ <view class="title text-gray text-sm">{{$lget(item,'upTime')}}</view>
</view>
</view>
+ <view class="info-box">
+ <view class="left flex-sub">
+ <view class="title text-sm">鐑樺共鑽潗:</view>
+ <view class="title text-sm text-gray">--</view>
+ </view>
+ <view class="right" style="min-width: 240rpx;">
+ <view class="title text-sm">鐑樺共鏃堕棿:</view>
+ <view class="title text-sm text-gray">--</view>
+ </view>
+ </view>
+
+ <view class="info-box">
+ <view class="left flex-sub">
+ <view class="title text-sm text-cut">鎶ヨ淇℃伅:</view>
+ <view class="flex title text-sm">
+ <template v-if="item.online && !item.fault">
+ <u-tag size="mini" text="姝ｅ父" type="success" plain plainFill></u-tag>
+ </template>
+ <template v-else-if="item.fault">
+ <u-tag size="mini" text="娓╁害浼犳劅鍣ㄦ姤璀�" type="warning" plain plainFill></u-tag>
+ <u-tag size="mini" class="margin-left-xs" text="鍓嶉棬鏈叧" type="warning" plain
+ plainFill></u-tag>
+ <u-tag size="mini" class="margin-left-xs" text="椋庣浣庝綅鎶ヨ" type="error" plain
+ plainFill></u-tag>
+ </template>
+ <template v-else>
+ </template>
+ </view>
+ </view>
+
+ </view>
+
</view>
- </view>
-
- </u-skeleton>
+ </u-skeleton>
</z-paging>
</view>
</template>
@@ -121,46 +124,53 @@
<script>
export default {
data() {
- return {
- loading:true,
+ return {
+ loading: true,
// v-model缁戝畾鐨勮繖涓彉閲忎笉瑕佸湪鍒嗛〉璇锋眰缁撴潫涓嚜宸辫祴鍊硷紒锛侊紒
- dataList: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
+ dataList: [],
}
},
methods: {
- queryList(pageNo, pageSize) {
+ queryList(pageNo, pageSize) {
this.loading = true;
// 缁勪欢鍔犺浇鏃朵細鑷姩瑙﹀彂姝ゆ柟娉曪紝鍥犳榛樿椤甸潰鍔犺浇鏃朵細鑷姩瑙﹀彂锛屾棤闇�鎵嬪姩璋冪敤
// 杩欓噷鐨刾ageNo鍜宲ageSize浼氳嚜鍔ㄨ绠楀ソ锛岀洿鎺ヤ紶缁欐湇鍔″櫒鍗冲彲
// 妯℃嫙璇锋眰鏈嶅姟鍣ㄨ幏鍙栧垎椤垫暟鎹紝璇锋浛鎹㈡垚鑷繁鐨勭綉缁滆姹�
- // const params = {
- // pageNo: pageNo,
- // pageSize: pageSize,
- // }
- // this.$request.queryList(params).then(res => {
- // // 灏嗚姹傜殑缁撴灉鏁扮粍浼犻�掔粰z-paging
- this.$refs.paging.complete(this.dataList);
- // }).catch(res => {
- // // 濡傛灉璇锋眰澶辫触鍐檛his.$refs.paging.complete(false);
- // // 娉ㄦ剰锛屾瘡娆￠兘闇�瑕佸湪catch涓啓杩欏彞璇濆緢楹荤儲锛寊-paging鎻愪緵浜嗘柟妗堝彲浠ュ叏灞�缁熶竴澶勭悊
- // // 鍦ㄥ簳灞傜殑缃戠粶璇锋眰鎶涘嚭寮傚父鏃讹紝鍐檜ni.$emit('z-paging-error-emit');鍗冲彲
- // this.$refs.paging.complete(false);
- // })
- setTimeout(() => {
- this.loading = false
- }, 1000)
- },
- itemClick(item){
- uni.navigateTo({
- url:"/pages/device/control"
- })
+ const params = {
+ pageNo: pageNo,
+ pageSize: pageSize,
+ }
+ this.$api.queryEquList(params).then((res) => {
+ // // 灏嗚姹傜殑缁撴灉鏁扮粍浼犻�掔粰z-paging
+ this.$refs.paging.complete(res.result.records);
+ this.loading = false
+ }).catch(res => {
+ // 濡傛灉璇锋眰澶辫触鍐檛his.$refs.paging.complete(false);
+ // 娉ㄦ剰锛屾瘡娆￠兘闇�瑕佸湪catch涓啓杩欏彞璇濆緢楹荤儲锛寊-paging鎻愪緵浜嗘柟妗堝彲浠ュ叏灞�缁熶竴澶勭悊
+ // 鍦ㄥ簳灞傜殑缃戠粶璇锋眰鎶涘嚭寮傚父鏃讹紝鍐檜ni.$emit('z-paging-error-emit');鍗冲彲
+ this.$refs.paging.complete(false);
+ this.loading = false
+ })
+
+ },
+ itemClick(item) {
+ uni.navigateTo({
+ url: "/pages/device/control?code="+item.code+"&clientId="+item.clientId
+ })
}
- },onReady() {
-
- setTimeout(() => {
- this.loading = false
- }, 1000)
+ },
+ onReady() {
+
+ },
+ computed: {
+ equCount() {
+ return this.dataList.length
+ },
+ onlineCount() {
+ const list = this.dataList.filter(item => item.online)
+ return list.length
+ }
}
}
</script>
--
Gitblit v1.9.3