Commit 9645a744ce2b561063b1535f543c9efcc2a9e15a
Merge branch 'sqy_dev' into 'main'
'fix:修改设备相关代码' See merge request huang/thingskit-app!15
Showing
8 changed files
with
182 additions
and
114 deletions
1 | -{ | ||
2 | - "id": "yyh-tab", | ||
3 | - "name": "tab切换,自定义位置、颜色、数据", | ||
4 | - "version": "1.0.1", | ||
5 | - "description": "tab切换,自定义位置、颜色、数据(小程序、app、h5)", | ||
6 | - "keywords": [ | ||
7 | - "tab切换", | ||
8 | - "自定义位置", | ||
9 | - "颜色", | ||
10 | - "数据" | ||
11 | - ] | ||
12 | -} | ||
1 | +{ | ||
2 | + "name": "thingskit-app", | ||
3 | + "version": "1.0.0", | ||
4 | + "description": "### 项目结构", | ||
5 | + "main": "main.js", | ||
6 | + "scripts": { | ||
7 | + "test": "echo \"Error: no test specified\" && exit 1" | ||
8 | + }, | ||
9 | + "repository": { | ||
10 | + "type": "git", | ||
11 | + "url": "http://git.yuntengiot.com/huang/thingskit-app.git" | ||
12 | + }, | ||
13 | + "keywords": [], | ||
14 | + "author": "", | ||
15 | + "license": "ISC", | ||
16 | + "dependencies": { | ||
17 | + "moment": "^2.29.2" | ||
18 | + } | ||
19 | +} |
@@ -23,9 +23,9 @@ | @@ -23,9 +23,9 @@ | ||
23 | <image @click="openOrg" style="width: 6px;height: 10px;float: right; margin-right: 34rpx; margin-top: 58rpx;" src="../../static/right-arrow.png" /> | 23 | <image @click="openOrg" style="width: 6px;height: 10px;float: right; margin-right: 34rpx; margin-top: 58rpx;" src="../../static/right-arrow.png" /> |
24 | </view> | 24 | </view> |
25 | </view> | 25 | </view> |
26 | - <mescroll-body ref="mescrollRef" @init="mescrollInit" :down="downOption" @down="downCallback" @up="upCallback"> | 26 | + <mescroll-body ref="mescrollRef" @init="mescrollInit" :down="downOption" @down="downCallback" @up="upCallback" > |
27 | <view class="device-list"> | 27 | <view class="device-list"> |
28 | - <view @click="openDeviceDetail(item.id)" class="list-item" v-for="item in list" :key="item.id"> | 28 | + <view @click="openDeviceDetail(item.id, item.alarmStatus, item.lastOnlineTime)" class="list-item" v-for="item in list" :key="item.id"> |
29 | <view class="u-flex item" style="justify-content: flex-start;flex-direction: column;align-items: center;"> | 29 | <view class="u-flex item" style="justify-content: flex-start;flex-direction: column;align-items: center;"> |
30 | <view style="width: 450rpx;text-align: left;"> | 30 | <view style="width: 450rpx;text-align: left;"> |
31 | <text style="color:#333;font-size: 15px;">{{ item.name ? `设备名称:${item.name}` : '' }}</text> | 31 | <text style="color:#333;font-size: 15px;">{{ item.name ? `设备名称:${item.name}` : '' }}</text> |
@@ -77,7 +77,7 @@ import fTabbar from '@/components/module/f-tabbar/f-tabbar'; | @@ -77,7 +77,7 @@ import fTabbar from '@/components/module/f-tabbar/f-tabbar'; | ||
77 | import fNavbar from '@/components/module/f-navbar/f-navbar'; | 77 | import fNavbar from '@/components/module/f-navbar/f-navbar'; |
78 | import FilterItem from './FilterItem.vue'; | 78 | import FilterItem from './FilterItem.vue'; |
79 | import MescrollMixin from '@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js'; | 79 | import MescrollMixin from '@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js'; |
80 | -import {debounce} from '@/plugins/throttle.js' | 80 | +import { debounce } from '@/plugins/throttle.js'; |
81 | export default { | 81 | export default { |
82 | mixins: [MescrollMixin], // 使用mixin (在main.js注册全局组件) | 82 | mixins: [MescrollMixin], // 使用mixin (在main.js注册全局组件) |
83 | components: { | 83 | components: { |
@@ -153,7 +153,7 @@ export default { | @@ -153,7 +153,7 @@ export default { | ||
153 | } | 153 | } |
154 | ], | 154 | ], |
155 | total: 0, | 155 | total: 0, |
156 | - list: [], | 156 | + list: [] |
157 | }; | 157 | }; |
158 | }, | 158 | }, |
159 | onLoad() { | 159 | onLoad() { |
@@ -216,9 +216,9 @@ export default { | @@ -216,9 +216,9 @@ export default { | ||
216 | openSearchDialog() { | 216 | openSearchDialog() { |
217 | this.show = true; | 217 | this.show = true; |
218 | }, | 218 | }, |
219 | - openDeviceDetail(id) { | 219 | + openDeviceDetail(id, alarmStatus, lastOnlineTime) { |
220 | uni.navigateTo({ | 220 | uni.navigateTo({ |
221 | - url: `deviceDetail?id=${id}` | 221 | + url: `deviceDetail?id=${id}&alarmStatus=${alarmStatus}&lastOnlineTime=${lastOnlineTime}` |
222 | }); | 222 | }); |
223 | }, | 223 | }, |
224 | handleClickTag(currentIndex, list) { | 224 | handleClickTag(currentIndex, list) { |
@@ -241,11 +241,11 @@ export default { | @@ -241,11 +241,11 @@ export default { | ||
241 | }); | 241 | }); |
242 | this.show = false; | 242 | this.show = false; |
243 | }, | 243 | }, |
244 | - inputChanged:debounce(function(name){ | ||
245 | - this.loadData(1,{ | 244 | + inputChanged: debounce(function(name) { |
245 | + this.loadData(1, { | ||
246 | name | 246 | name |
247 | - }) | ||
248 | - },500) | 247 | + }); |
248 | + }, 500) | ||
249 | } | 249 | } |
250 | }; | 250 | }; |
251 | </script> | 251 | </script> |
@@ -3,11 +3,13 @@ | @@ -3,11 +3,13 @@ | ||
3 | <!-- 公共组件-每个页面必须引入 --> | 3 | <!-- 公共组件-每个页面必须引入 --> |
4 | <public-module></public-module> | 4 | <public-module></public-module> |
5 | <u-sticky bgColor="#fff"><u-tabs :list="list" :current="currentTab" @click="handleTabClick"></u-tabs></u-sticky> | 5 | <u-sticky bgColor="#fff"><u-tabs :list="list" :current="currentTab" @click="handleTabClick"></u-tabs></u-sticky> |
6 | - <view style="margin-top:30rpx;" v-show="currentTab == 0"><basicInfo /></view> | ||
7 | - <view style="margin-top:30rpx;" v-show="currentTab == 1"><realTimeData /></view> | ||
8 | - <view style="margin-top:30rpx;" v-show="currentTab == 2"><historyData /></view> | ||
9 | - <view style="margin-top:30rpx;" v-show="currentTab == 3"><alertHistory /></view> | ||
10 | - <view style="margin-top:30rpx;" v-show="currentTab == 4"><commondRecord /></view> | 6 | + <view style="margin-top:30rpx;"> |
7 | + <basicInfo v-show="currentTab == 0" :deviceDetail="deviceDetail" /> | ||
8 | + <realTimeData v-show="currentTab === 1" /> | ||
9 | + <historyData v-show="currentTab == 2" /> | ||
10 | + <alarmHistory v-show="currentTab == 3" /> | ||
11 | + <commondRecord v-show="currentTab == 4" /> | ||
12 | + </view> | ||
11 | <f-tabbar></f-tabbar> | 13 | <f-tabbar></f-tabbar> |
12 | </view> | 14 | </view> |
13 | </template> | 15 | </template> |
@@ -17,7 +19,7 @@ import fTabbar from '@/components/module/f-tabbar/f-tabbar'; | @@ -17,7 +19,7 @@ import fTabbar from '@/components/module/f-tabbar/f-tabbar'; | ||
17 | import Tab from '@/components/yyh-tab/Tab.vue'; | 19 | import Tab from '@/components/yyh-tab/Tab.vue'; |
18 | import basicInfo from './tabDetail/basicInfo.vue'; | 20 | import basicInfo from './tabDetail/basicInfo.vue'; |
19 | import realTimeData from './tabDetail/realtimeData.vue'; | 21 | import realTimeData from './tabDetail/realtimeData.vue'; |
20 | -import alertHistory from './tabDetail/alertHistory.vue'; | 22 | +import alarmHistory from './tabDetail/alarmHistory.vue'; |
21 | import historyData from './tabDetail/historyData.vue'; | 23 | import historyData from './tabDetail/historyData.vue'; |
22 | import commondRecord from './tabDetail/commondRecord.vue'; | 24 | import commondRecord from './tabDetail/commondRecord.vue'; |
23 | 25 | ||
@@ -27,28 +29,63 @@ export default { | @@ -27,28 +29,63 @@ export default { | ||
27 | Tab, | 29 | Tab, |
28 | basicInfo, | 30 | basicInfo, |
29 | realTimeData, | 31 | realTimeData, |
30 | - alertHistory, | 32 | + alarmHistory, |
31 | historyData, | 33 | historyData, |
32 | commondRecord | 34 | commondRecord |
33 | }, | 35 | }, |
34 | data() { | 36 | data() { |
35 | return { | 37 | return { |
36 | list: [{ name: '基础信息' }, { name: '实时数据' }, { name: '历史数据' }, { name: '告警记录' }, { name: '命令记录' }], | 38 | list: [{ name: '基础信息' }, { name: '实时数据' }, { name: '历史数据' }, { name: '告警记录' }, { name: '命令记录' }], |
37 | - currentTab:0, | 39 | + currentTab: 2, |
38 | id: '', | 40 | id: '', |
41 | + deviceDetail: {} | ||
39 | }; | 42 | }; |
40 | }, | 43 | }, |
41 | - onLoad(options) { | ||
42 | - const { id } = options; | ||
43 | - this.id = id; | ||
44 | - console.log(this.id); | ||
45 | - // 隐藏原生的tabbar | 44 | + async onLoad(options) { |
45 | + const { id, alarmStatus, lastOnlineTime } = options; | ||
46 | + const res = await uni.$u.http.get(`/yt/device/${id}`); | ||
47 | + this.deviceDetail = { ...res, alarmStatus, lastOnlineTime }; | ||
48 | + | ||
49 | + var socketTask = uni.connectSocket({ | ||
50 | + url: 'wss://dev.thingskit.com:8080/api/ws/plugins/telemetry?token=' + uni.getStorageSync('userInfo').isToken, //仅为示例,并非真实接口地址。 | ||
51 | + complete: ()=> {} | ||
52 | + }); | ||
53 | + uni.onSocketOpen((header)=>{ | ||
54 | + console.log('连接成功',header) | ||
55 | + }) | ||
56 | + // socketTask.onMessage(function(data) { | ||
57 | + // console.log('收到消息了', data); | ||
58 | + // }); | ||
59 | + socketTask.send({ | ||
60 | + data: JSON.stringify({ | ||
61 | + attrSubCmds: [], | ||
62 | + tsSubCmds: [ | ||
63 | + { | ||
64 | + entityType: 'DEVICE', | ||
65 | + entityId: id, | ||
66 | + scope: 'LATEST_TELEMETRY', | ||
67 | + cmdId: 1 | ||
68 | + } | ||
69 | + ], | ||
70 | + historyCmds: [], | ||
71 | + entityDataCmds: [], | ||
72 | + entityDataUnsubscribeCmds: [], | ||
73 | + alarmDataCmds: [], | ||
74 | + alarmDataUnsubscribeCmds: [], | ||
75 | + entityCountCmds: [], | ||
76 | + entityCountUnsubscribeCmds: [] | ||
77 | + }), | ||
78 | + success() { | ||
79 | + console.log('发送成功了'); | ||
80 | + } | ||
81 | + }); | ||
82 | + // 隐藏原生的tabbar' | ||
46 | uni.hideTabBar(); | 83 | uni.hideTabBar(); |
47 | }, | 84 | }, |
48 | methods: { | 85 | methods: { |
49 | - handleTabClick({index}){ | 86 | + handleTabClick({ index }) { |
50 | this.currentTab = index; | 87 | this.currentTab = index; |
51 | } | 88 | } |
52 | } | 89 | } |
53 | }; | 90 | }; |
54 | -</script> | ||
91 | +</script> |
pages/device/tabDetail/alarmHistory.vue
renamed from
pages/device/tabDetail/alertHistory.vue
1 | -<template> | ||
2 | - <view class="basic-page"> | ||
3 | - <!-- 公共组件-每个页面必须引入 --> | ||
4 | - <public-module /> | 1 | +<template> |
2 | + <view class="basic-page"> | ||
3 | + <!-- 公共组件-每个页面必须引入 --> | ||
4 | + <public-module /> | ||
5 | <view class="u-flex" style="justify-content: space-between;height: 140rpx;background-color: #fff;border-radius: 18px;"> | 5 | <view class="u-flex" style="justify-content: space-between;height: 140rpx;background-color: #fff;border-radius: 18px;"> |
6 | <view class="u-flex"> | 6 | <view class="u-flex"> |
7 | <view style="margin-left: 20rpx;"> | 7 | <view style="margin-left: 20rpx;"> |
8 | - 网关设备1 | 8 | + {{deviceDetail.name}} |
9 | </view> | 9 | </view> |
10 | - <view style="margin-left: 20rpx; font-size: 14px;color:#377DFF;"> | ||
11 | - 在线 | 10 | + <view style="margin-left: 20rpx; font-size: 14px;" :style="{color:deviceDetail.deviceState==='INACTIVE'?'#666':deviceDetail.deviceState==='ONLINE'?'#377DFF':'#DE4437'}"> |
11 | + {{deviceDetail.deviceState==='INACTIVE'?'未激活':deviceDetail.deviceState==='ONLINE'?'在线':'离线'}} | ||
12 | </view> | 12 | </view> |
13 | </view> | 13 | </view> |
14 | <view style="margin-right: 20rpx;"> | 14 | <view style="margin-right: 20rpx;"> |
15 | <u-button type="primary" shape="circle" size="mini" text="下发命令" @click="showModal"/> | 15 | <u-button type="primary" shape="circle" size="mini" text="下发命令" @click="showModal"/> |
16 | - </view> | ||
17 | - </view> | ||
18 | - <view style="margin-top: 40rpx;height: 577rpx;background-color: #fff;border-radius: 20px;"> | ||
19 | - <u-list> | ||
20 | - <u-list-item v-for="(item, index) in indexList" :key="index"> | ||
21 | - <u-cell :title="item.name1"> | ||
22 | - <view slot="icon">{{item.name1}}</view> | 16 | + </view> |
17 | + </view> | ||
18 | + <view style="margin-top: 40rpx;height: 577rpx;background-color: #fff;border-radius: 20px;"> | ||
19 | + <u-list> | ||
20 | + <u-list-item> | ||
21 | + | ||
22 | + <u-cell :title="deviceDetail.sn"> | ||
23 | + <view slot="icon">设备编号</view> | ||
24 | + </u-cell> | ||
25 | + </u-list-item> | ||
26 | + <u-list-item> | ||
27 | + <u-cell :title="deviceType"> | ||
28 | + <view slot="icon">设备类型</view> | ||
29 | + </u-cell> | ||
30 | + </u-list-item> | ||
31 | + <u-list-item> | ||
32 | + <u-cell :title="deviceDetail.organizationDTO.name"> | ||
33 | + <view slot="icon">所属组织</view> | ||
34 | + </u-cell> | ||
35 | + </u-list-item> | ||
36 | + <u-list-item> | ||
37 | + <u-cell :title="formatLastOnlineTime"> | ||
38 | + <view slot="icon">最后连接时间</view> | ||
39 | + </u-cell> | ||
40 | + </u-list-item> | ||
41 | + <u-list-item> | ||
42 | + <u-cell :title="alarmStatus"> | ||
43 | + <view slot="icon">是否告警</view> | ||
23 | </u-cell> | 44 | </u-cell> |
24 | - </u-list-item> | ||
25 | - </u-list> | ||
26 | - </view> | ||
27 | - <!-- 下发指令 --> | ||
28 | - <u-modal :show="showModel" title="命令下发" closeOnClickOverlay showCancelButton @close="hiddenModal" @cancel="hiddenModal" @confirm="handleConfirm" > | ||
29 | - <u--textarea placeholder="请输入命令内容" v-model="formModel.intro" count /> | ||
30 | - </u-modal> | ||
31 | - <f-tabbar /> | ||
32 | - </view> | ||
33 | -</template> | ||
34 | - | ||
35 | -<script> | ||
36 | - | ||
37 | -export default { | ||
38 | - data() { | ||
39 | - return { | ||
40 | - formModel: { | ||
41 | - intro: '' | ||
42 | - }, | ||
43 | - showModel: false, | ||
44 | - indexList: [ | ||
45 | - { | ||
46 | - id: 1, | ||
47 | - name1: '设备编号', | ||
48 | - value1: 'SN98652320AOL5' | ||
49 | - }, | ||
50 | - { | ||
51 | - name1: '设备类型', | ||
52 | - value1: '网关子设备' | ||
53 | - }, | ||
54 | - { | ||
55 | - name1: '所属组织', | ||
56 | - value1: '1-59-25栏位' | ||
57 | - }, | ||
58 | - { | ||
59 | - name1: '最后连接时间', | ||
60 | - value1: '2022-01-25 12:53:22' | ||
61 | - }, | ||
62 | - { | ||
63 | - name1: '是否告警', | ||
64 | - value1: '否' | ||
65 | - }, | ||
66 | - { | ||
67 | - name1: '设备描述', | ||
68 | - value1: '设备无任何问题,运行稳定' | ||
69 | - } | ||
70 | - ] | ||
71 | - }; | ||
72 | - }, | ||
73 | - onLoad(e) { | ||
74 | - // 隐藏原生的tabbar | ||
75 | - uni.hideTabBar(); | ||
76 | - }, | ||
77 | - methods: { | ||
78 | - showModal() { | ||
79 | - this.showModel = true; | 45 | + </u-list-ite> |
46 | + <u-cell :title="deviceDetail.description"> | ||
47 | + <view slot="icon">设备描述</view> | ||
48 | + </u-cell> | ||
49 | + </u-list-item> | ||
50 | + </u-list> | ||
51 | + </view> | ||
52 | + <!-- 下发指令 --> | ||
53 | + <u-modal :show="showModel" title="命令下发" closeOnClickOverlay showCancelButton @close="hiddenModal" @cancel="hiddenModal" @confirm="handleConfirm" > | ||
54 | + <u--textarea placeholder="请输入命令内容" v-model="formModel.intro" count /> | ||
55 | + </u-modal> | ||
56 | + <f-tabbar /> | ||
57 | + </view> | ||
58 | +</template> | ||
59 | + | ||
60 | +<script> | ||
61 | +import {formatToDate} from '@/plugins/utils.js'; | ||
62 | +export default { | ||
63 | + props:{ | ||
64 | + deviceDetail:{ | ||
65 | + type:Object, | ||
66 | + default:()=>({}), | ||
67 | + } | ||
68 | + }, | ||
69 | + data() { | ||
70 | + return { | ||
71 | + showModel: false, | ||
72 | + }; | ||
73 | + }, | ||
74 | + computed:{ | ||
75 | + deviceType(){ | ||
76 | + return this.deviceDetail.deviceType==='DIRECT_CONNECTION'?'直连设备':this.deviceDetail.deviceType==='GATEWAY'?'网关设备':this.deviceDetail.deviceType==='SENSOR'?'网关子设备':'' | ||
77 | + }, | ||
78 | + alarmStatus(){ | ||
79 | + return this.deviceDetail.alarmStatus === '0'?'否':'是' | ||
80 | + }, | ||
81 | + formatLastOnlineTime(){ | ||
82 | + return formatToDate(Number(this.deviceDetail.lastOnlineTime),'YYYY-MM-DD HH:mm:ss') | ||
83 | + } | ||
84 | + }, | ||
85 | + onLoad(e) { | ||
86 | + // 隐藏原生的tabbar | ||
87 | + uni.hideTabBar(); | ||
88 | + }, | ||
89 | + onMounted(){ | ||
90 | + console.log(this.deviceDetail) | ||
91 | + | ||
92 | + }, | ||
93 | + methods: { | ||
94 | + showModal() { | ||
95 | + this.showModel = true; | ||
80 | }, | 96 | }, |
81 | hiddenModal(){ | 97 | hiddenModal(){ |
82 | this.showModel = false; | 98 | this.showModel = false; |
83 | - }, | 99 | + }, |
84 | handleConfirm(){ | 100 | handleConfirm(){ |
85 | console.log('确定') | 101 | console.log('确定') |
86 | - } | ||
87 | - } | ||
88 | -}; | ||
89 | -</script> | 102 | + } |
103 | + } | ||
104 | +}; | ||
105 | +</script> |
1 | -import Vue from 'vue'; | 1 | +import Vue from 'vue'; |
2 | +import moment from 'moment'; | ||
2 | // #ifdef APP-PLUS | 3 | // #ifdef APP-PLUS |
3 | import {judgePermission} from './permission' | 4 | import {judgePermission} from './permission' |
4 | // #endif | 5 | // #endif |
6 | +const DATE_TIME_FORMAT = 'YYYY-MM-DD HH:mm:ss'; | ||
5 | //金额过滤 | 7 | //金额过滤 |
6 | Vue.filter('money', function(val) { | 8 | Vue.filter('money', function(val) { |
7 | if (val) { | 9 | if (val) { |
@@ -230,4 +232,8 @@ export const getAppLatLon = function(successCallback, errCallback, isOpenSetting | @@ -230,4 +232,8 @@ export const getAppLatLon = function(successCallback, errCallback, isOpenSetting | ||
230 | } | 232 | } |
231 | }); | 233 | }); |
232 | // #endif | 234 | // #endif |
235 | +} | ||
236 | + | ||
237 | +export function formatToDate(date = undefined, format = DATE_TIME_FORMAT) { | ||
238 | + return moment(date).format(format); | ||
233 | } | 239 | } |
@@ -90,7 +90,8 @@ export default { | @@ -90,7 +90,8 @@ export default { | ||
90 | 90 | ||
91 | .mescroll-empty .empty-icon { | 91 | .mescroll-empty .empty-icon { |
92 | width: 280rpx; | 92 | width: 280rpx; |
93 | - height: 280rpx; | 93 | + height: 280rpx; |
94 | + margin: 0 auto; | ||
94 | } | 95 | } |
95 | 96 | ||
96 | .mescroll-empty .empty-tip { | 97 | .mescroll-empty .empty-tip { |