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 | -} | |
\ No newline at end of file | ||
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 | 23 | <image @click="openOrg" style="width: 6px;height: 10px;float: right; margin-right: 34rpx; margin-top: 58rpx;" src="../../static/right-arrow.png" /> |
24 | 24 | </view> |
25 | 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 | 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 | 29 | <view class="u-flex item" style="justify-content: flex-start;flex-direction: column;align-items: center;"> |
30 | 30 | <view style="width: 450rpx;text-align: left;"> |
31 | 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 | 77 | import fNavbar from '@/components/module/f-navbar/f-navbar'; |
78 | 78 | import FilterItem from './FilterItem.vue'; |
79 | 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 | 81 | export default { |
82 | 82 | mixins: [MescrollMixin], // 使用mixin (在main.js注册全局组件) |
83 | 83 | components: { |
... | ... | @@ -153,7 +153,7 @@ export default { |
153 | 153 | } |
154 | 154 | ], |
155 | 155 | total: 0, |
156 | - list: [], | |
156 | + list: [] | |
157 | 157 | }; |
158 | 158 | }, |
159 | 159 | onLoad() { |
... | ... | @@ -216,9 +216,9 @@ export default { |
216 | 216 | openSearchDialog() { |
217 | 217 | this.show = true; |
218 | 218 | }, |
219 | - openDeviceDetail(id) { | |
219 | + openDeviceDetail(id, alarmStatus, lastOnlineTime) { | |
220 | 220 | uni.navigateTo({ |
221 | - url: `deviceDetail?id=${id}` | |
221 | + url: `deviceDetail?id=${id}&alarmStatus=${alarmStatus}&lastOnlineTime=${lastOnlineTime}` | |
222 | 222 | }); |
223 | 223 | }, |
224 | 224 | handleClickTag(currentIndex, list) { |
... | ... | @@ -241,11 +241,11 @@ export default { |
241 | 241 | }); |
242 | 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 | 246 | name |
247 | - }) | |
248 | - },500) | |
247 | + }); | |
248 | + }, 500) | |
249 | 249 | } |
250 | 250 | }; |
251 | 251 | </script> | ... | ... |
... | ... | @@ -3,11 +3,13 @@ |
3 | 3 | <!-- 公共组件-每个页面必须引入 --> |
4 | 4 | <public-module></public-module> |
5 | 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 | 13 | <f-tabbar></f-tabbar> |
12 | 14 | </view> |
13 | 15 | </template> |
... | ... | @@ -17,7 +19,7 @@ import fTabbar from '@/components/module/f-tabbar/f-tabbar'; |
17 | 19 | import Tab from '@/components/yyh-tab/Tab.vue'; |
18 | 20 | import basicInfo from './tabDetail/basicInfo.vue'; |
19 | 21 | import realTimeData from './tabDetail/realtimeData.vue'; |
20 | -import alertHistory from './tabDetail/alertHistory.vue'; | |
22 | +import alarmHistory from './tabDetail/alarmHistory.vue'; | |
21 | 23 | import historyData from './tabDetail/historyData.vue'; |
22 | 24 | import commondRecord from './tabDetail/commondRecord.vue'; |
23 | 25 | |
... | ... | @@ -27,28 +29,63 @@ export default { |
27 | 29 | Tab, |
28 | 30 | basicInfo, |
29 | 31 | realTimeData, |
30 | - alertHistory, | |
32 | + alarmHistory, | |
31 | 33 | historyData, |
32 | 34 | commondRecord |
33 | 35 | }, |
34 | 36 | data() { |
35 | 37 | return { |
36 | 38 | list: [{ name: '基础信息' }, { name: '实时数据' }, { name: '历史数据' }, { name: '告警记录' }, { name: '命令记录' }], |
37 | - currentTab:0, | |
39 | + currentTab: 2, | |
38 | 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 | 83 | uni.hideTabBar(); |
47 | 84 | }, |
48 | 85 | methods: { |
49 | - handleTabClick({index}){ | |
86 | + handleTabClick({ index }) { | |
50 | 87 | this.currentTab = index; |
51 | 88 | } |
52 | 89 | } |
53 | 90 | }; |
54 | -</script> | |
\ No newline at end of file | ||
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 | 5 | <view class="u-flex" style="justify-content: space-between;height: 140rpx;background-color: #fff;border-radius: 18px;"> |
6 | 6 | <view class="u-flex"> |
7 | 7 | <view style="margin-left: 20rpx;"> |
8 | - 网关设备1 | |
8 | + {{deviceDetail.name}} | |
9 | 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 | 12 | </view> |
13 | 13 | </view> |
14 | 14 | <view style="margin-right: 20rpx;"> |
15 | 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 | 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 | 97 | hiddenModal(){ |
82 | 98 | this.showModel = false; |
83 | - }, | |
99 | + }, | |
84 | 100 | handleConfirm(){ |
85 | 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 | 3 | // #ifdef APP-PLUS |
3 | 4 | import {judgePermission} from './permission' |
4 | 5 | // #endif |
6 | +const DATE_TIME_FORMAT = 'YYYY-MM-DD HH:mm:ss'; | |
5 | 7 | //金额过滤 |
6 | 8 | Vue.filter('money', function(val) { |
7 | 9 | if (val) { |
... | ... | @@ -230,4 +232,8 @@ export const getAppLatLon = function(successCallback, errCallback, isOpenSetting |
230 | 232 | } |
231 | 233 | }); |
232 | 234 | // #endif |
235 | +} | |
236 | + | |
237 | +export function formatToDate(date = undefined, format = DATE_TIME_FORMAT) { | |
238 | + return moment(date).format(format); | |
233 | 239 | } |
\ No newline at end of file | ... | ... |