zmt
4 years ago
14 changed files with 1467 additions and 11 deletions
-
32src/pages.json
-
4src/subpackage/device/pages/audio_manage/audio_manage.vue
-
8src/subpackage/device/pages/index/index.vue
-
292src/subpackage/device/pages/index/lease_ball_box_manage.vue
-
395src/subpackage/device/pages/index/sunblind_manage.vue
-
292src/subpackage/device/pages/monitor_manage/monitor_acount_add.vue
-
245src/subpackage/device/pages/monitor_manage/monitor_acount_list.vue
-
178src/subpackage/device/pages/monitor_manage/monitor_manage.vue
-
32src/subpackage/device/pages/switch_manage/switch_manage.vue
-
BINsrc/subpackage/device/static/images/no-info.png
-
BINsrc/subpackage/device/static/images/sunblind.png
-
BINsrc/subpackage/device/static/images/sunblind_close.png
-
BINsrc/subpackage/device/static/images/sunblind_open.png
-
BINsrc/subpackage/device/static/images/windows.png
@ -0,0 +1,292 @@ |
|||
<template> |
|||
<view class="t-monitor-page"> |
|||
<!-- <store-name></store-name> --> |
|||
<view class="t-title">管理监控平台账户 |
|||
<!-- <view class="t-go-monitor" @click="clickGoMonitorAccount">管理监控平台账户 |
|||
<image src="../../static/images/refresh.png" mode=""></image> |
|||
</view> --> |
|||
</view> |
|||
|
|||
<view class="list-box"> |
|||
<form @submit="formSubmit" @reset="formReset"> |
|||
<view class="f-item"> |
|||
<text>所属平台</text> |
|||
<input name="platform" placeholder="请输入所属平台" placeholder-class="i-class" type="text" value="" /> |
|||
</view> |
|||
<view class="f-item"> |
|||
<text>名称</text> |
|||
<input name="name" placeholder="请输入名称" placeholder-class="i-class" type="text" value="" /> |
|||
</view> |
|||
<view class="f-item"> |
|||
<text>appKey</text> |
|||
<input name="appkey" placeholder="请输入appKey" placeholder-class="i-class" type="text" value="" /> |
|||
</view> |
|||
<view class="f-item"> |
|||
<text>Secret</text> |
|||
<input name="secret" placeholder="请输入Secret" placeholder-class="i-class" type="text" value="" /> |
|||
</view> |
|||
<button class="add-btn" form-type="submit" submit hover-class="btn-active" >保存</button> |
|||
<view class="l-edit"> |
|||
<view class="add-btn white-style">删除</view> |
|||
<view class="add-btn">保存</view> |
|||
</view> |
|||
</form> |
|||
</view> |
|||
|
|||
<view class="info-box"> |
|||
<view class="t1">上述信息，请前往萤石云开放平台注册并以下步骤获取。<text>https://open.ys7.com/</text> <text class="t-copy" |
|||
@click="copyInfo">复制地址</text></view> |
|||
<view class="t2">1、在控制台内-我的账户-应用信息里面创建应用获得appKey和Secret，并填入上方。</view> |
|||
<view class="t3">2、在我的资源-设备列表内添加您的设备（如有可忽略）。</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import util from '../../../../utils/util'; |
|||
import store_name from '../../components/store_name/store_name'; |
|||
import deviceServer from '../../js/device_server'; |
|||
import deviceApi from '../../js/device_api'; |
|||
|
|||
const rootPage = '/subpackage/device' |
|||
|
|||
import { |
|||
mapState |
|||
} from 'vuex' |
|||
export default { |
|||
components: { |
|||
'store-name': store_name |
|||
}, |
|||
computed: { |
|||
...mapState({ |
|||
storeList: state => state.device.storeList, |
|||
curStoreInfo: state => state.device.curStoreInfo, |
|||
}), |
|||
}, |
|||
data() { |
|||
return { |
|||
update_time: new Date(), |
|||
accountList: false |
|||
} |
|||
}, |
|||
async onLoad(opts) { |
|||
console.log("opts:", opts); |
|||
this.mac = opts.mac; |
|||
this.updateList() |
|||
// try { |
|||
// util.showLoad(); |
|||
// let _brandInfo = await this.$store.dispatch('getBrandInfo'); |
|||
// await this.$store.dispatch('getStoreList'); |
|||
// util.hideLoad(); |
|||
// } catch (err) { |
|||
// util.hideLoad(); |
|||
// } |
|||
|
|||
}, |
|||
onShow() { |
|||
// this.updateList() //更新中控信息 |
|||
}, |
|||
watch: { |
|||
// curStoreInfo(newVal, oldVal){ |
|||
// this.infoArr.length = 1 |
|||
// this.updateList() |
|||
// } |
|||
}, |
|||
methods: { |
|||
clickGoMonitorAccount() { |
|||
util.routeTo(`/subpackage/device/pages/monitor_manage/monitor_acount_list`, 'nT'); |
|||
}, |
|||
formSubmit: function(e) { |
|||
console.log('form发生了submit事件，携带数据为：' + JSON.stringify(e.detail.value)) |
|||
var formdata = e.detail.value |
|||
uni.showModal({ |
|||
content: '表单数据内容：' + JSON.stringify(formdata), |
|||
showCancel: false |
|||
}); |
|||
}, |
|||
formReset: function(e) { |
|||
console.log('清空数据') |
|||
}, |
|||
copyInfo() { |
|||
uni.setClipboardData({ |
|||
data: 'https://open.ys7.com/', |
|||
success: function() { |
|||
console.log('success'); |
|||
uni.showToast({ |
|||
title: "复制成功" |
|||
}) |
|||
} |
|||
}); |
|||
}, |
|||
reboot4G() { |
|||
util.showLoad(); |
|||
deviceServer.post({ |
|||
url: deviceApi.reboot4G, |
|||
data: { |
|||
mac: this.mac |
|||
}, |
|||
isDefaultGet: false, |
|||
}) |
|||
.then(res => { |
|||
util.hideLoad(); |
|||
if (res.data.code == 0) { |
|||
util.showNone(res.data.message || '操作成功！'); |
|||
} else { |
|||
util.showNone(res.data.message || '操作失败！'); |
|||
} |
|||
}) |
|||
.catch(err => { |
|||
util.hideLoad() |
|||
}) |
|||
}, |
|||
async updateList() { |
|||
let that = this |
|||
if (!this.mac) return |
|||
util.showLoad(); |
|||
deviceServer.post({ |
|||
url: deviceApi.getLotDetail, |
|||
data: { |
|||
iccid: this.mac, |
|||
is_sync: 1 //是否同步,更新传1 |
|||
}, |
|||
isDefaultGet: false, |
|||
}) |
|||
.then(res => { |
|||
util.hideLoad(); |
|||
if (res.data.code == 0) { |
|||
that.filterRouterData(res.data.data) |
|||
} else { |
|||
util.showNone(res.data.message || '操作失败！'); |
|||
} |
|||
}) |
|||
.catch(err => { |
|||
util.hideLoad() |
|||
}) |
|||
|
|||
}, |
|||
|
|||
goBack() { |
|||
uni.navigateBack({ |
|||
delta: 1 |
|||
}) |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
@import '~style/public.scss'; |
|||
|
|||
.t-monitor-page { |
|||
@include centerFlex(flex-start); |
|||
flex-direction: column; |
|||
|
|||
.t-title { |
|||
font-size: 44rpx; |
|||
color: #1A1A1A; |
|||
font-weight: 900; |
|||
@include centerFlex(space-between); |
|||
margin: 60rpx auto 0rpx 40rpx; |
|||
|
|||
.t-go-monitor { |
|||
padding-right: 48rpx; |
|||
@include centerFlex(center); |
|||
font-size: 32rpx; |
|||
// color: #009874; |
|||
color: #9C9C9F; |
|||
|
|||
image { |
|||
margin-top: 5rpx; |
|||
margin-left: 15rpx; |
|||
width: 32rpx; |
|||
height: 32rpx; |
|||
} |
|||
} |
|||
|
|||
} |
|||
|
|||
.list-box { |
|||
@include centerFlex(flex-start); |
|||
flex-direction: column; |
|||
margin-top: 40rpx; |
|||
font-size: 32rpx; |
|||
color: #9C9C9F; |
|||
>image { |
|||
width: 380rpx; |
|||
height: 380rpx; |
|||
} |
|||
.f-item{ |
|||
margin-top: 20rpx; |
|||
width: 620rpx; |
|||
@include centerFlex(space-between); |
|||
> input{ |
|||
|
|||
width: 434rpx;height: 96rpx; |
|||
padding: 0 15rpx; |
|||
border: 1rpx solid #9C9C9F; |
|||
border-radius: 10rpx; |
|||
} |
|||
.i-class{ |
|||
color: #9C9C9F;font-size: 32rpx; |
|||
} |
|||
} |
|||
.l-edit{ |
|||
@include centerFlex(space-between); |
|||
> view{ |
|||
width: 224rpx;height: 112rpx; |
|||
} |
|||
.white-style{ |
|||
color: #EA5061; |
|||
background-color: white; |
|||
} |
|||
} |
|||
|
|||
|
|||
} |
|||
|
|||
.t-update { |
|||
font-size: 28rpx; |
|||
color: #9C9C9F; |
|||
margin-top: 38rpx; |
|||
margin-left: 40rpx; |
|||
} |
|||
|
|||
.add-btn { |
|||
margin-top: 80rpx; |
|||
width: 500rpx; |
|||
height: 112rpx; |
|||
background: #009874; |
|||
color: white; |
|||
font-size: 32rpx; |
|||
border-radius: 10rpx; |
|||
@include centerFlex(center); |
|||
} |
|||
|
|||
.btn-active { |
|||
background: rgba($color: #000000, $alpha: .3); |
|||
} |
|||
|
|||
.info-box { |
|||
margin-top: 114rpx; |
|||
width: 636rpx; |
|||
font-size: 28rpx; |
|||
color: #9C9C9F; |
|||
|
|||
.t1 { |
|||
>text { |
|||
color: black; |
|||
} |
|||
|
|||
.t-copy { |
|||
color: #009874; |
|||
margin-left: 30rpx; |
|||
} |
|||
} |
|||
|
|||
.t2 { |
|||
margin-top: 60rpx; |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,395 @@ |
|||
<template> |
|||
<view class="t-monitor-page"> |
|||
<!-- <store-name></store-name> --> |
|||
<view class="t-title" @tap="tap">1号窗帘 |
|||
<!-- <view class="t-go-monitor" @click="clickGoMonitorAccount">管理平台账户 |
|||
<image src="../../static/images/refresh.png" mode=""></image> |
|||
</view> --> |
|||
</view> |
|||
|
|||
<view class="image-box"> |
|||
<image src="../../static/images/windows.png" mode=""></image> |
|||
<!-- 窗帘从左到右开关 --> |
|||
<!-- <view class="box-one"> |
|||
<view class="slice-box" > |
|||
<view class="slice-item" v-for="i in sliceLength"></view> |
|||
</view> |
|||
</view> --> |
|||
<!-- 窗帘从两边到中间开关 --> |
|||
<view class="box-two"> |
|||
<view class="slice-box-left" > |
|||
<view class="slice-item" v-for="i in sliceLength"></view> |
|||
</view> |
|||
<view class="slice-box-right" > |
|||
<view class="slice-item" v-for="i in sliceLength"></view> |
|||
</view> |
|||
</view> |
|||
<!-- 触摸窗帘开关 --> |
|||
<!-- <movable-area class="box"> |
|||
<movable-view class="max" :x="x" :y="y" @change="onChange" |
|||
direction="horizontal" inertia> |
|||
</movable-view> |
|||
</movable-area> --> |
|||
</view> |
|||
|
|||
<view class="slider-box"> |
|||
<text>目前状态{{voiceLevel}}%</text> |
|||
<slider :value="voiceLevel" activeColor="#009874" block-color="#009874" block-size="22" |
|||
@change="sliderChange" min="0" max="100" /> |
|||
<view class=""> |
|||
<text>0%</text> |
|||
<text>100%</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="list-box"> |
|||
<view class="l-item"> |
|||
<image src="../../static/images/sunblind_close.png" mode=""></image> |
|||
<text>关闭</text> |
|||
</view> |
|||
<view class="l-item"> |
|||
<image src="../../static/images/close.png" mode=""></image> |
|||
<text>暂停</text> |
|||
</view> |
|||
<view class="l-item"> |
|||
<image src="../../static/images/sunblind_open.png" mode=""></image> |
|||
<text>开启</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<!-- <view class="info-box"> |
|||
<view class="t1">上述信息，请前往萤石云开放平台注册并以下步骤获取。<text>https://open.ys7.com/</text> <text class="t-copy" |
|||
@click="copyInfo">复制地址</text></view> |
|||
<view class="t2">1、在控制台内-我的账户-应用信息里面创建应用获得appKey和Secret，并填入上方。</view> |
|||
<view class="t3">2、在我的资源-设备列表内添加您的设备（如有可忽略）。</view> |
|||
</view> --> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import util from '../../../../utils/util'; |
|||
import store_name from '../../components/store_name/store_name'; |
|||
import deviceServer from '../../js/device_server'; |
|||
import deviceApi from '../../js/device_api'; |
|||
|
|||
const rootPage = '/subpackage/device' |
|||
|
|||
import { |
|||
mapState |
|||
} from 'vuex' |
|||
export default { |
|||
components: { |
|||
'store-name': store_name |
|||
}, |
|||
computed: { |
|||
...mapState({ |
|||
storeList: state => state.device.storeList, |
|||
curStoreInfo: state => state.device.curStoreInfo, |
|||
}), |
|||
}, |
|||
data() { |
|||
return { |
|||
update_time: new Date(), |
|||
accountList: false, |
|||
voiceLevel:10,//测试回显给10 |
|||
sliceLength:0, |
|||
boxOne:false, //窗帘关闭方式 true: 从左到右, false:从两边到中间 |
|||
} |
|||
}, |
|||
async onLoad(opts) { |
|||
console.log("opts:", opts); |
|||
this.mac = opts.mac; |
|||
this.updateList() |
|||
this.setSliceLength(this.voiceLevel) |
|||
// try { |
|||
// util.showLoad(); |
|||
// let _brandInfo = await this.$store.dispatch('getBrandInfo'); |
|||
// await this.$store.dispatch('getStoreList'); |
|||
// util.hideLoad(); |
|||
// } catch (err) { |
|||
// util.hideLoad(); |
|||
// } |
|||
|
|||
}, |
|||
onShow() { |
|||
// this.updateList() //更新中控信息 |
|||
const sysInfo = uni.getSystemInfoSync(); |
|||
this.pixelRatio = sysInfo.pixelRatio |
|||
console.log(sysInfo.pixelRatio); |
|||
}, |
|||
watch: { |
|||
// curStoreInfo(newVal, oldVal){ |
|||
// this.infoArr.length = 1 |
|||
// this.updateList() |
|||
// } |
|||
}, |
|||
methods: { |
|||
//滑动更改窗帘状态 |
|||
sliderChange(e) { |
|||
console.log('value 发生变化：' + e.detail.value) |
|||
this.setSliceLength(e.detail.value) |
|||
// this.sliceBoxW = this.sliceLength*30 |
|||
return |
|||
let _data = { |
|||
"device": this.curStoreInfo.device_name, |
|||
"data": { |
|||
"name": "audio-player-volume", |
|||
"value": { |
|||
"volume": e.detail.value.toString() |
|||
} |
|||
}, |
|||
} |
|||
//发送命令到中控 |
|||
this.operateReq({ |
|||
data: _data, |
|||
isTip: true |
|||
}) |
|||
}, |
|||
setSliceLength(value){ |
|||
// this.level = value |
|||
this.voiceLevel = value |
|||
this.sliceLength = Math.floor(value/(this.boxOne?5:10)) |
|||
}, |
|||
clickGoMonitorAccount() { |
|||
util.routeTo(`/subpackage/device/pages/monitor_manage/monitor_acount_list`, 'nT'); |
|||
}, |
|||
formSubmit: function(e) { |
|||
console.log('form发生了submit事件，携带数据为：' + JSON.stringify(e.detail.value)) |
|||
var formdata = e.detail.value |
|||
uni.showModal({ |
|||
content: '表单数据内容：' + JSON.stringify(formdata), |
|||
showCancel: false |
|||
}); |
|||
}, |
|||
formReset: function(e) { |
|||
console.log('清空数据') |
|||
}, |
|||
copyInfo() { |
|||
uni.setClipboardData({ |
|||
data: 'https://open.ys7.com/', |
|||
success: function() { |
|||
console.log('success'); |
|||
uni.showToast({ |
|||
title: "复制成功" |
|||
}) |
|||
} |
|||
}); |
|||
}, |
|||
reboot4G() { |
|||
util.showLoad(); |
|||
deviceServer.post({ |
|||
url: deviceApi.reboot4G, |
|||
data: { |
|||
mac: this.mac |
|||
}, |
|||
isDefaultGet: false, |
|||
}) |
|||
.then(res => { |
|||
util.hideLoad(); |
|||
if (res.data.code == 0) { |
|||
util.showNone(res.data.message || '操作成功！'); |
|||
} else { |
|||
util.showNone(res.data.message || '操作失败！'); |
|||
} |
|||
}) |
|||
.catch(err => { |
|||
util.hideLoad() |
|||
}) |
|||
}, |
|||
async updateList() { |
|||
let that = this |
|||
if (!this.mac) return |
|||
util.showLoad(); |
|||
deviceServer.post({ |
|||
url: deviceApi.getLotDetail, |
|||
data: { |
|||
iccid: this.mac, |
|||
is_sync: 1 //是否同步,更新传1 |
|||
}, |
|||
isDefaultGet: false, |
|||
}) |
|||
.then(res => { |
|||
util.hideLoad(); |
|||
if (res.data.code == 0) { |
|||
that.filterRouterData(res.data.data) |
|||
} else { |
|||
util.showNone(res.data.message || '操作失败！'); |
|||
} |
|||
}) |
|||
.catch(err => { |
|||
util.hideLoad() |
|||
}) |
|||
|
|||
}, |
|||
|
|||
goBack() { |
|||
uni.navigateBack({ |
|||
delta: 1 |
|||
}) |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
@import '~style/public.scss'; |
|||
|
|||
.slider-box { |
|||
// @include centerFlex(center); |
|||
// flex-direction: column; |
|||
width: 630rpx; |
|||
margin-top: 40rpx; |
|||
>text { |
|||
font-size: 32rpx; |
|||
color: #1A1A1A; |
|||
width: 100%; |
|||
@include centerFlex(center); |
|||
} |
|||
|
|||
>view { |
|||
width: 100%; |
|||
color: #9C9C9F; |
|||
font-size: 28rpx; |
|||
@include centerFlex(space-between); |
|||
padding: 0 34rpx; |
|||
} |
|||
} |
|||
|
|||
.t-monitor-page { |
|||
@include centerFlex(flex-start); |
|||
flex-direction: column; |
|||
|
|||
.t-title { |
|||
font-size: 44rpx; |
|||
color: #1A1A1A; |
|||
font-weight: 900; |
|||
@include centerFlex(space-between); |
|||
margin: 60rpx auto 0rpx 40rpx; |
|||
.t-go-monitor { |
|||
padding-right: 48rpx; |
|||
@include centerFlex(center); |
|||
font-size: 32rpx; |
|||
color: #9C9C9F; |
|||
image { |
|||
margin-top: 5rpx; |
|||
margin-left: 15rpx; |
|||
width: 32rpx; |
|||
height: 32rpx; |
|||
} |
|||
} |
|||
|
|||
} |
|||
|
|||
.image-box { |
|||
margin-top: 40rpx; |
|||
|
|||
image { |
|||
width: 690rpx; |
|||
height: 570rpx; |
|||
position: absolute; |
|||
left: 30rpx; |
|||
z-index: -1; |
|||
} |
|||
|
|||
.box-one { |
|||
width: 590rpx; |
|||
height: 570rpx; |
|||
margin-top: 10rpx; |
|||
z-index: 1; |
|||
@include centerFlex(flex-start); |
|||
.slice-box{ |
|||
@include centerFlex(flex-start); |
|||
background-color: lightgray; |
|||
height: 570rpx; |
|||
} |
|||
|
|||
} |
|||
.box-two{ |
|||
width: 560rpx; |
|||
height: 570rpx; |
|||
margin-top: 10rpx; |
|||
z-index: 1; |
|||
@include centerFlex(space-between); |
|||
.slice-box-left{ |
|||
@include centerFlex(flex-start); |
|||
background-color: lightgray; |
|||
height: 570rpx; |
|||
} |
|||
.slice-box-right{ |
|||
@include centerFlex(flex-end); |
|||
background-color: lightgray; |
|||
height: 570rpx; |
|||
|
|||
} |
|||
} |
|||
//窗帘切片 |
|||
.slice-item{ |
|||
flex-grow: 1; |
|||
width: 30rpx; |
|||
height: 570rpx; |
|||
background-color: white; |
|||
border: 1rpx solid #919191; |
|||
border-radius: 5rpx; |
|||
} |
|||
} |
|||
|
|||
.list-box { |
|||
width: 540rpx; |
|||
@include centerFlex(space-between); |
|||
margin-top: 40rpx; |
|||
font-size: 32rpx; |
|||
color: #9C9C9F; |
|||
|
|||
>view { |
|||
@include centerFlex(center); |
|||
flex-direction: column; |
|||
|
|||
>image { |
|||
width: 100rpx; |
|||
height: 100rpx; |
|||
} |
|||
|
|||
>text { |
|||
margin-top: 20rpx; |
|||
font-size: 24rpx; |
|||
color: #9A9A9D; |
|||
} |
|||
} |
|||
|
|||
} |
|||
|
|||
.add-btn { |
|||
margin-top: 80rpx; |
|||
width: 500rpx; |
|||
height: 112rpx; |
|||
background: #009874; |
|||
color: white; |
|||
font-size: 32rpx; |
|||
border-radius: 10rpx; |
|||
@include centerFlex(center); |
|||
} |
|||
|
|||
.btn-active { |
|||
background: rgba($color: #000000, $alpha: .3); |
|||
} |
|||
.info-box { |
|||
margin-top: 114rpx; |
|||
width: 636rpx; |
|||
font-size: 28rpx; |
|||
color: #9C9C9F; |
|||
.t1 { |
|||
>text { |
|||
color: black; |
|||
} |
|||
.t-copy { |
|||
color: #009874; |
|||
margin-left: 30rpx; |
|||
} |
|||
} |
|||
.t2 { |
|||
margin-top: 60rpx; |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,292 @@ |
|||
<template> |
|||
<view class="t-monitor-page"> |
|||
<!-- <store-name></store-name> --> |
|||
<view class="t-title">管理监控平台账户 |
|||
<!-- <view class="t-go-monitor" @click="clickGoMonitorAccount">管理监控平台账户 |
|||
<image src="../../static/images/refresh.png" mode=""></image> |
|||
</view> --> |
|||
</view> |
|||
|
|||
<view class="list-box"> |
|||
<form @submit="formSubmit" @reset="formReset"> |
|||
<view class="f-item"> |
|||
<text>所属平台</text> |
|||
<input name="platform" placeholder="请输入所属平台" placeholder-class="i-class" type="text" value="" /> |
|||
</view> |
|||
<view class="f-item"> |
|||
<text>名称</text> |
|||
<input name="name" placeholder="请输入名称" placeholder-class="i-class" type="text" value="" /> |
|||
</view> |
|||
<view class="f-item"> |
|||
<text>appKey</text> |
|||
<input name="appkey" placeholder="请输入appKey" placeholder-class="i-class" type="text" value="" /> |
|||
</view> |
|||
<view class="f-item"> |
|||
<text>Secret</text> |
|||
<input name="secret" placeholder="请输入Secret" placeholder-class="i-class" type="text" value="" /> |
|||
</view> |
|||
<button class="add-btn" form-type="submit" submit hover-class="btn-active" >保存</button> |
|||
<view class="l-edit"> |
|||
<view class="add-btn white-style">删除</view> |
|||
<view class="add-btn">保存</view> |
|||
</view> |
|||
</form> |
|||
</view> |
|||
|
|||
<view class="info-box"> |
|||
<view class="t1">上述信息，请前往萤石云开放平台注册并以下步骤获取。<text>https://open.ys7.com/</text> <text class="t-copy" |
|||
@click="copyInfo">复制地址</text></view> |
|||
<view class="t2">1、在控制台内-我的账户-应用信息里面创建应用获得appKey和Secret，并填入上方。</view> |
|||
<view class="t3">2、在我的资源-设备列表内添加您的设备（如有可忽略）。</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import util from '../../../../utils/util'; |
|||
import store_name from '../../components/store_name/store_name'; |
|||
import deviceServer from '../../js/device_server'; |
|||
import deviceApi from '../../js/device_api'; |
|||
|
|||
const rootPage = '/subpackage/device' |
|||
|
|||
import { |
|||
mapState |
|||
} from 'vuex' |
|||
export default { |
|||
components: { |
|||
'store-name': store_name |
|||
}, |
|||
computed: { |
|||
...mapState({ |
|||
storeList: state => state.device.storeList, |
|||
curStoreInfo: state => state.device.curStoreInfo, |
|||
}), |
|||
}, |
|||
data() { |
|||
return { |
|||
update_time: new Date(), |
|||
accountList: false |
|||
} |
|||
}, |
|||
async onLoad(opts) { |
|||
console.log("opts:", opts); |
|||
this.mac = opts.mac; |
|||
this.updateList() |
|||
// try { |
|||
// util.showLoad(); |
|||
// let _brandInfo = await this.$store.dispatch('getBrandInfo'); |
|||
// await this.$store.dispatch('getStoreList'); |
|||
// util.hideLoad(); |
|||
// } catch (err) { |
|||
// util.hideLoad(); |
|||
// } |
|||
|
|||
}, |
|||
onShow() { |
|||
// this.updateList() //更新中控信息 |
|||
}, |
|||
watch: { |
|||
// curStoreInfo(newVal, oldVal){ |
|||
// this.infoArr.length = 1 |
|||
// this.updateList() |
|||
// } |
|||
}, |
|||
methods: { |
|||
clickGoMonitorAccount() { |
|||
util.routeTo(`/subpackage/device/pages/monitor_manage/monitor_acount_list`, 'nT'); |
|||
}, |
|||
formSubmit: function(e) { |
|||
console.log('form发生了submit事件，携带数据为：' + JSON.stringify(e.detail.value)) |
|||
var formdata = e.detail.value |
|||
uni.showModal({ |
|||
content: '表单数据内容：' + JSON.stringify(formdata), |
|||
showCancel: false |
|||
}); |
|||
}, |
|||
formReset: function(e) { |
|||
console.log('清空数据') |
|||
}, |
|||
copyInfo() { |
|||
uni.setClipboardData({ |
|||
data: 'https://open.ys7.com/', |
|||
success: function() { |
|||
console.log('success'); |
|||
uni.showToast({ |
|||
title: "复制成功" |
|||
}) |
|||
} |
|||
}); |
|||
}, |
|||
reboot4G() { |
|||
util.showLoad(); |
|||
deviceServer.post({ |
|||
url: deviceApi.reboot4G, |
|||
data: { |
|||
mac: this.mac |
|||
}, |
|||
isDefaultGet: false, |
|||
}) |
|||
.then(res => { |
|||
util.hideLoad(); |
|||
if (res.data.code == 0) { |
|||
util.showNone(res.data.message || '操作成功！'); |
|||
} else { |
|||
util.showNone(res.data.message || '操作失败！'); |
|||
} |
|||
}) |
|||
.catch(err => { |
|||
util.hideLoad() |
|||
}) |
|||
}, |
|||
async updateList() { |
|||
let that = this |
|||
if (!this.mac) return |
|||
util.showLoad(); |
|||
deviceServer.post({ |
|||
url: deviceApi.getLotDetail, |
|||
data: { |
|||
iccid: this.mac, |
|||
is_sync: 1 //是否同步,更新传1 |
|||
}, |
|||
isDefaultGet: false, |
|||
}) |
|||
.then(res => { |
|||
util.hideLoad(); |
|||
if (res.data.code == 0) { |
|||
that.filterRouterData(res.data.data) |
|||
} else { |
|||
util.showNone(res.data.message || '操作失败！'); |
|||
} |
|||
}) |
|||
.catch(err => { |
|||
util.hideLoad() |
|||
}) |
|||
|
|||
}, |
|||
|
|||
goBack() { |
|||
uni.navigateBack({ |
|||
delta: 1 |
|||
}) |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
@import '~style/public.scss'; |
|||
|
|||
.t-monitor-page { |
|||
@include centerFlex(flex-start); |
|||
flex-direction: column; |
|||
|
|||
.t-title { |
|||
font-size: 44rpx; |
|||
color: #1A1A1A; |
|||
font-weight: 900; |
|||
@include centerFlex(space-between); |
|||
margin: 60rpx auto 0rpx 40rpx; |
|||
|
|||
.t-go-monitor { |
|||
padding-right: 48rpx; |
|||
@include centerFlex(center); |
|||
font-size: 32rpx; |
|||
// color: #009874; |
|||
color: #9C9C9F; |
|||
|
|||
image { |
|||
margin-top: 5rpx; |
|||
margin-left: 15rpx; |
|||
width: 32rpx; |
|||
height: 32rpx; |
|||
} |
|||
} |
|||
|
|||
} |
|||
|
|||
.list-box { |
|||
@include centerFlex(flex-start); |
|||
flex-direction: column; |
|||
margin-top: 40rpx; |
|||
font-size: 32rpx; |
|||
color: #9C9C9F; |
|||
>image { |
|||
width: 380rpx; |
|||
height: 380rpx; |
|||
} |
|||
.f-item{ |
|||
margin-top: 20rpx; |
|||
width: 620rpx; |
|||
@include centerFlex(space-between); |
|||
> input{ |
|||
|
|||
width: 434rpx;height: 96rpx; |
|||
padding: 0 15rpx; |
|||
border: 1rpx solid #9C9C9F; |
|||
border-radius: 10rpx; |
|||
} |
|||
.i-class{ |
|||
color: #9C9C9F;font-size: 32rpx; |
|||
} |
|||
} |
|||
.l-edit{ |
|||
@include centerFlex(space-between); |
|||
> view{ |
|||
width: 224rpx;height: 112rpx; |
|||
} |
|||
.white-style{ |
|||
color: #EA5061; |
|||
background-color: white; |
|||
} |
|||
} |
|||
|
|||
|
|||
} |
|||
|
|||
.t-update { |
|||
font-size: 28rpx; |
|||
color: #9C9C9F; |
|||
margin-top: 38rpx; |
|||
margin-left: 40rpx; |
|||
} |
|||
|
|||
.add-btn { |
|||
margin-top: 80rpx; |
|||
width: 500rpx; |
|||
height: 112rpx; |
|||
background: #009874; |
|||
color: white; |
|||
font-size: 32rpx; |
|||
border-radius: 10rpx; |
|||
@include centerFlex(center); |
|||
} |
|||
|
|||
.btn-active { |
|||
background: rgba($color: #000000, $alpha: .3); |
|||
} |
|||
|
|||
.info-box { |
|||
margin-top: 114rpx; |
|||
width: 636rpx; |
|||
font-size: 28rpx; |
|||
color: #9C9C9F; |
|||
|
|||
.t1 { |
|||
>text { |
|||
color: black; |
|||
} |
|||
|
|||
.t-copy { |
|||
color: #009874; |
|||
margin-left: 30rpx; |
|||
} |
|||
} |
|||
|
|||
.t2 { |
|||
margin-top: 60rpx; |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,245 @@ |
|||
<template> |
|||
<view class="t-monitor-page"> |
|||
<!-- <store-name></store-name> --> |
|||
<view class="t-title">管理监控平台账户 |
|||
<!-- <view class="t-go-monitor" @click="clickGoMonitorAccount">管理监控平台账户 |
|||
<image src="../../static/images/refresh.png" mode=""></image> |
|||
</view> --> |
|||
</view> |
|||
|
|||
<view class="list-box"> |
|||
<image src="../../static/images/no-info.png" mode="" v-if="!accountList"></image> |
|||
<view class="l-item" v-for=" i in 2" v-else> |
|||
<image src="" mode=""></image> |
|||
<text>店铺名称name</text> |
|||
<view class="opt-box"> |
|||
<view class="o-item"> |
|||
<text @click="addAccount">编辑</text><image src="../../static/images/order/tab_0_8.png" mode=""></image> |
|||
</view> |
|||
<view class="o-item"> |
|||
<text>同步设备</text><image src="../../static/images/order/tab_0_8.png" mode=""></image> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="add-btn" hover-class="btn-active" @click="accountList = !accountList">添加账户</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import util from '../../../../utils/util'; |
|||
import store_name from '../../components/store_name/store_name'; |
|||
import deviceServer from '../../js/device_server'; |
|||
import deviceApi from '../../js/device_api'; |
|||
|
|||
const rootPage = '/subpackage/device' |
|||
|
|||
import { |
|||
mapState |
|||
} from 'vuex' |
|||
export default { |
|||
components: { |
|||
'store-name': store_name |
|||
}, |
|||
computed: { |
|||
...mapState({ |
|||
storeList: state => state.device.storeList, |
|||
curStoreInfo: state => state.device.curStoreInfo, |
|||
}), |
|||
}, |
|||
data() { |
|||
return { |
|||
update_time: new Date(), |
|||
accountList:false |
|||
} |
|||
}, |
|||
async onLoad(opts) { |
|||
console.log("opts:", opts); |
|||
this.mac = opts.mac; |
|||
this.updateList() |
|||
// try { |
|||
// util.showLoad(); |
|||
// let _brandInfo = await this.$store.dispatch('getBrandInfo'); |
|||
// await this.$store.dispatch('getStoreList'); |
|||
// util.hideLoad(); |
|||
// } catch (err) { |
|||
// util.hideLoad(); |
|||
// } |
|||
|
|||
}, |
|||
onShow() { |
|||
// this.updateList() //更新中控信息 |
|||
}, |
|||
watch: { |
|||
// curStoreInfo(newVal, oldVal){ |
|||
// this.infoArr.length = 1 |
|||
// this.updateList() |
|||
// } |
|||
}, |
|||
methods: { |
|||
clickGoMonitorAccount() { |
|||
util.routeTo(`/subpackage/device/pages/monitor_manage/monitor_acount_list`, 'nT'); |
|||
}, |
|||
statechange(e) { |
|||
console.log('live-player code:', e.detail.code) |
|||
}, |
|||
error(e) { |
|||
console.error('live-player error:', e.detail.errMsg) |
|||
}, |
|||
addAccount(){ |
|||
util.routeTo(`/subpackage/device/pages/monitor_manage/monitor_acount_add`,'nT') |
|||
}, |
|||
reboot4G() { |
|||
util.showLoad(); |
|||
deviceServer.post({ |
|||
url: deviceApi.reboot4G, |
|||
data: { |
|||
mac: this.mac |
|||
}, |
|||
isDefaultGet: false, |
|||
}) |
|||
.then(res => { |
|||
util.hideLoad(); |
|||
if (res.data.code == 0) { |
|||
util.showNone(res.data.message || '操作成功！'); |
|||
} else { |
|||
util.showNone(res.data.message || '操作失败！'); |
|||
} |
|||
}) |
|||
.catch(err => { |
|||
util.hideLoad() |
|||
}) |
|||
}, |
|||
async updateList() { |
|||
let that = this |
|||
if (!this.mac) return |
|||
util.showLoad(); |
|||
deviceServer.post({ |
|||
url: deviceApi.getLotDetail, |
|||
data: { |
|||
iccid: this.mac, |
|||
is_sync: 1 //是否同步,更新传1 |
|||
}, |
|||
isDefaultGet: false, |
|||
}) |
|||
.then(res => { |
|||
util.hideLoad(); |
|||
if (res.data.code == 0) { |
|||
that.filterRouterData(res.data.data) |
|||
} else { |
|||
util.showNone(res.data.message || '操作失败！'); |
|||
} |
|||
}) |
|||
.catch(err => { |
|||
util.hideLoad() |
|||
}) |
|||
|
|||
}, |
|||
|
|||
goBack() { |
|||
uni.navigateBack({ |
|||
delta: 1 |
|||
}) |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
@import '~style/public.scss'; |
|||
|
|||
.t-monitor-page { |
|||
@include centerFlex(flex-start); |
|||
flex-direction: column; |
|||
.t-title { |
|||
font-size: 44rpx; |
|||
color: #1A1A1A; |
|||
font-weight: 900; |
|||
@include centerFlex(space-between); |
|||
margin: 60rpx auto 0rpx 40rpx; |
|||
|
|||
.t-go-monitor { |
|||
padding-right: 48rpx; |
|||
@include centerFlex(center); |
|||
font-size: 32rpx; |
|||
// color: #009874; |
|||
color: #9C9C9F; |
|||
|
|||
image { |
|||
margin-top: 5rpx; |
|||
margin-left: 15rpx; |
|||
width: 32rpx; |
|||
height: 32rpx; |
|||
} |
|||
} |
|||
|
|||
} |
|||
.list-box{ |
|||
@include centerFlex(flex-start); |
|||
flex-direction: column; |
|||
margin-top: 40rpx; |
|||
> image{ |
|||
width: 380rpx; |
|||
height: 380rpx; |
|||
} |
|||
.l-item{ |
|||
margin-bottom: 30rpx; |
|||
padding: 20rpx; |
|||
background: white; |
|||
border-radius: 10rpx; |
|||
width: 670rpx;height: 170rpx; |
|||
font-size: 32rpx; |
|||
color: #333333; |
|||
@include centerFlex(flex-start); |
|||
> image{ |
|||
width: 108rpx;height: 108rpx; |
|||
background-color: lightgray; |
|||
margin-right: 20rpx; |
|||
} |
|||
.opt-box{ |
|||
position: absolute; |
|||
right: 65rpx; |
|||
.o-item{ |
|||
height: 60rpx; |
|||
@include centerFlex(flex-end); |
|||
> text{ |
|||
font-size: 28rpx; |
|||
color: #9C9C9F; |
|||
} |
|||
> image{ |
|||
width: 36rpx;height: 36rpx; |
|||
margin-left: 10rpx; |
|||
background-color: lightgray; |
|||
} |
|||
} |
|||
} |
|||
|
|||
} |
|||
|
|||
|
|||
} |
|||
.t-update { |
|||
font-size: 28rpx; |
|||
color: #9C9C9F; |
|||
margin-top: 38rpx; |
|||
margin-left: 40rpx; |
|||
} |
|||
|
|||
.add-btn{ |
|||
margin-top: 80rpx; |
|||
width: 670rpx; |
|||
height: 112rpx; |
|||
background: #009874; |
|||
color: white; |
|||
font-size: 32rpx; |
|||
border-radius: 10rpx; |
|||
@include centerFlex(center); |
|||
} |
|||
.btn-active{ |
|||
background:rgba($color: #000000, $alpha: .3); |
|||
} |
|||
|
|||
} |
|||
</style> |
|||
@ -0,0 +1,178 @@ |
|||
<template> |
|||
<view class="t-monitor-page"> |
|||
<!-- <store-name></store-name> --> |
|||
<view class="t-title">监控管理 |
|||
<view class="t-go-monitor" @click="clickGoMonitorAccount">管理监控平台账户 |
|||
<!-- <image src="../../static/images/refresh.png" mode=""></image> --> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="live-box"> |
|||
<live-player src="https://domain/pull_stream" autoplay @statechange="statechange" @error="error" |
|||
style="width: 300px; height: 225px;" /> |
|||
</view> |
|||
<!-- <view class="t-update"> |
|||
更新时间: {{update_time}} |
|||
</view> |
|||
--> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import util from '../../../../utils/util'; |
|||
import store_name from '../../components/store_name/store_name'; |
|||
import deviceServer from '../../js/device_server'; |
|||
import deviceApi from '../../js/device_api'; |
|||
|
|||
const rootPage = '/subpackage/device' |
|||
|
|||
import { |
|||
mapState |
|||
} from 'vuex' |
|||
export default { |
|||
components: { |
|||
'store-name': store_name |
|||
}, |
|||
computed: { |
|||
...mapState({ |
|||
storeList: state => state.device.storeList, |
|||
curStoreInfo: state => state.device.curStoreInfo, |
|||
}), |
|||
}, |
|||
data() { |
|||
return { |
|||
update_time: new Date(), |
|||
} |
|||
}, |
|||
async onLoad(opts) { |
|||
console.log("opts:", opts); |
|||
this.mac = opts.mac; |
|||
this.updateList() |
|||
// try { |
|||
// util.showLoad(); |
|||
// let _brandInfo = await this.$store.dispatch('getBrandInfo'); |
|||
// await this.$store.dispatch('getStoreList'); |
|||
// util.hideLoad(); |
|||
// } catch (err) { |
|||
// util.hideLoad(); |
|||
// } |
|||
|
|||
}, |
|||
onShow() { |
|||
// this.updateList() //更新中控信息 |
|||
}, |
|||
watch: { |
|||
// curStoreInfo(newVal, oldVal){ |
|||
// this.infoArr.length = 1 |
|||
// this.updateList() |
|||
// } |
|||
}, |
|||
methods: { |
|||
clickGoMonitorAccount() { |
|||
util.routeTo(`/subpackage/device/pages/monitor_manage/monitor_acount_list`, 'nT'); |
|||
}, |
|||
statechange(e) { |
|||
console.log('live-player code:', e.detail.code) |
|||
}, |
|||
error(e) { |
|||
console.error('live-player error:', e.detail.errMsg) |
|||
}, |
|||
reboot4G() { |
|||
util.showLoad(); |
|||
deviceServer.post({ |
|||
url: deviceApi.reboot4G, |
|||
data: { |
|||
mac: this.mac |
|||
}, |
|||
isDefaultGet: false, |
|||
}) |
|||
.then(res => { |
|||
util.hideLoad(); |
|||
if (res.data.code == 0) { |
|||
util.showNone(res.data.message || '操作成功！'); |
|||
} else { |
|||
util.showNone(res.data.message || '操作失败！'); |
|||
} |
|||
}) |
|||
.catch(err => { |
|||
util.hideLoad() |
|||
}) |
|||
}, |
|||
async updateList() { |
|||
let that = this |
|||
if (!this.mac) return |
|||
util.showLoad(); |
|||
deviceServer.post({ |
|||
url: deviceApi.getLotDetail, |
|||
data: { |
|||
iccid: this.mac, |
|||
is_sync: 1 //是否同步,更新传1 |
|||
}, |
|||
isDefaultGet: false, |
|||
}) |
|||
.then(res => { |
|||
util.hideLoad(); |
|||
if (res.data.code == 0) { |
|||
that.filterRouterData(res.data.data) |
|||
} else { |
|||
util.showNone(res.data.message || '操作失败！'); |
|||
} |
|||
}) |
|||
.catch(err => { |
|||
util.hideLoad() |
|||
}) |
|||
|
|||
}, |
|||
|
|||
goBack() { |
|||
uni.navigateBack({ |
|||
delta: 1 |
|||
}) |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
@import '~style/public.scss'; |
|||
|
|||
.t-monitor-page { |
|||
|
|||
.t-title { |
|||
font-size: 44rpx; |
|||
color: #1A1A1A; |
|||
font-weight: 900; |
|||
@include centerFlex(space-between); |
|||
margin: 60rpx auto 0rpx 40rpx; |
|||
|
|||
.t-go-monitor { |
|||
padding-right: 48rpx; |
|||
@include centerFlex(center); |
|||
font-size: 32rpx; |
|||
// color: #009874; |
|||
color: #9C9C9F; |
|||
|
|||
image { |
|||
margin-top: 5rpx; |
|||
margin-left: 15rpx; |
|||
width: 32rpx; |
|||
height: 32rpx; |
|||
} |
|||
} |
|||
|
|||
} |
|||
.live-box{ |
|||
@include centerFlex(center); |
|||
margin-top: 40rpx; |
|||
} |
|||
.t-update { |
|||
font-size: 28rpx; |
|||
color: #9C9C9F; |
|||
margin-top: 38rpx; |
|||
margin-left: 40rpx; |
|||
} |
|||
|
|||
} |
|||
</style> |
|||
|
After Width: 380 | Height: 380 | Size: 55 KiB |
|
After Width: 676 | Height: 570 | Size: 26 KiB |
|
After Width: 100 | Height: 100 | Size: 5.1 KiB |
|
After Width: 100 | Height: 100 | Size: 5.2 KiB |
|
After Width: 1014 | Height: 696 | Size: 39 KiB |
Write
Preview
Loading…
Cancel
Save
Reference in new issue