Browse Source

save

master
lihua 5 years ago
parent
commit
656d86b53b
  1. 22
      common/dateUtils.js
  2. 1
      main.js
  3. 2
      manifest.json
  4. 93
      pages/device/device.vue
  5. 35
      pages/device/real-data.vue
  6. 30
      pages/home/home.vue

22
common/dateUtils.js

@ -0,0 +1,22 @@
Date.prototype.format = function(format) {
var o = {
"M+": this.getMonth() + 1, //month
"d+": this.getDate(), //day
"h+": this.getHours(), //hour
"m+": this.getMinutes(), //minute
"s+": this.getSeconds(), //second
"q+": Math.floor((this.getMonth() + 3) / 3), //quarter
"S": this.getMilliseconds() //millisecond
}
if (/(y+)/.test(format)) {
format = format.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
}
for (var k in o) {
if (new RegExp("(" + k + ")").test(format)) {
format = format.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length));
}
}
return format;
}

1
main.js

@ -1,6 +1,7 @@
import Vue from 'vue' import Vue from 'vue'
import App from './App' import App from './App'
import store from './store' import store from './store'
import './common/dateUtils'
Vue.config.productionTip = false Vue.config.productionTip = false

2
manifest.json

@ -1,5 +1,5 @@
{ {
"name" : "hello-uni-app", "name" : "humitureApp",
"appid" : "__UNI__1E9AE51", "appid" : "__UNI__1E9AE51",
"description" : "", "description" : "",
"versionName" : "1.0.0", "versionName" : "1.0.0",

93
pages/device/device.vue

@ -1,38 +1,28 @@
<template> <template>
<view @touchstart="refreshStart" @touchmove="refreshMove" @touchend="refreshEnd"> <view @touchstart="refreshStart" @touchmove="refreshMove" @touchend="refreshEnd">
<refresh ref="refresh" @isRefresh='isRefresh'></refresh> <refresh ref="refresh" @isRefresh='isRefresh'></refresh>
<mSearch :mode="2" button="inside" @search="search($event)" ></mSearch>
<mSearch :mode="2" button="inside" @search="search($event)" backgroundColor="#0081ff"></mSearch> <view class="cu-list menu-avatar margin-top" v-for="(item,index) in deviceList" :key="index">
<nav-tab style="margin-top: -10upx;" textFlex :tab-list="tabList" :tabCur="tabCur" @change="tabChange" tab-class="text-center text-white bg-blue " select-class="text-white"></nav-tab>
<view class="cu-list menu-avatar margin-top">
<view class="cu-item arrow"> <view class="cu-item arrow">
<view class="cu-avatar round lg" style="background-image:url(/static/humiture.png);"></view> <view class="cu-avatar round lg" style="background-image:url(/static/humiture.png);"></view>
<view class="content padding-tb-sm"> <view class="content padding-tb-sm">
<view> <view>
<text class="text-xl margin-left-xs">设备1</text> <text class="text-xl margin-left-xs">{{item.deviceNickName}}</text>
</view> </view>
<view class="flex"> <view class="flex">
<text class="flex-sub iconfont icon-wendu text-blue text-xs margin-left-xs">10&#8451;</text> <text class="flex-sub iconfont icon-wendu text-blue text-xs">
<text class="flex-sub iconfont icon-shidu text-blue text-xs ">12%</text> <text class="text-black">{{item.temp}}&#8451;</text>
</text>
<text class="flex-sub iconfont icon-shidu text-blue text-xs ">
<text class="text-black">{{item.rh}}%</text>
</text>
</view> </view>
</view> </view>
<view class="action"> <view class="action">
<view class="text-grey text-xs">2019-08-01 22:20:09</view> <view class="text-grey text-xs">{{item.at}}</view>
</view>
</view> </view>
</view> </view>
<view class="content">
<uni-list v-for="(item,index) in deviceList" :key="index">
<uni-list-item
:title="item.deviceNickName"
:note="item.deviceName"
show-extra-icon
:extra-icon="getExtraIcon(item.deviceStatus)"
@click="handleClickItem(item)"
></uni-list-item>
</uni-list>
</view> </view>
<uni-fab :pattern="pattern" :content="content" horizontal="right" vertical="bottom" direction="vertical" @trigger="trigger"></uni-fab> <uni-fab :pattern="pattern" :content="content" horizontal="right" vertical="bottom" direction="vertical" @trigger="trigger"></uni-fab>
@ -41,27 +31,17 @@
<script> <script>
import refresh from '@/components/refresh/refresh.vue'; import refresh from '@/components/refresh/refresh.vue';
import uniNavBar from '@/components/uni-nav-bar/uni-nav-bar.vue';
import mSearch from '@/components/mehaotian-search/mehaotian-search.vue'; import mSearch from '@/components/mehaotian-search/mehaotian-search.vue';
import navTab from '@/components/wuc-tab/wuc-tab.vue';
import uniList from '@/components/uni-list/uni-list.vue';
import uniListItem from '@/components/uni-list-item/uni-list-item.vue';
import uniFab from '@/components/uni-fab/uni-fab.vue'; import uniFab from '@/components/uni-fab/uni-fab.vue';
import { getDeviceList } from '@/api/device.js'; import { getDeviceList,getDeviceLatestUpMessage } from '@/api/device.js';
export default { export default {
components: { components: {
refresh, refresh,
uniNavBar,
mSearch, mSearch,
navTab,
uniList,
uniListItem,
uniFab uniFab
}, },
data() { data() {
return { return {
tabCur: 0,
tabList: [{ name: '网关' }, { name: '终端' }],
deviceList: [], deviceList: [],
pattern: { pattern: {
color: '#7A7E83', color: '#7A7E83',
@ -70,12 +50,6 @@ export default {
buttonColor:"#007AFF" buttonColor:"#007AFF"
}, },
content: [ content: [
{
iconPath: '/static/gateway.png',
selectedIconPath: '/static/gateway.png',
text: '添加网关',
active: false
},
{ {
iconPath: '/static/dtu.png', iconPath: '/static/dtu.png',
selectedIconPath: '/static/dtu.png', selectedIconPath: '/static/dtu.png',
@ -85,34 +59,28 @@ export default {
] ]
}; };
}, },
onLoad(e){ onLoad(){
if(e.data !== undefined){
this.tabChange(e.data);
}else{
this.fetchDeviceList(); this.fetchDeviceList();
}
}, },
methods: { methods: {
getExtraIcon(active){
let color = '#e6e6e6';
if(active === 1){
color = '#4cd964';
}
return { color: color, size: '22', type: 'circle-filled'}
},
fetchDeviceList(){ fetchDeviceList(){
getDeviceList().then(response => { getDeviceList().then(response => {
this.deviceList = [] this.deviceList = []
if(response.data.list && response.data.list.length > 0){ if(response.data.list && response.data.list.length > 0){
response.data.list.forEach(item => { response.data.list.forEach(item => {
if(this.tabCur === 0 && item.isGateway === 1){ getDeviceLatestUpMessage(item.productId,item.deviceName).then(res =>{
this.deviceList.push(item) if(res.data && res.data.data && res.data.data.app && res.data.data.app.userdata && res.data.data.app.userdata.payload){
}else if(this.tabCur === 1 && item.isGateway === 0){ const userdata = new Buffer(res.data.data.app.userdata.payload, 'base64');
try{
const json = JSON.parse(userdata.toString());
Object.assign(item, json);
item.at = new Date(res.data.timestamp).format('yyyy-MM-dd hh:mm:ss')
this.deviceList.push(item) this.deviceList.push(item)
}catch(e){
}
} }
}) })
})
} }
}) })
}, },
@ -144,10 +112,6 @@ export default {
}) })
this.deviceList = tempList; this.deviceList = tempList;
}, },
tabChange(index) {
this.tabCur = index;
this.fetchDeviceList()
},
handleClickItem(item){ handleClickItem(item){
uni.navigateTo({ uni.navigateTo({
url: `detail/index?productId=${item.productId}&deviceName=${item.deviceName}` url: `detail/index?productId=${item.productId}&deviceName=${item.deviceName}`
@ -156,15 +120,12 @@ export default {
trigger(e) { trigger(e) {
console.log(e); console.log(e);
this.content[e.index].active = !e.item.active; this.content[e.index].active = !e.item.active;
uni.showModal({ uni.scanCode({
title: '提示', onlyFromCamera: true,
content: `${this.content[e.index].active?'选中了':'取消了'}${e.item.text}`,
success: function (res) { success: function (res) {
if (res.confirm) { console.log(res)
console.log('用户点击确定'); console.log('条码类型:' + res.scanType);
} else if (res.cancel) { console.log('条码内容:' + res.result);
console.log('用户点击取消');
}
} }
}); });
} }

35
pages/device/real-data.vue

@ -0,0 +1,35 @@
<template>
<view>
<uni-list v-for="(item,index) in realData" :key="index">
<uni-list-item :show-arrow="false" :title="item.name" :note="item.data"></uni-list-item>
</uni-list>
</view>
</template>
<script>
import uniList from '@/components/uni-list/uni-list.vue'
import uniListItem from '@/components/uni-list-item/uni-list-item.vue'
export default {
components: {
uniList,
uniListItem
},
props:{
msg:{
type: Object,
default: null
}
},
data() {
return {
realData: [{name:'温度',data:'21.1'},{name:'湿度',data:'11.1'},{name:'温度',data:'21.1'}]
}
},
methods: {
}
}
</script>
<style>
</style>

30
pages/home/home.vue

@ -5,16 +5,6 @@
<swiper-item v-for="(item, index) in carouselList" :key="index" class="carousel-item"><image :src="item.src" /></swiper-item> <swiper-item v-for="(item, index) in carouselList" :key="index" class="carousel-item"><image :src="item.src" /></swiper-item>
</swiper> </swiper>
</view> </view>
<view class="cate-section">
<view class="cate-item" hover-class="hover" @tap="tapGateway">
<image src="/static/gateway.png"></image>
<text>网关</text>
</view>
<view class="cate-item" hover-class="hover" @tap="tapDtu">
<image src="/static/dtu.png"></image>
<text>终端</text>
</view>
</view>
<view class="qiun-columns"> <view class="qiun-columns">
<view class="qiun-bg-white qiun-title-bar qiun-common-mt"><view class="qiun-title-dot-light">设备概览</view></view> <view class="qiun-bg-white qiun-title-bar qiun-common-mt"><view class="qiun-title-dot-light">设备概览</view></view>
<view class="qiun-charts"><canvas canvas-id="canvasRing" id="canvasRing" class="charts" @touchstart="touchRing"></canvas></view> <view class="qiun-charts"><canvas canvas-id="canvasRing" id="canvasRing" class="charts" @touchstart="touchRing"></canvas></view>
@ -68,26 +58,6 @@ export default {
this.showRing('canvasRing', this.chartData); this.showRing('canvasRing', this.chartData);
}); });
}, },
tapGateway() {
uni.switchTab({
url: '/pages/device/device',
success: function(e) {
var page = getCurrentPages().pop();
if (page == undefined || page == null) return;
page.onLoad({ data: 0 });
}
});
},
tapDtu() {
uni.switchTab({
url: '/pages/device/device',
success: function(e) {
var page = getCurrentPages().pop();
if (page == undefined || page == null) return;
page.onLoad({ data: 1 });
}
});
},
showRing(canvasId, chartData) { showRing(canvasId, chartData) {
canvaRing = new uCharts({ canvaRing = new uCharts({
$this: _self, $this: _self,

Loading…
Cancel
Save