38 changed files with 4911 additions and 57 deletions
-
71src/pages.json
-
23src/pages/write_off/search_result/search_result.vue
-
29src/subpackage/device/components/store_name/store_name.vue
-
13src/subpackage/device/js/device_api.js
-
172src/subpackage/device/js/ouxuanac.md
-
967src/subpackage/device/pages/audio_manage/audio_manage.vue
-
8src/subpackage/device/pages/index/airC_manage.vue
-
155src/subpackage/device/pages/index/index.vue
-
292src/subpackage/device/pages/index/lease_ball_box_manage.vue
-
470src/subpackage/device/pages/index/lot_manage.vue
-
427src/subpackage/device/pages/index/router_manage.vue
-
404src/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
-
183src/subpackage/device/pages/switch_manage/switch_manage.vue
-
336src/subpackage/device/pages/timing/timing_list.vue
-
701src/subpackage/device/pages/timing/timing_setting.vue
-
BINsrc/subpackage/device/static/images/arrow_b2_light.png
-
BINsrc/subpackage/device/static/images/arrow_back.png
-
BINsrc/subpackage/device/static/images/devices/16.png
-
BINsrc/subpackage/device/static/images/devices/17.png
-
BINsrc/subpackage/device/static/images/devices/18.png
-
BINsrc/subpackage/device/static/images/devices/19.png
-
BINsrc/subpackage/device/static/images/i_txt.png
-
BINsrc/subpackage/device/static/images/i_voice_1.png
-
BINsrc/subpackage/device/static/images/i_voice_2.png
-
BINsrc/subpackage/device/static/images/i_voice_3.png
-
BINsrc/subpackage/device/static/images/i_voice_4.png
-
BINsrc/subpackage/device/static/images/icon_clock.png
-
BINsrc/subpackage/device/static/images/index_bg.png
-
BINsrc/subpackage/device/static/images/longOpen.png
-
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/timing.png
-
BINsrc/subpackage/device/static/images/windows.png
@ -0,0 +1,967 @@ |
|||||
|
<template> |
||||
|
<view class="switch-manage"> |
||||
|
<store-name></store-name> |
||||
|
<view class="sm-tit"> |
||||
|
<text>{{pageInfo.name || '-'}}</text> |
||||
|
<text>{{pageInfo.tips || ''}}</text> |
||||
|
</view> |
||||
|
|
||||
|
<view class="slider-box"> |
||||
|
<text>音量</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="sm-list"> |
||||
|
<view class="sl-item" v-for="(e, i) in deviceList" :key="i"> |
||||
|
<view class="si-top"> |
||||
|
<image mode="aspectFit" :src="getIcon()"></image> |
||||
|
<view class="st-right"> |
||||
|
<view class="sr-name">{{e.hardware_name || '-'}}</view> |
||||
|
<!-- 门闸没有状态查询 --> |
||||
|
<!-- 请求接口自定义字段设备状态 1->在线，0->离线 --> |
||||
|
<view class="sr-bot" v-if="pageInfo.id !=5"> |
||||
|
<view :class="[e.defineStatusCode == 1?'active':'']"> |
||||
|
<text>{{ e.defineStatusCode == 1 ? '设备在线' : e.defineStatusCode == 0?'设备离线' : '-' }}</text> |
||||
|
</view> |
||||
|
<image mode="aspectFit" src="/subpackage/device/static/images/refresh.png" |
||||
|
@click="refreshStatusBtn({switchInfo:e, index:i})"></image> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<block v-if="pageInfo.name=='音响管理'"> |
||||
|
<view class="si-bottom"> |
||||
|
<view v-if="pageInfo.isOpen" @click="operateBtn({ switchInfo: e, status: 1 })"> |
||||
|
<image mode="aspectFit" :src="pageInfo.openIcon || ''"></image> |
||||
|
<view>{{pageInfo.openName || '-'}}</view> |
||||
|
</view> |
||||
|
<view v-if="pageInfo.isClose" @click="operateBtn({ switchInfo: e, status: 0 })"> |
||||
|
<image mode="aspectFit" :src="pageInfo.closeIcon || ''"></image> |
||||
|
<view>{{pageInfo.closeName || '-'}}</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
<!-- <block v-else> |
||||
|
<view class="si-bottom" v-if="pageInfo.isOpen || pageInfo.isClose"> |
||||
|
<view v-if="pageInfo.isOpen" @click="operateBtn({ switchInfo: e, status: 1 })"> |
||||
|
<image mode="aspectFit" :src="pageInfo.openIcon || ''"></image> |
||||
|
<view>{{pageInfo.openName || '-'}}</view> |
||||
|
</view> |
||||
|
<view v-if="pageInfo.isClose" @click="operateBtn({ switchInfo: e, status: 0 })"> |
||||
|
<image mode="aspectFit" :src="pageInfo.closeIcon || ''"></image> |
||||
|
<view>{{pageInfo.closeName || '-'}}</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</block> --> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 音频控制 --> |
||||
|
<view class="voice_control_pad" v-if="voicePadConfig.showVoicePad"> |
||||
|
<!-- 文字转语音 --> |
||||
|
<view class="cover_bg" @click.stop="voicePadConfig.showVoicePad=false"> |
||||
|
</view> |
||||
|
<view class="v_box" v-if="voicePadConfig.step==0"> |
||||
|
<textarea value="" v-model="voicePadConfig.txt" placeholder="请输您要说的话，输入标点符号，智能语音效果更好哦！" /> |
||||
|
<view class="v_btns"> |
||||
|
<view class="voice_btn btn_white" @click="sendVoice()">发送</view> |
||||
|
<view class="voice_btn btn_green" @click="listenVoice()">试听</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<!-- 录音 --> |
||||
|
<view class="v_box" v-else> |
||||
|
<view class="voice_title">{{getVoiceTxt(voicePadConfig.step)}}</view> |
||||
|
<image class="voice_img" src="../../static/images/i_voice.png" :src="getVoiceIcon(voicePadConfig.step)" |
||||
|
:class="voicePadConfig.step==2||voicePadConfig.step==4?'voice_img_playing':''"></image> |
||||
|
<view class="voice_btn " @longpress="longPressHandle" @touchend="touchEndHandle" |
||||
|
hover-class="btn_active" v-if="voicePadConfig.step<3">按住说话</view> |
||||
|
<view class="v_btns" v-else-if="voicePadConfig.step==3"> |
||||
|
<view class="voice_btn btn_white" @click="sendVoice()">发送</view> |
||||
|
<view class="voice_btn btn_green" @click="listenVoice()">听取录音</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
const recorderManager = uni.getRecorderManager(); |
||||
|
const innerAudioContext = uni.createInnerAudioContext(); |
||||
|
innerAudioContext.autoplay = true; |
||||
|
|
||||
|
import store_name from '../../components/store_name/store_name'; |
||||
|
import deviceServer from '../../js/device_server'; |
||||
|
import deviceApi from '../../js/device_api'; |
||||
|
const showArr = { |
||||
|
|
||||
|
's14': { |
||||
|
id: 14, |
||||
|
name: '音响管理', |
||||
|
isOpen: true, |
||||
|
isClose: true, |
||||
|
openIcon: '/subpackage/device/static/images/i_txt.png', |
||||
|
closeIcon: '/subpackage/device/static/images/i_voice_1.png', |
||||
|
openName: '文转音', |
||||
|
closeName: '语音', |
||||
|
hardware_type: 'AudioPlayer', |
||||
|
tips: "点击对应音响的麦克风可以进行说话，说话内容将通过音响播放。", |
||||
|
}, |
||||
|
|
||||
|
} |
||||
|
import { |
||||
|
mapState |
||||
|
} from 'vuex'; |
||||
|
import util from '../../../../utils/util'; |
||||
|
|
||||
|
|
||||
|
export default { |
||||
|
components: { |
||||
|
'store-name': store_name |
||||
|
}, |
||||
|
computed: { |
||||
|
...mapState({ |
||||
|
curStoreInfo: state => state.device.curStoreInfo, |
||||
|
}), |
||||
|
getVoiceIcon() { |
||||
|
return i => { |
||||
|
return `../../static/images/i_voice_${i}.png` |
||||
|
} |
||||
|
}, |
||||
|
getVoiceTxt() { |
||||
|
return i => { |
||||
|
return [,'请按住说话','录音中...','录音已完成','播放中...'][i] |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
}, |
||||
|
watch: { |
||||
|
curStoreInfo(newVal, oldVal) { |
||||
|
this.deviceList = []; |
||||
|
this.getDeviceList({ |
||||
|
stadium_id: newVal.id, |
||||
|
hardware_type: this.pageInfo.hardware_type |
||||
|
}) |
||||
|
|
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
pageInfo: {}, |
||||
|
deviceList: [], |
||||
|
voicePadConfig: { |
||||
|
showVoicePad: false, |
||||
|
step: 1, // 0 文字转语音, 1 未录音, 2 录音中, 3 录音结束, 4 播放录音中, |
||||
|
txt: "", |
||||
|
voicePath: "", |
||||
|
voiceUrl: "", |
||||
|
}, |
||||
|
voiceLevel:0 |
||||
|
} |
||||
|
}, |
||||
|
onLoad(options) { |
||||
|
this.initAudio(); |
||||
|
this.initPage(options); |
||||
|
|
||||
|
}, |
||||
|
methods: { |
||||
|
//初始化音频 |
||||
|
initAudio(){ |
||||
|
let self = this; |
||||
|
recorderManager.onStop(function(res) { |
||||
|
console.log('recorder stop' + JSON.stringify(res)); |
||||
|
self.voicePadConfig.voicePath = res.tempFilePath; |
||||
|
}); |
||||
|
innerAudioContext.onPlay(function(res) { |
||||
|
console.log('play voice onPlay' + JSON.stringify(res)); |
||||
|
if(self.voicePadConfig.step==3)self.voicePadConfig.step = 4 |
||||
|
}); |
||||
|
innerAudioContext.onEnded(function(res) { |
||||
|
console.log('play voice onEnded' + JSON.stringify(res)); |
||||
|
if(self.voicePadConfig.step == 4)self.voicePadConfig.step = 3 |
||||
|
}); |
||||
|
}, |
||||
|
initPage(options){ |
||||
|
let _pageInfo = showArr[`s${options.sid}`] || {}; |
||||
|
this.pageInfo = _pageInfo; |
||||
|
uni.setNavigationBarTitle({ |
||||
|
title: _pageInfo.name |
||||
|
}); |
||||
|
|
||||
|
this.getDeviceList({ |
||||
|
stadium_id: this.curStoreInfo.id, |
||||
|
hardware_type: _pageInfo.hardware_type |
||||
|
}) |
||||
|
this.updateVoiceSlider(); |
||||
|
|
||||
|
}, |
||||
|
//滑动更改音响音量 |
||||
|
sliderChange(e) { |
||||
|
console.log('value 发生变化：' + e.detail.value) |
||||
|
let _data = { |
||||
|
"device": this.curStoreInfo.device_name, |
||||
|
"data": { |
||||
|
"name": "audio-player-volume", |
||||
|
"value": { |
||||
|
"volume": e.detail.value.toString() |
||||
|
} |
||||
|
}, |
||||
|
} |
||||
|
//发送命令到中控 |
||||
|
this.operateReq({ |
||||
|
data: _data, |
||||
|
isTip:true |
||||
|
}) |
||||
|
}, |
||||
|
//更新音响音量 |
||||
|
updateVoiceSlider(){ |
||||
|
let that = this |
||||
|
let _data = { |
||||
|
"device": this.curStoreInfo.device_name, |
||||
|
"data": { |
||||
|
"name": "audio-player-volume", |
||||
|
"value": { |
||||
|
"volume": "-1" |
||||
|
} |
||||
|
}, |
||||
|
} |
||||
|
//发送命令到中控 |
||||
|
this.operateReq({ |
||||
|
data: _data, |
||||
|
succFun: (res) => { |
||||
|
console.log("操作结果:",res); |
||||
|
that.voiceLevel = res.data |
||||
|
}, |
||||
|
isTip:false |
||||
|
}) |
||||
|
}, |
||||
|
longPressHandle(e) { |
||||
|
console.log("长按开始..."); |
||||
|
this.voicePadConfig.step = 2 |
||||
|
console.log('开始录音'); |
||||
|
recorderManager.start({ |
||||
|
format: "wav" |
||||
|
}); |
||||
|
}, |
||||
|
touchEndHandle(e) { |
||||
|
console.log("触摸结束..."); |
||||
|
this.voicePadConfig.step = 3 |
||||
|
console.log('录音结束'); |
||||
|
recorderManager.stop(); |
||||
|
}, |
||||
|
//处理音响数据 |
||||
|
HandleVoiceOperate({ |
||||
|
switchInfo, |
||||
|
status |
||||
|
}) { |
||||
|
console.log(switchInfo, status); |
||||
|
if (status === 1) { //文字转语音 |
||||
|
console.log("文字转语音"); |
||||
|
this.voicePadConfig.showVoicePad = true |
||||
|
this.voicePadConfig.step = 0 |
||||
|
} else { //语音发送 |
||||
|
console.log("语音发送"); |
||||
|
this.voicePadConfig.showVoicePad = true |
||||
|
this.voicePadConfig.step = 1 |
||||
|
} |
||||
|
}, |
||||
|
//发送语音到中控 |
||||
|
async sendVoice() { |
||||
|
let that = this |
||||
|
console.log(deviceApi.ORIGIN) |
||||
|
//文字转语音 |
||||
|
let _url = ""; //需上传给后台的语音地址 |
||||
|
if(this.voicePadConfig.step==0){ |
||||
|
let txt = this.voicePadConfig.txt |
||||
|
if(!txt)return util.showNone("请先输入您要说的话后重试") |
||||
|
_url = `${deviceApi.ORIGIN}/ouxuanac/tts/textToVoice.wav?text=${txt}&voice_type=4&speed=-1&volume=10`; |
||||
|
} |
||||
|
//已录音 |
||||
|
if(this.voicePadConfig.step==3){ |
||||
|
console.log("本地录音path:",that.voicePadConfig.voicePath); |
||||
|
let e = await deviceServer.uploadFile({ |
||||
|
url: deviceApi.uploadAudio, |
||||
|
filePath: that.voicePadConfig.voicePath |
||||
|
}); |
||||
|
let _res = util.jsonPar(e.data); |
||||
|
if (_res.code == 0) { |
||||
|
that.voicePadConfig.voiceUrl = _res.data.url |
||||
|
console.log("上传成功后path:", that.voicePadConfig.voiceUrl); |
||||
|
_url = _res.data.url // 上传后地址 |
||||
|
} else { |
||||
|
console.error('上传录音失败--->', _res); |
||||
|
util.showNone(_res.message || '上传录音失败，请重试！') |
||||
|
return |
||||
|
} |
||||
|
} |
||||
|
//组装中控所需data |
||||
|
let _data = { |
||||
|
"device": this.curStoreInfo.device_name, |
||||
|
"data": { |
||||
|
"name": "audio-player", |
||||
|
"value": { |
||||
|
"url": _url |
||||
|
} |
||||
|
}, |
||||
|
// "token": "f0d5c19b-b87e-11eb-bc7d-5254005df464" |
||||
|
} |
||||
|
//发送命令到中控 |
||||
|
if(_url)this.operateReq({ |
||||
|
data: _data |
||||
|
}) |
||||
|
|
||||
|
}, |
||||
|
//试听/播放 语音/录音 |
||||
|
async listenVoice() { |
||||
|
let self = this |
||||
|
if(this.voicePadConfig.step==0){ |
||||
|
//需要将语音下载到本地,然后播放 |
||||
|
let txt = this.voicePadConfig.txt; |
||||
|
if(!txt)return util.showNone("请先输入您要说的话后重试") |
||||
|
let url =`${deviceApi.ORIGIN}/ouxuanac/tts/textToVoice.wav?text=${txt}&voice_type=4&speed=-1&volume=10`; |
||||
|
let updated_url = await this.getDownloadUrl(url) |
||||
|
innerAudioContext.src = updated_url |
||||
|
} |
||||
|
if(this.voicePadConfig.step==3){ |
||||
|
innerAudioContext.src = this.voicePadConfig.voicePath; |
||||
|
} |
||||
|
console.log('播放录音文件:', innerAudioContext.src); |
||||
|
if(innerAudioContext.src)innerAudioContext.play(); |
||||
|
}, |
||||
|
getDownloadUrl(url) { |
||||
|
console.log('下载录音'); |
||||
|
util.showLoad() |
||||
|
return new Promise((rs,rj)=>{ |
||||
|
uni.downloadFile({ |
||||
|
url: url, //资源路径e |
||||
|
success: (res) => { |
||||
|
if (res.statusCode === 200) { |
||||
|
console.log('下载成功',res); |
||||
|
util.hideLoad() |
||||
|
rs(res.tempFilePath) |
||||
|
} |
||||
|
}, |
||||
|
fail: (e) => { |
||||
|
console.log('文字转录音文件下载失败',e); |
||||
|
util.hideLoad() |
||||
|
rj(e) |
||||
|
}, |
||||
|
complete: (e) => { |
||||
|
util.hideLoad() |
||||
|
}, |
||||
|
}); |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
getDeviceList({ |
||||
|
stadium_id, |
||||
|
hardware_type, |
||||
|
limit = 100, |
||||
|
page = 1 |
||||
|
}) { |
||||
|
util.showLoad(); |
||||
|
deviceServer.get({ |
||||
|
url: deviceApi.hardwareList, |
||||
|
data: { |
||||
|
'filter[hardware_type]': hardware_type, |
||||
|
'filter[stadium_id]': stadium_id, |
||||
|
'limit': limit, |
||||
|
'page': page, |
||||
|
}, |
||||
|
failMsg: '加载失败！' |
||||
|
}) |
||||
|
.then(res => { |
||||
|
util.hideLoad(); |
||||
|
let _list = res.list || []; |
||||
|
|
||||
|
//直接拿中控在线状态 做下临时处理先用中控状态的数据填一下 |
||||
|
let deviceInfo = uni.getStorageSync("deviceInfo"); |
||||
|
_list = _list.map((e,i)=>{ |
||||
|
e['defineStatusCode'] = deviceInfo.Online==1? 1 : 0; |
||||
|
return e |
||||
|
}) |
||||
|
this.deviceList = _list; |
||||
|
console.log(res) |
||||
|
|
||||
|
this.updateVoiceSlider(); |
||||
|
}) |
||||
|
.catch(util.hideLoad) |
||||
|
}, |
||||
|
// 按钮操作， status 0 -> 关（左）， 1 -> 开（右） |
||||
|
operateBtn: util.debounce(function({ |
||||
|
switchInfo, |
||||
|
status |
||||
|
}) { |
||||
|
if (switchInfo.hardware_type === "AudioPlayer") return this.HandleVoiceOperate({ |
||||
|
switchInfo, |
||||
|
status |
||||
|
}); //单独处理音响操作0704 |
||||
|
|
||||
|
let _data = this.getOperateReqData({ |
||||
|
switchInfo, |
||||
|
status |
||||
|
}) |
||||
|
//针对门禁没有关按钮发两条命令->开&关 20201224 后端： 直接发两条 关的那条这里填5 然后你那边不用管返回 |
||||
|
if (switchInfo.hardware_type === 'AccessControl' && status == 1) { |
||||
|
this.operateReq({ |
||||
|
data: this.getOperateReqData({ |
||||
|
switchInfo, |
||||
|
status: 0 |
||||
|
}), |
||||
|
isTip: false, |
||||
|
isLoad: false |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
this.operateReq({ |
||||
|
data: _data |
||||
|
}); |
||||
|
|
||||
|
}, 300, 300), |
||||
|
|
||||
|
// 获取接口参数结构 |
||||
|
getOperateReqData({ |
||||
|
switchInfo, |
||||
|
status |
||||
|
}) { |
||||
|
let { |
||||
|
curStoreInfo |
||||
|
} = this; |
||||
|
|
||||
|
let _query = switchInfo.hardware_type === 'GateControl' ? |
||||
|
this.getGateQuery({ |
||||
|
switchInfo, |
||||
|
status |
||||
|
}) : |
||||
|
this.getSwitchQuery({ |
||||
|
switchInfo, |
||||
|
status |
||||
|
}); |
||||
|
let _data = { |
||||
|
device: curStoreInfo.device_name, // 中控名, |
||||
|
data: _query, // 后端数据结构， 参考src\subpackage\device\js\ouxuanac.md |
||||
|
}; |
||||
|
|
||||
|
//针对门禁没有关按钮发两条命令->开&关 20201224 后端： 直接发两条 关的那条这里填5 然后你那边不用管返回 |
||||
|
if (switchInfo.hardware_type === 'AccessControl' && status == 0) _data['delay'] = '5'; |
||||
|
|
||||
|
return _data; |
||||
|
}, |
||||
|
// 操作接口请求 |
||||
|
operateReq({ |
||||
|
data, |
||||
|
succFun, |
||||
|
isTip = true, |
||||
|
isLoad = true |
||||
|
}) { |
||||
|
let that = this |
||||
|
if (isLoad) util.showLoad(); |
||||
|
console.log("123",data); |
||||
|
deviceServer.post({ |
||||
|
url: deviceApi.ouxuanac, |
||||
|
data: data, |
||||
|
isDefaultGet: false, |
||||
|
}) |
||||
|
.then(res => { |
||||
|
if (isLoad) util.hideLoad(); |
||||
|
if (res.data.code == 0) { |
||||
|
succFun(res.data); |
||||
|
if (isTip) util.showNone(res.data.message || '操作成功！'); |
||||
|
that.voicePadConfig.showVoicePad = false; //操作成功后关闭voicePad |
||||
|
} else { |
||||
|
if (isTip) util.showNone(res.data.message || '操作失败！'); |
||||
|
} |
||||
|
}) |
||||
|
.catch(err => { |
||||
|
if (isLoad) util.hideLoad() |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
// 门闸数据结构 // 门闸数据结构不统一 |
||||
|
getGateQuery({ |
||||
|
switchInfo, |
||||
|
status |
||||
|
}) { |
||||
|
let { |
||||
|
enter_id, |
||||
|
leave_id, |
||||
|
hardware_net_addr |
||||
|
} = switchInfo; |
||||
|
// 进出控制ID |进入-> enter_id 离开-> leave_id| |
||||
|
let _cid = status === 1 ? enter_id : |
||||
|
status === 0 ? leave_id : ''; |
||||
|
return { |
||||
|
name: 'gate', |
||||
|
value: { |
||||
|
tcp: hardware_net_addr + '', |
||||
|
cid: _cid + '' |
||||
|
}, |
||||
|
is_delay: true, |
||||
|
queue_group: 'gate' |
||||
|
} |
||||
|
}, |
||||
|
// |
||||
|
refreshStatusBtn: util.debounce(function({ |
||||
|
switchInfo, |
||||
|
index |
||||
|
}) { |
||||
|
// this.getStatusReq({ |
||||
|
// data: this.getSwitchStatusQuery(switchInfo), |
||||
|
// index, |
||||
|
// }) |
||||
|
//TODO 等待后续音响设备调试后,再开放更新设备状态功能 |
||||
|
util.showLoad(); |
||||
|
setTimeout(()=>util.hideLoad(),1000) |
||||
|
}, 300, 300), |
||||
|
// 获取设备状态 |
||||
|
getStatusReq({ |
||||
|
data, |
||||
|
index |
||||
|
}) { |
||||
|
let _deviceList = this.deviceList.slice(); |
||||
|
util.showLoad(); |
||||
|
deviceServer.post({ |
||||
|
url: deviceApi.ouxuanac, |
||||
|
data: data, |
||||
|
isDefaultGet: false, |
||||
|
}) |
||||
|
.then(res => { |
||||
|
util.hideLoad(); |
||||
|
let _data = res.data || {}; |
||||
|
console.log(this.changeLowerCase(_data.data)) |
||||
|
if (_data.code == 504 || this.changeLowerCase(_data.data).indexOf('timeout') != -1) { |
||||
|
_deviceList[index]['defineStatusCode'] = 0; |
||||
|
|
||||
|
} else if (_data.code == 0 && this.changeLowerCase(_data.data).indexOf('timeout') == -1) { |
||||
|
_deviceList[index]['defineStatusCode'] = 1; |
||||
|
} else { |
||||
|
util.showNone(_data.message || '操作失败！'); |
||||
|
} |
||||
|
this.deviceList = _deviceList; |
||||
|
// if(res.data.code == 0){ |
||||
|
// if(isTip)util.showNone(res.data.message || '操作成功！'); |
||||
|
// }else{ |
||||
|
// if(isTip)util.showNone(res.data.message || '操作失败！'); |
||||
|
// } |
||||
|
}) |
||||
|
.catch(util.hideLoad) |
||||
|
}, |
||||
|
|
||||
|
// 咖啡机和门闸暂时没有状态 |
||||
|
// 设备状态请求参数数据结构 |
||||
|
getSwitchStatusQuery(switchInfo) { |
||||
|
let { |
||||
|
curStoreInfo |
||||
|
} = this; |
||||
|
let { |
||||
|
hardware_connect_method, |
||||
|
hardware_type, |
||||
|
hardware_id, |
||||
|
node_id, |
||||
|
hardware_net_addr |
||||
|
} = switchInfo; |
||||
|
|
||||
|
|
||||
|
const _query = { |
||||
|
name: this.getStatusQueryName(switchInfo), |
||||
|
value: { |
||||
|
id: hardware_id + '', |
||||
|
} // value 内值全为String |
||||
|
}; |
||||
|
|
||||
|
if (this.changeLowerCase(hardware_connect_method) === 'tcp') _query.value['tcp'] = hardware_net_addr + ''; |
||||
|
let _flag = this.changeLowerCase(hardware_connect_method) === 'serialport485' || this.changeLowerCase( |
||||
|
hardware_connect_method) === 'tcp'; |
||||
|
if (_flag) { |
||||
|
if (hardware_type === 'Air') { // 空调开关状态 key为 op |
||||
|
_query.value['op'] = 'status' |
||||
|
_query['name'] = this.getAirQueryName(switchInfo) |
||||
|
} else { |
||||
|
_query.value['p'] = node_id + ''; // 硬件子id |
||||
|
// postData.value['o'] = this.getRelayStatus(status); // 开关状态 |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
return { |
||||
|
device: curStoreInfo.device_name, // 中控名, |
||||
|
data: _query, // 后端数据结构， 参考src\subpackage\device\js\ouxuanac.md |
||||
|
} |
||||
|
|
||||
|
// this.getStatusReq({ |
||||
|
// index, |
||||
|
// data: { |
||||
|
// device: curStoreInfo.device_name, // 中控名, |
||||
|
// data: _query, // 后端数据结构， 参考src\subpackage\device\js\ouxuanac.md |
||||
|
// } |
||||
|
// }) |
||||
|
}, |
||||
|
// switchInfo -> 当前开关信息 |
||||
|
// status -> 开关状态 0 -> 关（右）， 1 -> 开（左） |
||||
|
// 数据结构参考 src\subpackage\device\js\ouxuanac.md |
||||
|
// 空调开关数据结构独立判断处理 hardware_type === 'Air' |
||||
|
getSwitchQuery({ |
||||
|
switchInfo, |
||||
|
status |
||||
|
}) { |
||||
|
let { |
||||
|
hardware_connect_method, |
||||
|
hardware_type, |
||||
|
hardware_id, |
||||
|
node_id, |
||||
|
hardware_net_addr |
||||
|
} = switchInfo; |
||||
|
|
||||
|
const postData = { |
||||
|
name: this.getQueryName(switchInfo), |
||||
|
value: { |
||||
|
id: hardware_id + '', |
||||
|
} // value 内值全为String |
||||
|
}; |
||||
|
|
||||
|
if (this.changeLowerCase(hardware_connect_method) === 'gpio') postData.value['status'] = this |
||||
|
.getRelayStatus(status); |
||||
|
|
||||
|
// tcp 连接需要 hardware_net_addr |
||||
|
if (this.changeLowerCase(hardware_connect_method) === 'tcp') postData.value['tcp'] = hardware_net_addr + |
||||
|
''; |
||||
|
let _flag = this.changeLowerCase(hardware_connect_method) === 'serialport485' || this.changeLowerCase( |
||||
|
hardware_connect_method) === 'tcp'; |
||||
|
if (_flag) { |
||||
|
if (hardware_type === 'Air') { // 空调开关状态 key为 op |
||||
|
postData.value['op'] = this.getAirRelayStatus(status); |
||||
|
postData['name'] = this.getAirQueryName(switchInfo) |
||||
|
} else { |
||||
|
// 空调设备不需要以下两个字段 |
||||
|
postData.value['p'] = node_id + ''; // 硬件子id |
||||
|
postData.value['o'] = this.getRelayStatus(status); // 开关状态 |
||||
|
} |
||||
|
} |
||||
|
return postData; |
||||
|
}, |
||||
|
changeLowerCase(str) { |
||||
|
return str.toString().toLocaleLowerCase(); |
||||
|
}, |
||||
|
// 常规开关状态 |
||||
|
// Low = "low", // 低电位，为开启 |
||||
|
// High = "high", // 高电位， 为关闭 |
||||
|
getRelayStatus(status) { |
||||
|
return ['high', 'low'][status] || '' |
||||
|
}, |
||||
|
|
||||
|
// 空调状态 |
||||
|
// status = "status", |
||||
|
// on = "on", |
||||
|
// off = "off", |
||||
|
getAirRelayStatus(status) { |
||||
|
return ['off', 'on'][status] || '' |
||||
|
}, |
||||
|
|
||||
|
// 非空调获取状态name |
||||
|
getStatusQueryName(switchInfo) { |
||||
|
let { |
||||
|
hardware_connect_method |
||||
|
} = switchInfo; |
||||
|
let _obj = { |
||||
|
'Gpio': 'get-rpio', // 全设备 |
||||
|
'SerialPort485': 'zzio404d-gpio-status', |
||||
|
'Tcp': 'zzio404d-gpio-status-tcp', |
||||
|
}; |
||||
|
|
||||
|
return _obj[hardware_connect_method] || '' |
||||
|
}, |
||||
|
|
||||
|
// 非空调获取设置name |
||||
|
getQueryName(switchInfo) { |
||||
|
let { |
||||
|
hardware_connect_method |
||||
|
} = switchInfo; |
||||
|
let _obj = { |
||||
|
'Gpio': 'set-rpio', // 全设备 |
||||
|
'SerialPort485': 'zzio404d-gpio', |
||||
|
'Tcp': 'zzio404d-gpio-tcp', |
||||
|
}; |
||||
|
|
||||
|
return _obj[hardware_connect_method] || '' |
||||
|
}, |
||||
|
// 空调name获取 |
||||
|
getAirQueryName(switchInfo) { |
||||
|
let { |
||||
|
hardware_connect_method, |
||||
|
hardware_model |
||||
|
} = switchInfo; |
||||
|
let _flag = this.changeLowerCase(hardware_connect_method) === 'tcp' && this.changeLowerCase( |
||||
|
hardware_model) === 'jianda'; |
||||
|
if (_flag) return 'ray-air-rs-tcp'; |
||||
|
let _obj = { |
||||
|
'acmelec': 'acmelec', |
||||
|
'zhongnan': 'zhongnan', |
||||
|
'jianda': 'ray-air-rs' |
||||
|
}; |
||||
|
return _obj[this.changeLowerCase(hardware_model)] || ''; |
||||
|
}, |
||||
|
|
||||
|
getIcon() { |
||||
|
let { |
||||
|
pageInfo |
||||
|
} = this; |
||||
|
if (!pageInfo.id) return ''; |
||||
|
return `/subpackage/device/static/images/devices/${pageInfo.id}.png` |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
@import '~style/public.scss'; |
||||
|
.slider-box{ |
||||
|
margin-bottom: 40rpx; |
||||
|
> text { |
||||
|
margin-left: 30rpx; |
||||
|
font-size: 24rpx; |
||||
|
color: #9C9C9F; |
||||
|
} |
||||
|
> view{ |
||||
|
width: 100%; |
||||
|
color: #9C9C9F; |
||||
|
font-size: 28rpx; |
||||
|
@include centerFlex(space-between); |
||||
|
padding: 0 34rpx; |
||||
|
} |
||||
|
} |
||||
|
.sm-tit { |
||||
|
padding-left: 40upx; |
||||
|
padding-top: 52upx; |
||||
|
padding-bottom: 30upx; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
flex-wrap: nowrap; |
||||
|
|
||||
|
text:first-child { |
||||
|
line-height: 60upx; |
||||
|
font-size: 44upx; |
||||
|
font-weight: 500; |
||||
|
color: #333; |
||||
|
} |
||||
|
|
||||
|
text:last-child { |
||||
|
width: 466rpx; |
||||
|
color: #9C9C9F; |
||||
|
font-size: 24rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.sm-list { |
||||
|
padding: 0 32upx; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
flex-wrap: wrap; |
||||
|
|
||||
|
.sl-item { |
||||
|
margin-bottom: 30upx; |
||||
|
width: 328upx; |
||||
|
border-radius: 10upx; |
||||
|
background-color: #fff; |
||||
|
|
||||
|
.si-top { |
||||
|
padding: 20upx 20upx 30upx; |
||||
|
display: flex; |
||||
|
flex-wrap: nowrap; |
||||
|
|
||||
|
>image { |
||||
|
flex-shrink: 0; |
||||
|
flex-grow: 0; |
||||
|
margin-right: 20upx; |
||||
|
width: 80upx; |
||||
|
height: 80upx; |
||||
|
} |
||||
|
|
||||
|
.st-right { |
||||
|
flex-grow: 1; |
||||
|
|
||||
|
>.sr-name { |
||||
|
margin-bottom: 8upx; |
||||
|
line-height: 44upx; |
||||
|
font-size: 32upx; |
||||
|
color: #333; |
||||
|
@include textHide(1); |
||||
|
} |
||||
|
|
||||
|
.sr-bot { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
|
||||
|
>view { |
||||
|
margin-right: 8upx; |
||||
|
padding: 0 12upx; |
||||
|
font-size: 20upx; |
||||
|
line-height: 28upx; |
||||
|
border-radius: 28upx; |
||||
|
border: 2upx solid #9A9A9D; |
||||
|
color: #9A9A9D; |
||||
|
|
||||
|
&::before { |
||||
|
content: ''; |
||||
|
margin-right: 12upx; |
||||
|
margin-top: -4upx; |
||||
|
display: inline-block; |
||||
|
vertical-align: middle; |
||||
|
width: 8upx; |
||||
|
height: 8upx; |
||||
|
border-radius: 50%; |
||||
|
background-color: #9A9A9D; |
||||
|
} |
||||
|
|
||||
|
&.active { |
||||
|
color: #333333; |
||||
|
|
||||
|
&::before { |
||||
|
background-color: $themeColor; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
>image { |
||||
|
flex-shrink: 0; |
||||
|
flex-grow: 0; |
||||
|
width: 32upx; |
||||
|
height: 32upx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.si-bottom { |
||||
|
padding-top: 30upx; |
||||
|
padding-bottom: 30upx; |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
border-top: 2upx solid #F2F2F7; |
||||
|
|
||||
|
>view { |
||||
|
flex-shrink: 0; |
||||
|
flex-grow: 0; |
||||
|
width: 50%; |
||||
|
|
||||
|
>image { |
||||
|
display: block; |
||||
|
margin: 0 auto 20upx; |
||||
|
width: 100upx; |
||||
|
height: 100upx; |
||||
|
} |
||||
|
|
||||
|
>view { |
||||
|
font-size: 24upx; |
||||
|
line-height: 34upx; |
||||
|
text-align: center; |
||||
|
color: #9a9a9d; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
//语音控制板 |
||||
|
.voice_control_pad { |
||||
|
position: fixed; |
||||
|
top: 0; |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
z-index: 1; |
||||
|
|
||||
|
.cover_bg { |
||||
|
position: fixed; |
||||
|
top: 0; |
||||
|
background: rgba($color: #000000, $alpha: .3); |
||||
|
z-index: 2; |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
||||
|
|
||||
|
.v_box { |
||||
|
z-index: 3; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
justify-content: flex-start; |
||||
|
align-items: center; |
||||
|
border-radius: 5rpx; |
||||
|
width: 620rpx; |
||||
|
height: 550rpx; |
||||
|
background-color: white; |
||||
|
|
||||
|
textarea { |
||||
|
margin-top: 50rpx; |
||||
|
width: 560rpx; |
||||
|
height: 260rpx; |
||||
|
} |
||||
|
|
||||
|
.voice_title { |
||||
|
max-width: 560rpx; |
||||
|
color: #1A1A1A; |
||||
|
font-size: 32rpx; |
||||
|
font-weight: 800; |
||||
|
margin-top: 68rpx; |
||||
|
} |
||||
|
|
||||
|
.voice_img { |
||||
|
margin-top: 70rpx; |
||||
|
width: 100rpx; |
||||
|
height: 100rpx; |
||||
|
} |
||||
|
|
||||
|
.voice_img_playing { |
||||
|
width: 206rpx; |
||||
|
height: 100rpx; |
||||
|
} |
||||
|
|
||||
|
.voice_btn { |
||||
|
margin-top: 100rpx; |
||||
|
width: 392rpx; |
||||
|
height: 112rpx; |
||||
|
background: #009874; |
||||
|
border-radius: 5rpx; |
||||
|
text-align: center; |
||||
|
line-height: 112rpx; |
||||
|
color: white; |
||||
|
font-size: 32rpx; |
||||
|
} |
||||
|
|
||||
|
.btn_active { |
||||
|
color: black; |
||||
|
background-color: rgba($color: #000000, $alpha: .4); |
||||
|
} |
||||
|
|
||||
|
.btn_white { |
||||
|
width: 204rpx; |
||||
|
height: 88rpx; |
||||
|
background-color: white; |
||||
|
color: #009874; |
||||
|
border: 1rpx solid #009874; |
||||
|
line-height: 88rpx; |
||||
|
} |
||||
|
|
||||
|
.btn_green { |
||||
|
width: 204rpx; |
||||
|
height: 88rpx; |
||||
|
background-color: #009874; |
||||
|
color: white; |
||||
|
line-height: 88rpx; |
||||
|
} |
||||
|
|
||||
|
.v_btns { |
||||
|
width: 470rpx; |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
justify-content: space-around; |
||||
|
align-items: center; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,8 @@ |
|||||
|
<template> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
</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,470 @@ |
|||||
|
<template> |
||||
|
<view class="t-router-page"> |
||||
|
<!-- <store-name></store-name> --> |
||||
|
<view class="t-title">物联卡管理 |
||||
|
<view class="t-reset" @click="updateList">更新 |
||||
|
<image src="../../static/images/refresh.png" mode=""></image> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="t-update"> |
||||
|
更新时间: {{update_time}} |
||||
|
</view> |
||||
|
|
||||
|
<!-- <view class="t-map" v-if="covers.length>0"> |
||||
|
<map style="width: 100%; height: 250px;" :latitude="latitude" :longitude="longitude" :markers="covers"> |
||||
|
</map> |
||||
|
</view> --> |
||||
|
|
||||
|
<view class="t-box"> |
||||
|
<view class="info-list"> |
||||
|
<view class="i-item" v-for="(item,index) in infoObj"> |
||||
|
<view class="i-box">{{item.name}}</view> |
||||
|
<rich-text class="i-box" :nodes="item.value"></rich-text> |
||||
|
</view> |
||||
|
</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' |
||||
|
|
||||
|
// 参数参考: https://support.huaweicloud.com/api-ocgsl/gsl_07_0008.html |
||||
|
const infoObj = [ |
||||
|
{ |
||||
|
key:"act_date", |
||||
|
value:"", |
||||
|
name:"在线时间", |
||||
|
key2:"" |
||||
|
}, |
||||
|
{ |
||||
|
key:"order_id", |
||||
|
value:"", |
||||
|
name:"批次号", |
||||
|
key2:"" |
||||
|
}, |
||||
|
{ |
||||
|
key:"flow_left", |
||||
|
value:"", |
||||
|
name:"剩余流量(单位M)", |
||||
|
key2:"" |
||||
|
}, |
||||
|
|
||||
|
{ |
||||
|
key:"flow_used", |
||||
|
value:"", |
||||
|
name:"已用流量(单位M)", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"sim_type", |
||||
|
value:"", |
||||
|
name:"sim卡类型", |
||||
|
key2:"", //当key2,存在时,value为data[key][key2] |
||||
|
typeArr:[,"vSIM","eSIM","实体卡"], //当typeArr,value 存在时, value为typeArr[value] |
||||
|
},{ |
||||
|
key:"sim_status", |
||||
|
value:"", |
||||
|
name:"sim卡状态", |
||||
|
key2:"", //当key2,存在时,value为data[key][key2] |
||||
|
typeArr:{ |
||||
|
"11":"未激活", |
||||
|
"13":"可激活", |
||||
|
"14":"已停用", |
||||
|
"20":"在用" |
||||
|
}, //当typeArr,value 存在时, value为typeArr[value] |
||||
|
},{ |
||||
|
key:"signal_level", |
||||
|
value:"", |
||||
|
name:"信号等级", |
||||
|
key2:"", |
||||
|
typeArr:["未知","差","良","良","优"] |
||||
|
},{ |
||||
|
key:"price_plan_name", |
||||
|
value:"", |
||||
|
name:"在用套餐名", |
||||
|
key2:"", |
||||
|
},{ |
||||
|
key:"real_named", |
||||
|
value:"", |
||||
|
name:"是否已实名认证", |
||||
|
key2:"", |
||||
|
},{ |
||||
|
key:"sim_price_plan_id", |
||||
|
value:"", |
||||
|
name:"套餐订购实例ID", |
||||
|
key2:"", |
||||
|
},{ |
||||
|
key:"tag_names", |
||||
|
value:"", |
||||
|
name:"标签名", |
||||
|
key2:"", |
||||
|
},{ |
||||
|
key:"sim_card_id", |
||||
|
value:"", |
||||
|
name:"sim卡id", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"cid", |
||||
|
value:"", |
||||
|
name:"cid", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"imei", |
||||
|
value:"", |
||||
|
name:"imei", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"imsi", |
||||
|
value:"", |
||||
|
name:"imsi", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"iccid", |
||||
|
value:"", |
||||
|
name:"iccid", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"msisdn", |
||||
|
value:"", |
||||
|
name:"msisdn", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"network_type", |
||||
|
value:"", |
||||
|
name:"网络类型", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"node_id", |
||||
|
value:"", |
||||
|
name:"设备标识", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"operator_status", |
||||
|
value:"", |
||||
|
name:"运营商状态", |
||||
|
key2:"", |
||||
|
typeArr:["非停机","停机（超流量停机）" ,"停机（超流量阈值停机）" ,"停机（流量池停机）" ,"停机（套餐到期停机）","停机（主动停机）","停机（违规停机）"] |
||||
|
},{ |
||||
|
key:"device_status", |
||||
|
value:"", |
||||
|
name:"iccid", |
||||
|
key2:"", |
||||
|
typeArr:["未知", "注册", "重启", "在线", "离线"] |
||||
|
},{ |
||||
|
key:"cut_net_flag", |
||||
|
value:"", |
||||
|
name:"是否单独断网", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"exceed_cut_net_flag", |
||||
|
value:"", |
||||
|
name:"是否达量断网", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"exceed_cut_net_quota", |
||||
|
value:"", |
||||
|
name:"达量断网阈值(单位MB)", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"imei_bind_remain_times", |
||||
|
value:"", |
||||
|
name:"本月机卡绑定剩余次数", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"speed_value", |
||||
|
value:"", |
||||
|
name:"网络限制速率(单位Kbps)", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"exceed_cut_net_quota", |
||||
|
value:"", |
||||
|
name:"达量断网阈值(单位MB)", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"expire_time", |
||||
|
value:"", |
||||
|
name:"过期时间", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"dbm", |
||||
|
value:"", |
||||
|
name:"信号强度", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"device_model", |
||||
|
value:"", |
||||
|
name:"设备模组", |
||||
|
key2:"" |
||||
|
} |
||||
|
]; |
||||
|
import { |
||||
|
mapState |
||||
|
} from 'vuex' |
||||
|
export default { |
||||
|
components: { |
||||
|
'store-name': store_name |
||||
|
}, |
||||
|
computed: { |
||||
|
...mapState({ |
||||
|
storeList: state => state.device.storeList, |
||||
|
curStoreInfo: state => state.device.curStoreInfo, |
||||
|
}), |
||||
|
isDel() { |
||||
|
return (item) => { |
||||
|
return item[2] == "删除" ? "true" : "" |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
infoObj, |
||||
|
latitude: 23.2174411, |
||||
|
longitude: 113.3048267, |
||||
|
update_time:new Date(), |
||||
|
covers: [ |
||||
|
], |
||||
|
} |
||||
|
}, |
||||
|
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: { |
||||
|
clickReboot(){ |
||||
|
let that = this |
||||
|
uni.showModal({ |
||||
|
content: `更新信息 ?`, |
||||
|
success(res) { |
||||
|
console.log("确认", res.confirm) |
||||
|
if(res.confirm){ |
||||
|
that.reboot4G() |
||||
|
} |
||||
|
}, |
||||
|
}) |
||||
|
}, |
||||
|
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() |
||||
|
}) |
||||
|
|
||||
|
}, |
||||
|
//过滤路由数据 |
||||
|
filterRouterData(data){ |
||||
|
console.log("filterRouterData:",data); |
||||
|
let obj = this.infoObj |
||||
|
for(var i in obj){ |
||||
|
let e = obj[i] |
||||
|
let res = data[e.key] |
||||
|
if(res==="undefined")res = "未知状态1" |
||||
|
if(res==="")res = "未知状态2" //写个未知状态({状态值}) 字段没有还是数值没有 |
||||
|
console.log(888888,res); |
||||
|
// if(res==="undefined"||res==="") continue |
||||
|
e.value = (typeof(res)=="object")?data[e.key][e.key2]:res; |
||||
|
e.value = e.value.toString(); |
||||
|
if(e.typeArr&&e.value)e.value = e.typeArr[e.value]; |
||||
|
if(e.value=== "false")e.value = "否"; |
||||
|
if(e.value=== "true")e.value = "是"; |
||||
|
// if(e.value===0)e.value = "0"; |
||||
|
console.log(e.value); |
||||
|
} |
||||
|
|
||||
|
this.update_time = obj[0].value; |
||||
|
}, |
||||
|
goBack() { |
||||
|
uni.navigateBack({ |
||||
|
delta: 1 |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
@import '~style/public.scss'; |
||||
|
|
||||
|
.t-router-page { |
||||
|
|
||||
|
.t-title { |
||||
|
font-size: 44rpx; |
||||
|
color: #1A1A1A; |
||||
|
font-weight: 900; |
||||
|
@include centerFlex(space-between); |
||||
|
margin: 60rpx auto 0rpx 40rpx; |
||||
|
.t-reset{ |
||||
|
padding-right: 48rpx; |
||||
|
@include centerFlex(center); |
||||
|
font-size: 32rpx; |
||||
|
color: #009874; |
||||
|
image{ |
||||
|
margin-top: 5rpx; |
||||
|
margin-left: 15rpx; |
||||
|
width: 32rpx; |
||||
|
height: 32rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
.t-update{ |
||||
|
font-size: 28rpx; |
||||
|
color: #9C9C9F; |
||||
|
margin-top: 38rpx; |
||||
|
margin-left: 40rpx; |
||||
|
} |
||||
|
.t-map{ |
||||
|
@include centerFlex(center); |
||||
|
width:700rpx; |
||||
|
// background-color: lightgray; |
||||
|
// height: 450rpx; |
||||
|
margin: 25rpx; |
||||
|
} |
||||
|
.t-box { |
||||
|
height: 500rpx; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
align-items: center; |
||||
|
justify-content: flex-start; |
||||
|
width: 100%; |
||||
|
|
||||
|
.tab-list { |
||||
|
width: 100%; |
||||
|
padding-left: 30rpx; |
||||
|
@include centerFlex(flex-start); |
||||
|
flex-wrap: nowrap; |
||||
|
position: relative; |
||||
|
|
||||
|
.t-item { |
||||
|
margin-right: 50rpx; |
||||
|
padding: 10rpx; |
||||
|
font-size: 32rpx; |
||||
|
font-weight: 900; |
||||
|
color: #9C9C9F; |
||||
|
line-height: 40rpx; |
||||
|
} |
||||
|
|
||||
|
.active { |
||||
|
color: #009874; |
||||
|
@include centerFlex(center); |
||||
|
flex-direction: column; |
||||
|
} |
||||
|
|
||||
|
.active:after { |
||||
|
position: absolute; |
||||
|
content: ""; |
||||
|
background-color: #009874; |
||||
|
color: #009874; |
||||
|
width: auto; |
||||
|
display: block; |
||||
|
width: 30rpx; |
||||
|
text-align: center; |
||||
|
height: 6rpx; |
||||
|
border-radius: 3rpx; |
||||
|
top: 60rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.info-list { |
||||
|
margin-top: 30rpx; |
||||
|
margin-bottom: 50rpx; |
||||
|
width: 700rpx; |
||||
|
height: auto; |
||||
|
background: #FFFFFF; |
||||
|
border-radius: 10rpx; |
||||
|
font-size: 28rpx; |
||||
|
|
||||
|
.i-item { |
||||
|
@include centerFlex(flex-start); |
||||
|
|
||||
|
.i-box { |
||||
|
@include centerFlex(flex-start); |
||||
|
flex-direction: row; |
||||
|
padding: 26rpx 20rpx; |
||||
|
height: 100%; |
||||
|
} |
||||
|
|
||||
|
.i-box:first-child { |
||||
|
@include centerFlex(center); |
||||
|
width: 300rpx; |
||||
|
text-align: center; |
||||
|
border-right: 1rpx solid #F2F2F7; |
||||
|
} |
||||
|
|
||||
|
.i-box:nth-child(2) { |
||||
|
width: 100%; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
.i-item:not(:last-child) { |
||||
|
border-bottom: 1rpx solid #F2F2F7; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,427 @@ |
|||||
|
<template> |
||||
|
<view class="t-router-page"> |
||||
|
<!-- <store-name></store-name> --> |
||||
|
<view class="t-title">路由器管理 |
||||
|
<view class="t-reset" @click="clickReboot">重启 |
||||
|
<image src="../../static/images/refresh.png" mode=""></image> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="t-update"> |
||||
|
更新时间: {{update_time}} |
||||
|
</view> |
||||
|
|
||||
|
<view class="t-map" v-if="covers.length>0"> |
||||
|
<map style="width: 100%; height: 250px;" :latitude="latitude" :longitude="longitude" :markers="covers"> |
||||
|
</map> |
||||
|
</view> |
||||
|
<view class="t-box" v-if="infoObj"> |
||||
|
<view class="info-list"> |
||||
|
<view class="i-item" v-for="(item,index) in infoObj"> |
||||
|
<view class="i-box">{{item.name}}</view> |
||||
|
<rich-text class="i-box" :nodes="item.value"></rich-text> |
||||
|
</view> |
||||
|
</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' |
||||
|
|
||||
|
const infoObj = [ |
||||
|
{ |
||||
|
key:"update_time", |
||||
|
value:"", |
||||
|
name:"在线时间", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"model", |
||||
|
value:"00-00-00", |
||||
|
name:"路由型号", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"mac", |
||||
|
value:"", |
||||
|
name:"MAC地址", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"firmware", |
||||
|
value:"", |
||||
|
name:"固件版本", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"imei", |
||||
|
value:"", |
||||
|
name:"imei", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"imsi", |
||||
|
value:"", |
||||
|
name:"imsi", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"iccid", |
||||
|
value:"", |
||||
|
name:"iccid", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"mncmcc", |
||||
|
value:"", |
||||
|
name:"国家代码", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"lac", |
||||
|
value:"", |
||||
|
name:"lac", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"cellid", |
||||
|
value:"", |
||||
|
name:"cellid", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"csq", |
||||
|
value:"", |
||||
|
name:"信号强度", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"lanip", |
||||
|
value:"", |
||||
|
name:"路由IP", |
||||
|
key2:"ipaddr" |
||||
|
},{ |
||||
|
key:"lanip", |
||||
|
value:"", |
||||
|
name:"掩码", |
||||
|
key2:"netmask" |
||||
|
},{ |
||||
|
key:"lanip", |
||||
|
value:"", |
||||
|
name:"网关", |
||||
|
key2:"gateway" |
||||
|
},{ |
||||
|
key:"lanip", |
||||
|
value:"", |
||||
|
name:"dns1", |
||||
|
key2:"" |
||||
|
},{ |
||||
|
key:"lanip", |
||||
|
value:"", |
||||
|
name:"dns2", |
||||
|
key2:"" |
||||
|
} |
||||
|
]; |
||||
|
import { |
||||
|
mapState |
||||
|
} from 'vuex' |
||||
|
export default { |
||||
|
components: { |
||||
|
'store-name': store_name |
||||
|
}, |
||||
|
computed: { |
||||
|
...mapState({ |
||||
|
storeList: state => state.device.storeList, |
||||
|
curStoreInfo: state => state.device.curStoreInfo, |
||||
|
}), |
||||
|
isDel() { |
||||
|
return (item) => { |
||||
|
return item[2] == "删除" ? "true" : "" |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
infoObj, |
||||
|
latitude: 23.2174411, |
||||
|
longitude: 113.3048267, |
||||
|
update_time:new Date(), |
||||
|
covers: [ |
||||
|
], |
||||
|
} |
||||
|
}, |
||||
|
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: { |
||||
|
clickReboot(){ |
||||
|
let that = this |
||||
|
uni.showModal({ |
||||
|
content: `确认要重启路由 ?`, |
||||
|
success(res) { |
||||
|
console.log("确认", res.confirm) |
||||
|
if(res.confirm){ |
||||
|
that.reboot4G() |
||||
|
} |
||||
|
}, |
||||
|
}) |
||||
|
}, |
||||
|
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.getRouterDetail, |
||||
|
data: { |
||||
|
mac:this.mac, |
||||
|
is_sync:0 |
||||
|
}, |
||||
|
isDefaultGet: false, |
||||
|
}) |
||||
|
.then(res => { |
||||
|
util.hideLoad(); |
||||
|
if (res.data.code == 0) { |
||||
|
that.filterRouterData(res.data.data) |
||||
|
} else { |
||||
|
util.showNone(res.data.message || '操作失败！'); |
||||
|
that.infoObj = "" |
||||
|
} |
||||
|
}) |
||||
|
.catch(err => { |
||||
|
util.hideLoad() |
||||
|
}) |
||||
|
|
||||
|
}, |
||||
|
//过滤路由数据 |
||||
|
filterRouterData(data){ |
||||
|
console.log("filterRouterData:",data); |
||||
|
let obj = this.infoObj |
||||
|
for(var i in obj){ |
||||
|
let e = obj[i] |
||||
|
let res = data[e.key] |
||||
|
if(!res) continue |
||||
|
e.value = (typeof(res)=="object")?data[e.key][e.key2]:res; |
||||
|
} |
||||
|
if(data.clientiplist.length>0){ |
||||
|
data.clientiplist.forEach((e,i)=>{ |
||||
|
console.log(i,e); |
||||
|
obj.push({ |
||||
|
value:e[0], |
||||
|
name:`终端${i+1} IP` |
||||
|
}) |
||||
|
obj.push({ |
||||
|
value:e[1], |
||||
|
name:`终端${i+1} MAC` |
||||
|
}) |
||||
|
}) |
||||
|
} |
||||
|
this.update_time = obj[0].value; |
||||
|
//填充坐标点到地图 |
||||
|
let location_arr = data.position.location.split(",") |
||||
|
this.latitude = location_arr[1]; |
||||
|
this.longitude = location_arr[0]; |
||||
|
this.covers.push({ |
||||
|
latitude: location_arr[1], |
||||
|
longitude: location_arr[0], |
||||
|
width:40, |
||||
|
height:40, |
||||
|
iconPath: '../../static/images/devices/18.png' |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
goBack() { |
||||
|
uni.navigateBack({ |
||||
|
delta: 1 |
||||
|
}) |
||||
|
}, |
||||
|
// 操作接口请求 |
||||
|
operateReq({ |
||||
|
data, |
||||
|
succFun, |
||||
|
isTip = false, |
||||
|
isLoad = true, |
||||
|
|
||||
|
}) { |
||||
|
let that = this |
||||
|
if (isLoad) util.showLoad(); |
||||
|
deviceServer.post({ |
||||
|
url: deviceApi.ouxuanac, |
||||
|
data: data, |
||||
|
isDefaultGet: false, |
||||
|
}) |
||||
|
.then(res => { |
||||
|
if (isLoad) util.hideLoad(); |
||||
|
if (res.data.code == 0) { |
||||
|
if (isTip) util.showNone(res.data.message || '操作成功！'); |
||||
|
succFun(res.data.data) |
||||
|
} else { |
||||
|
if (isTip) util.showNone(res.data.message || '操作失败！'); |
||||
|
} |
||||
|
}) |
||||
|
.catch(err => { |
||||
|
if (isLoad) util.hideLoad() |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
@import '~style/public.scss'; |
||||
|
|
||||
|
.t-router-page { |
||||
|
|
||||
|
.t-title { |
||||
|
font-size: 44rpx; |
||||
|
color: #1A1A1A; |
||||
|
font-weight: 900; |
||||
|
@include centerFlex(space-between); |
||||
|
margin: 60rpx auto 0rpx 40rpx; |
||||
|
.t-reset{ |
||||
|
padding-right: 48rpx; |
||||
|
@include centerFlex(center); |
||||
|
font-size: 32rpx; |
||||
|
color: #009874; |
||||
|
image{ |
||||
|
margin-top: 5rpx; |
||||
|
margin-left: 15rpx; |
||||
|
width: 32rpx; |
||||
|
height: 32rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
.t-update{ |
||||
|
font-size: 28rpx; |
||||
|
color: #9C9C9F; |
||||
|
margin-top: 38rpx; |
||||
|
margin-left: 40rpx; |
||||
|
} |
||||
|
.t-map{ |
||||
|
@include centerFlex(center); |
||||
|
width:700rpx; |
||||
|
// background-color: lightgray; |
||||
|
// height: 450rpx; |
||||
|
margin: 25rpx; |
||||
|
} |
||||
|
.t-box { |
||||
|
height: 500rpx; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
align-items: center; |
||||
|
justify-content: flex-start; |
||||
|
width: 100%; |
||||
|
|
||||
|
.tab-list { |
||||
|
width: 100%; |
||||
|
padding-left: 30rpx; |
||||
|
@include centerFlex(flex-start); |
||||
|
flex-wrap: nowrap; |
||||
|
position: relative; |
||||
|
|
||||
|
.t-item { |
||||
|
margin-right: 50rpx; |
||||
|
padding: 10rpx; |
||||
|
font-size: 32rpx; |
||||
|
font-weight: 900; |
||||
|
color: #9C9C9F; |
||||
|
line-height: 40rpx; |
||||
|
} |
||||
|
|
||||
|
.active { |
||||
|
color: #009874; |
||||
|
@include centerFlex(center); |
||||
|
flex-direction: column; |
||||
|
} |
||||
|
|
||||
|
.active:after { |
||||
|
position: absolute; |
||||
|
content: ""; |
||||
|
background-color: #009874; |
||||
|
color: #009874; |
||||
|
width: auto; |
||||
|
display: block; |
||||
|
width: 30rpx; |
||||
|
text-align: center; |
||||
|
height: 6rpx; |
||||
|
border-radius: 3rpx; |
||||
|
top: 60rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.info-list { |
||||
|
margin-top: 30rpx; |
||||
|
margin-bottom: 50rpx; |
||||
|
width: 700rpx; |
||||
|
height: auto; |
||||
|
background: #FFFFFF; |
||||
|
border-radius: 10rpx; |
||||
|
font-size: 28rpx; |
||||
|
|
||||
|
.i-item { |
||||
|
@include centerFlex(flex-start); |
||||
|
|
||||
|
.i-box { |
||||
|
@include centerFlex(flex-start); |
||||
|
flex-direction: row; |
||||
|
padding: 26rpx 20rpx; |
||||
|
height: 100%; |
||||
|
} |
||||
|
|
||||
|
.i-box:first-child { |
||||
|
width: 250rpx; |
||||
|
text-align: center; |
||||
|
border-right: 1rpx solid #F2F2F7; |
||||
|
} |
||||
|
|
||||
|
.i-box:nth-child(2) { |
||||
|
width: 100%; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
.i-item:not(:last-child) { |
||||
|
border-bottom: 1rpx solid #F2F2F7; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,404 @@ |
|||||
|
<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>目前状态{{sliderLevel}}%</text> |
||||
|
<slider :value="sliderLevel" 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" @click="handleClose"> |
||||
|
<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" @click="handleOpen"> |
||||
|
<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, |
||||
|
sliderLevel:10,//测试回显给10 |
||||
|
sliceLength:0, |
||||
|
boxOne:false, //窗帘关闭方式 true: 从左到右, false:从两边到中间 |
||||
|
} |
||||
|
}, |
||||
|
async onLoad(opts) { |
||||
|
console.log("opts:", opts); |
||||
|
this.mac = opts.mac; |
||||
|
this.updateList() |
||||
|
this.setSliceLength(this.sliderLevel) |
||||
|
// 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 |
||||
|
}) |
||||
|
}, |
||||
|
handleClose(){ |
||||
|
let val = this.sliderLevel>95 ? 100 : this.sliderLevel+5 |
||||
|
this.setSliceLength(val) |
||||
|
}, |
||||
|
handleOpen(){ |
||||
|
|
||||
|
let val = this.sliderLevel<5 ? 0 : this.sliderLevel-5 |
||||
|
this.setSliceLength(val) |
||||
|
}, |
||||
|
setSliceLength(value){ |
||||
|
// this.level = value |
||||
|
this.sliderLevel = 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> |
||||
@ -0,0 +1,336 @@ |
|||||
|
<template> |
||||
|
<view class="timing-page"> |
||||
|
<store-name></store-name> |
||||
|
<view class="t-title">定时列表</view> |
||||
|
<view class="t-box"> |
||||
|
<!-- <view class="tab-list"> |
||||
|
<view class="t-item " :class="e.on?'active':''" v-for="(e,i) in tabArr" @click="clickTab(i)"> |
||||
|
{{e.name}} |
||||
|
</view> |
||||
|
</view> --> |
||||
|
<view class="info-list"> |
||||
|
<view class="i-item" v-for="(item,index) in infoArr"> |
||||
|
<view class="i-box">{{item[0]}}</view> |
||||
|
<rich-text class="i-box" :nodes="item[1]"></rich-text> |
||||
|
<!-- {{item[1]}} --> |
||||
|
<view class="i-box" v-if="isDel(item)" @click="delItem(item,index)" style="color: red;">{{item[2]}}</view> |
||||
|
<view class="i-box" v-else>{{item[2]}}</view> |
||||
|
</view> |
||||
|
</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' |
||||
|
const tabArr = [{ |
||||
|
id: 0, |
||||
|
name: '全部', |
||||
|
path: ``, |
||||
|
on: true |
||||
|
}, |
||||
|
// { |
||||
|
// id: 1, |
||||
|
// name: '照明', |
||||
|
// path: ``, |
||||
|
// on: false |
||||
|
// }, |
||||
|
// { |
||||
|
// id: 2, |
||||
|
// name: '风扇', |
||||
|
// path: ``, |
||||
|
// on: false |
||||
|
// }, |
||||
|
// { |
||||
|
// id: 3, |
||||
|
// name: '水阀', |
||||
|
// path: ``, |
||||
|
// on: false |
||||
|
// }, |
||||
|
]; |
||||
|
const infoArr = [ |
||||
|
["标题", "时间", "操作"], |
||||
|
// ["2号场", "每个星期的 周日6:00 执行 开启 操作", "删除"], |
||||
|
]; |
||||
|
import { |
||||
|
mapState |
||||
|
} from 'vuex' |
||||
|
export default { |
||||
|
components: { |
||||
|
'store-name': store_name |
||||
|
}, |
||||
|
computed: { |
||||
|
...mapState({ |
||||
|
storeList: state => state.device.storeList, |
||||
|
curStoreInfo: state => state.device.curStoreInfo, |
||||
|
}), |
||||
|
isDel() { |
||||
|
return (item) => { |
||||
|
return item[2] == "删除" ? "true" : "" |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
tabArr, |
||||
|
infoArr, |
||||
|
} |
||||
|
}, |
||||
|
async onLoad(opts) { |
||||
|
|
||||
|
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: { |
||||
|
clickTab(i) { |
||||
|
this.tabArr.forEach((item) => { |
||||
|
item.on = false |
||||
|
}) |
||||
|
this.tabArr[i].on = true |
||||
|
}, |
||||
|
//删除计划任务 |
||||
|
delItem(e,i) { |
||||
|
let that = this |
||||
|
let delData = { |
||||
|
"device": this.curStoreInfo.device_name, |
||||
|
"delay": 1, |
||||
|
"data": { |
||||
|
"name": "delete-time-select", |
||||
|
"value": { |
||||
|
"uuid": e[3] |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
uni.showModal({ |
||||
|
content: `确认要删除: ${e[0]}的计划任务 ?`, |
||||
|
success(res) { |
||||
|
console.log("确认删除", res.confirm) |
||||
|
if(res.confirm){ |
||||
|
that.operateReq({ |
||||
|
data: delData, |
||||
|
succFun: (res) => { |
||||
|
that.updateList() |
||||
|
}, |
||||
|
isTip:true |
||||
|
}) |
||||
|
} |
||||
|
}, |
||||
|
}) |
||||
|
}, |
||||
|
async updateList() { |
||||
|
let that = this |
||||
|
let timingData = { |
||||
|
"device": this.curStoreInfo.device_name, |
||||
|
"data": { |
||||
|
"name": "get-time-select", |
||||
|
"value": {} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
this.operateReq({ |
||||
|
data: timingData, |
||||
|
succFun: (list) => { |
||||
|
that.infoArr.length = 1; |
||||
|
list.forEach(async (item,i)=> { |
||||
|
if(item.day_of_week)item.day_of_week = item.day_of_week.sort((a,b)=>a-b);//后端数据未排序 |
||||
|
let timetxt = await that.getTimeTxt(item); |
||||
|
that.infoArr.push([item.expand_value.main.title||"-",timetxt||"-","删除",item.time_arrow_id]) |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
//该函数由后台管理前端提供逻辑, 与后台前端显示逻辑同步 |
||||
|
getTimeTxt(row) { |
||||
|
return new Promise((rs,rj)=>{ |
||||
|
let timeText = "" |
||||
|
if (!row.expand_value) { |
||||
|
rj('error') |
||||
|
} |
||||
|
if (row.type === 'DAY_OF_WEEK' && row.day_of_week) { |
||||
|
let arr = [] |
||||
|
for (let i = 0; i < row.day_of_week.length; i++) { |
||||
|
arr += ' 周' + ['日', '一', '二', '三', '四', '五', '六'][row.day_of_week[i]]; |
||||
|
} |
||||
|
timeText = `每个星期的 <strong>[${arr} ]</strong> ` |
||||
|
} |
||||
|
if (row.type === 'DAY_OF_MONTH' && row.day_of_month) { |
||||
|
let arr = [] |
||||
|
for (let i = 0; i < row.day_of_month.length; i++) { |
||||
|
arr += row.day_of_month[i] + '号 '; |
||||
|
} |
||||
|
timeText = `每个月的 <strong>[ ${arr} ]</strong> ` |
||||
|
} |
||||
|
if (row.type === 'DATE_SLICE' && row.date_slice) { |
||||
|
timeText = ` ${row.date_slice[0].start.substring(0, 10)}~${row.date_slice[0].end.substring(0, 10)}` |
||||
|
} |
||||
|
if (row.times_on_day && row.times_on_day.length) { |
||||
|
timeText += ` 当天<strong>${row.times_on_day[0].substring(0, 5)}</strong>` |
||||
|
} |
||||
|
if (!row.expand_value.main) rs('历史错误结构数据'); |
||||
|
let _status = row.expand_value.main.value.status||row.expand_value.main.data.value.status;//兼容旧数据中的一种情况 |
||||
|
rs(` ${timeText} 执行 ${_status === 'high' ? '<strong style="color:gray;">[关闭]</strong>' : '<strong style="color:#009874;">[开启]</strong>'} 操作`) |
||||
|
}) |
||||
|
|
||||
|
}, |
||||
|
goBack() { |
||||
|
uni.navigateBack({ |
||||
|
delta: 1 |
||||
|
}) |
||||
|
}, |
||||
|
// 操作接口请求 |
||||
|
operateReq({ |
||||
|
data, |
||||
|
succFun, |
||||
|
isTip = false, |
||||
|
isLoad = true, |
||||
|
|
||||
|
}) { |
||||
|
let that = this |
||||
|
if (isLoad) util.showLoad(); |
||||
|
deviceServer.post({ |
||||
|
url: deviceApi.ouxuanac, |
||||
|
data: data, |
||||
|
isDefaultGet: false, |
||||
|
}) |
||||
|
.then(res => { |
||||
|
if (isLoad) util.hideLoad(); |
||||
|
if (res.data.code == 0) { |
||||
|
if (isTip) util.showNone(res.data.message || '操作成功！'); |
||||
|
succFun(res.data.data) |
||||
|
} else { |
||||
|
if (isTip) util.showNone(res.data.message || '操作失败！'); |
||||
|
} |
||||
|
}) |
||||
|
.catch(err => { |
||||
|
if (isLoad) util.hideLoad() |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
@import '~style/public.scss'; |
||||
|
|
||||
|
.timing-page { |
||||
|
|
||||
|
.t-title { |
||||
|
font-size: 44rpx; |
||||
|
color: #1A1A1A; |
||||
|
font-weight: 900; |
||||
|
margin: 60rpx auto 72rpx 40rpx; |
||||
|
} |
||||
|
|
||||
|
.t-box { |
||||
|
height: 500rpx; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
align-items: center; |
||||
|
justify-content: flex-start; |
||||
|
width: 100%; |
||||
|
|
||||
|
.tab-list { |
||||
|
width: 100%; |
||||
|
padding-left: 30rpx; |
||||
|
@include centerFlex(flex-start); |
||||
|
flex-wrap: nowrap; |
||||
|
position: relative; |
||||
|
|
||||
|
.t-item { |
||||
|
margin-right: 50rpx; |
||||
|
padding: 10rpx; |
||||
|
font-size: 32rpx; |
||||
|
font-weight: 900; |
||||
|
color: #9C9C9F; |
||||
|
line-height: 40rpx; |
||||
|
} |
||||
|
|
||||
|
.active { |
||||
|
color: #009874; |
||||
|
@include centerFlex(center); |
||||
|
flex-direction: column; |
||||
|
} |
||||
|
|
||||
|
.active:after { |
||||
|
position: absolute; |
||||
|
content: ""; |
||||
|
background-color: #009874; |
||||
|
color: #009874; |
||||
|
width: auto; |
||||
|
display: block; |
||||
|
width: 30rpx; |
||||
|
text-align: center; |
||||
|
height: 6rpx; |
||||
|
border-radius: 3rpx; |
||||
|
margin-top: 40rpx; |
||||
|
// top: 60rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.info-list { |
||||
|
margin-top: 30rpx; |
||||
|
margin-bottom: 50rpx; |
||||
|
width: 700rpx; |
||||
|
height: auto; |
||||
|
background: #FFFFFF; |
||||
|
border-radius: 10rpx; |
||||
|
font-size: 28rpx; |
||||
|
|
||||
|
.i-item { |
||||
|
@include centerFlex(space-between); |
||||
|
|
||||
|
.i-box { |
||||
|
@include centerFlex(center); |
||||
|
flex-direction: row; |
||||
|
padding: 26rpx 10rpx; |
||||
|
height: 100%; |
||||
|
} |
||||
|
|
||||
|
.i-box:first-child { |
||||
|
// width: 176rpx; |
||||
|
width: 300rpx; |
||||
|
} |
||||
|
|
||||
|
.i-box:nth-child(2) { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
border: 1rpx solid #F2F2F7; |
||||
|
border-bottom: none; |
||||
|
border-top: none; |
||||
|
} |
||||
|
|
||||
|
.i-box:last-child { |
||||
|
width: 114rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.i-item:not(:last-child) { |
||||
|
border-bottom: 1rpx solid #F2F2F7; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,701 @@ |
|||||
|
<template> |
||||
|
<view class="timing-page"> |
||||
|
<!-- <store-name></store-name> --> |
||||
|
<view class="t-title">{{switchInfo.hardware_name}}定时</view> |
||||
|
<view class="t-box"> |
||||
|
|
||||
|
<view class="info-list"> |
||||
|
<view class="il-switch"> |
||||
|
<text class="">时间动作</text> |
||||
|
<view class="" @click="tapSwitch">开 |
||||
|
<view class="un-select" v-if="!on"></view> |
||||
|
<image v-else class="" src="../../../../static/images/icon/retail/choose.png" mode=""></image> |
||||
|
</view> |
||||
|
<view class="" @click="tapSwitch">关 |
||||
|
<view class="un-select" v-if="on"></view> |
||||
|
<image v-else src="../../../../static/images/icon/retail/choose.png" mode=""></image> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="il-select"> |
||||
|
<text class="">时间类型</text> |
||||
|
<picker @change="bindPickerChangeSingle" :value="sIndex" :range="singleArr"> |
||||
|
<view class="il-input"> |
||||
|
<text>{{singleArr[sIndex]}}</text><image src="../../../../static/images/icon/arrow_b2.png" mode=""></image> |
||||
|
</view> |
||||
|
</picker> |
||||
|
</view> |
||||
|
<view class="il-select-week" v-if="sIndex==0"> |
||||
|
<block v-for="(e,i) in weekArrSelect" :key="i"> |
||||
|
<view class="" :class="e?'active':''" @click="clickWeekTab(i)">星期{{weekArrCN[i]}}</view> |
||||
|
</block> |
||||
|
</view> |
||||
|
|
||||
|
<block v-if="sIndex==1"> |
||||
|
<view class="il-select" > |
||||
|
<text class="">具体日期</text> |
||||
|
<!-- <picker @change="bindPickerChangeDay" :value="dIndex" :range="dayArr"> --> |
||||
|
<view class="il-input" @click="padConfig.show = true"> |
||||
|
<text>请点击选择</text><image src="../../../../static/images/icon/arrow_b2.png" mode=""></image> |
||||
|
</view> |
||||
|
<!-- </picker> --> |
||||
|
</view> |
||||
|
<view class="il-select-week"> |
||||
|
<block v-for="(e,i) in dayArrSelect" :key="i"> |
||||
|
<view v-if="e" class="" :class="e?'active':''" @click="">{{i+1}} 号</view> |
||||
|
</block> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<view class="il-select-double" v-if="sIndex==2"> |
||||
|
<text class="">具体时间段</text> |
||||
|
<view class="il-input"> |
||||
|
<picker mode="date" :value="startTime" :start="startDate" :end="endDate" @change="bindTimeChangeStart"> |
||||
|
<text>{{startTime?startTime+'起':'请选择开始时间'}}</text> |
||||
|
</picker> |
||||
|
<view class="">至</view> |
||||
|
<picker mode="date" :value="endTime" :start="startDate" :end="endDate" @change="bindTimeChangeEnd"> |
||||
|
<text>{{endTime?endTime+"止":"请选择结束时间"}}</text> |
||||
|
</picker> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="il-select"> |
||||
|
<text class="">时间点</text> |
||||
|
<picker mode="time" :value="time" start="09:01" end="21:01" @change="bindTimeChange"> |
||||
|
<view class="il-input"> |
||||
|
<text>{{time}}</text><image src="../../../../static/images/icon/arrow_b2.png" mode=""></image> |
||||
|
</view> |
||||
|
</picker> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
<view class="save-btn" @click="saveAdd">保存</view> |
||||
|
<view class="bottom-tips">保存后发布后将会以最新的定时更新到欧轩智能中控，设备首页<text>定时列表</text>可查看最新发布</view> |
||||
|
</view> |
||||
|
|
||||
|
|
||||
|
<!-- 日期天多选选择弹框 --> |
||||
|
<view class="voice_control_pad" v-if="padConfig.show" @touchmove.stop.prevent="(()=>{})"> |
||||
|
<view class="cover_bg" @click.stop="padConfig.show=false" @touchmove.stop.prevent="(()=>{})"></view> |
||||
|
<view class="v_box" > |
||||
|
<scroll-view scroll-y="true" > |
||||
|
<view class="il-select-week"> |
||||
|
<block v-for="(e,i) in dayArrSelect" :key="i"> |
||||
|
<view class="" :class="e?'active':''" @click.stop="clickDaysTab(i)">{{i+1}} 号</view> |
||||
|
</block> |
||||
|
</view> |
||||
|
</scroll-view> |
||||
|
|
||||
|
<view class="v_btns"> |
||||
|
<view class="voice_btn btn_green" @click="padConfig.show=false">确认</view> |
||||
|
</view> |
||||
|
</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' |
||||
|
const tabArr = [{ |
||||
|
id: 0, |
||||
|
name: '全部', |
||||
|
path: ``, |
||||
|
on: true |
||||
|
}, |
||||
|
]; |
||||
|
const weekArrCN = ["日", "一", "二","三","四","五","六"]; |
||||
|
import { |
||||
|
mapState |
||||
|
} from 'vuex' |
||||
|
export default { |
||||
|
components: { |
||||
|
'store-name': store_name |
||||
|
}, |
||||
|
computed: { |
||||
|
...mapState({ |
||||
|
storeList: state => state.device.storeList, |
||||
|
curStoreInfo: state => state.device.curStoreInfo, |
||||
|
}), |
||||
|
isDel() { |
||||
|
return (item) => { |
||||
|
return item[2] == "删除" ? "true" : "" |
||||
|
} |
||||
|
}, |
||||
|
startDate() { |
||||
|
return this.getDate('start'); |
||||
|
}, |
||||
|
endDate() { |
||||
|
return this.getDate('end'); |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
const currentDate = this.getDate({ |
||||
|
format: true |
||||
|
}) |
||||
|
const dayArrSelect = (()=>{ |
||||
|
let days = [] |
||||
|
for(var i=1;i<=31;i++){ |
||||
|
days.push(false) |
||||
|
} |
||||
|
return days |
||||
|
})() |
||||
|
return { |
||||
|
switchInfo:"",//上层页面的选择信息 |
||||
|
on:false, |
||||
|
singleArr:["星期","具体日期","具体时间段"], |
||||
|
sIndex:0, |
||||
|
dayArrSelect:dayArrSelect,//31天 选择 |
||||
|
dIndex:0, |
||||
|
weekArrCN, |
||||
|
weekArrSelect:[false,false,false,false,false,false,false], |
||||
|
date: currentDate, |
||||
|
time: '00:00-', |
||||
|
startTime:"", |
||||
|
endTime:"", |
||||
|
padConfig:{ |
||||
|
show:false, |
||||
|
data:[] |
||||
|
}, |
||||
|
reqData:{//定时请求中控参数 调用sendPacket时传递参数 switchData->postData->reqData(最终请求数据) |
||||
|
"device": "00-10-7a-0f-6d-7a", |
||||
|
"delay": 1, |
||||
|
"data": { |
||||
|
"name": "set-time-select", |
||||
|
"value": { |
||||
|
"data": "传入设置的json格式字符串,例如:{\"time_arrow_id\":\"c8c39f5c-8dd4-11eb-9aad-4e965989bbce\",\"group\":\"RPIO\",\"type\":\"DAY_OF_WEEK\",\"day_of_week\":[0,1,2,3,6,5,4],\"day_of_month\":null,\"date_slice\":[{\"start\":\"\",\"end\":\"\"}],\"times_on_day\":[\"10:13:00-10:13:10\"],\"expand_tags\":null,\"expand_value\":{\"main\":{\"name\":\"set-rpio\",\"title\":\"测试中控照明9\",\"value\":{\"id\":\"9\",\"status\":\"high\"}}},\"weights\":0,\"extension\":null}" |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
postData:{//定时参数消息结构 reqData.data.value |
||||
|
"time_arrow_id": "", //不用填 留空 |
||||
|
"group": "RPIO", //照明,风扇,空调固定值,其它不确定 |
||||
|
"type": "DAY_OF_WEEK", //DAY_OF_WEEK/DAY_OF_MONTH/DATE_SLICE , 对应 周,月,单独时间. |
||||
|
"day_of_week": [ |
||||
|
], |
||||
|
"day_of_month": null, //数组 |
||||
|
"date_slice": [ |
||||
|
{ |
||||
|
"start": "", |
||||
|
"end": "" |
||||
|
} |
||||
|
], |
||||
|
"times_on_day": [//时间点 |
||||
|
// "10:13:00-10:13:10" //后台要求,10s期间 |
||||
|
], |
||||
|
"expand_tags": null, |
||||
|
"expand_value": { |
||||
|
"main": { //中控指令 |
||||
|
"name": "set-rpio", |
||||
|
"title": "", |
||||
|
"value": { |
||||
|
"id": "",//设备id |
||||
|
"status": "high" //low:开, high:关 |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
"weights": 0,//权重 |
||||
|
"extension": null |
||||
|
}, |
||||
|
switchData:"",//开关请求中控参数 postData.expand_value.main |
||||
|
|
||||
|
} |
||||
|
}, |
||||
|
async onLoad(option) { |
||||
|
this.handleOpts(option); |
||||
|
}, |
||||
|
onShow() { |
||||
|
// this.updateList() //更新中控信息 |
||||
|
}, |
||||
|
watch: { |
||||
|
curStoreInfo(newVal, oldVal){ |
||||
|
// this.infoArr.length = 1 |
||||
|
// this.updateList() |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
//处理参数 |
||||
|
handleOpts(option){ |
||||
|
let switchInfo = JSON.parse(decodeURIComponent(option.switchInfo)); |
||||
|
this.switchInfo = switchInfo //该选择控制设备的所有数据 (目前只使用了hardware_name) |
||||
|
this.switchData = switchInfo.switchData //开关关联数据 |
||||
|
|
||||
|
//去掉店铺切换功能 |
||||
|
// try { |
||||
|
// util.showLoad(); |
||||
|
// let _brandInfo = await this.$store.dispatch('getBrandInfo'); |
||||
|
// await this.$store.dispatch('getStoreList'); |
||||
|
// util.hideLoad(); |
||||
|
// } catch (err) { |
||||
|
// util.hideLoad(); |
||||
|
// } |
||||
|
}, |
||||
|
//点击保存按钮 |
||||
|
saveAdd(){ //switchData(开关命令数据)->postData(后台定时接口数据)->reqData(组成最终小程序端中控定时数据) |
||||
|
let {switchData,postData,reqData,curStoreInfo,sIndex,time,getWeekRes,getMonthDaysRes,getSliceRes,getDayTimeRes,sendDataToVC} = this; |
||||
|
|
||||
|
// ["星期","具体日期","具体时间段"], |
||||
|
if(sIndex==0)postData.day_of_week = getWeekRes(); // |
||||
|
if(sIndex==1)postData.day_of_month = getMonthDaysRes(); //当月的多选某天 |
||||
|
if(sIndex==2)postData.date_slice = getSliceRes(); // |
||||
|
|
||||
|
if(time=="00:00-") return util.showNone("请先选择定时时间点!") |
||||
|
postData.times_on_day = getDayTimeRes(); //时间点,固定要传 |
||||
|
|
||||
|
switchData.data.title = `${this.switchInfo.hardware_name}-${this.singleArr[this.sIndex]}定时`; |
||||
|
postData.expand_value.main = switchData.data; |
||||
|
reqData.device = switchData.device |
||||
|
reqData.data.value.data = JSON.stringify(postData) |
||||
|
|
||||
|
console.log("reqData:",JSON.stringify(reqData)); |
||||
|
|
||||
|
uni.showModal({ |
||||
|
content: `确认要设置${curStoreInfo.venue_name}中 [ ${this.switchInfo.hardware_name} ] 的[ ${this.singleArr[this.sIndex]} ]计划任务 ?`, |
||||
|
success(res) { |
||||
|
console.log("确认执行", res.confirm) |
||||
|
if(res.confirm){ |
||||
|
sendDataToVC(); |
||||
|
} |
||||
|
}, |
||||
|
}) |
||||
|
|
||||
|
}, |
||||
|
getWeekRes(){ |
||||
|
console.log(this.weekArrSelect); |
||||
|
let res = [] |
||||
|
this.weekArrSelect.forEach((e,i)=>{ |
||||
|
if(e)res.push(i) |
||||
|
}) |
||||
|
return res |
||||
|
}, |
||||
|
getMonthDaysRes(){ |
||||
|
let res = [] |
||||
|
this.dayArrSelect.forEach((e,i)=>{ |
||||
|
if(e)res.push(i+1) |
||||
|
}) |
||||
|
return res |
||||
|
}, |
||||
|
getSliceRes(){ |
||||
|
let res = [],{startTime,endTime} = this; |
||||
|
if(startTime&&endTime){ |
||||
|
res.push({ |
||||
|
"start": startTime, |
||||
|
"end": endTime |
||||
|
}) |
||||
|
}else{ |
||||
|
res.push({ |
||||
|
"start": "", |
||||
|
"end": "" |
||||
|
}) |
||||
|
} |
||||
|
return res |
||||
|
}, |
||||
|
getDayTimeRes(){ |
||||
|
let res = [] |
||||
|
res.push( `${this.time}:00-${this.time}:10`) |
||||
|
return res |
||||
|
}, |
||||
|
tapSwitch(){ //开关切换 |
||||
|
this.on = !this.on |
||||
|
this.switchData.data.value.status = this.on? "low":"high"; |
||||
|
}, |
||||
|
clickWeekTab(index) { |
||||
|
if(this.weekArrSelect[index]) { |
||||
|
this.$set(this.weekArrSelect,index,false) |
||||
|
}else{ |
||||
|
this.$set(this.weekArrSelect,index,true) |
||||
|
} |
||||
|
}, |
||||
|
clickDaysTab(index) { |
||||
|
if(this.dayArrSelect[index]) { |
||||
|
this.$set(this.dayArrSelect,index,false) |
||||
|
}else{ |
||||
|
this.$set(this.dayArrSelect,index,true) |
||||
|
} |
||||
|
}, |
||||
|
bindPickerChangeSingle(e){ |
||||
|
console.log('bindPickerChangeSingle，携带值为', e.target.value) |
||||
|
this.sIndex = e.target.value |
||||
|
// DAY_OF_WEEK/DAY_OF_MONTH/DATE_SLICE |
||||
|
this.postData.type = ['DAY_OF_WEEK','DAY_OF_MONTH','DATE_SLICE'][e.target.value] |
||||
|
this.resetPostData(); |
||||
|
}, |
||||
|
resetPostData(){ //重置选择数据为原始状态 |
||||
|
let _reset = { |
||||
|
"day_of_week": [ |
||||
|
], |
||||
|
"day_of_month": null, //数组 |
||||
|
"date_slice": [{ |
||||
|
"start": "", |
||||
|
"end": "" |
||||
|
} |
||||
|
],} |
||||
|
for(var i in _reset){ |
||||
|
console.log("重置:",i); |
||||
|
this.postData[i] = _reset[i] |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
bindTimeChange(e){ //时间选择 |
||||
|
this.time = e.target.value |
||||
|
}, |
||||
|
bindTimeChangeStart(e){ //日期选择 |
||||
|
if(new Date(this.endTime)-new Date(e.target.value)<0) return util.showNone("开始时间异常") |
||||
|
this.startTime = e.target.value |
||||
|
}, |
||||
|
bindTimeChangeEnd(e){ //日期选择 |
||||
|
if(new Date(e.target.value)-new Date(this.startTime)<0) return util.showNone("结束时间异常") |
||||
|
this.endTime = e.target.value |
||||
|
}, |
||||
|
bindPickerChangeDay(e){ //月选择 |
||||
|
console.log('bindPickerChangeDay，携带值为', e.target.value) |
||||
|
this.dIndex = e.target.value |
||||
|
}, |
||||
|
//删除计划任务 |
||||
|
delItem(e,i) { |
||||
|
let that = this |
||||
|
let delData = { |
||||
|
"device": this.curStoreInfo.device_name, |
||||
|
"delay": 1, |
||||
|
"data": { |
||||
|
"name": "delete-time-select", |
||||
|
"value": { |
||||
|
"uuid": e[3] |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
uni.showModal({ |
||||
|
content: `确认要删除: ${e[0]}的计划任务 ?`, |
||||
|
success(res) { |
||||
|
console.log("确认删除", res.confirm) |
||||
|
if(res.confirm){ |
||||
|
that.operateReq({ |
||||
|
data: delData, |
||||
|
succFun: (res) => { |
||||
|
that.updateList() |
||||
|
}, |
||||
|
isTip:true |
||||
|
}) |
||||
|
} |
||||
|
}, |
||||
|
}) |
||||
|
}, |
||||
|
getDate(type) { |
||||
|
const date = new Date(); |
||||
|
let year = date.getFullYear(); |
||||
|
let month = date.getMonth() + 1; |
||||
|
let day = date.getDate(); |
||||
|
|
||||
|
if (type === 'start') { |
||||
|
year = year - 0; |
||||
|
} else if (type === 'end') { |
||||
|
year = year + 10;//限制可选10年内 |
||||
|
} |
||||
|
month = month > 9 ? month : '0' + month;; |
||||
|
day = day > 9 ? day : '0' + day; |
||||
|
return `${year}-${month}-${day}`; |
||||
|
}, |
||||
|
async sendDataToVC() { |
||||
|
let that = this |
||||
|
let timingData = { |
||||
|
} |
||||
|
timingData = this.reqData |
||||
|
|
||||
|
this.operateReq({ |
||||
|
data: timingData, |
||||
|
succFun: (res) => { |
||||
|
console.log("操作结果:",res); |
||||
|
if(res=="ok"){ |
||||
|
let timing_list = "/subpackage/device/pages/timing/timing_list" |
||||
|
util.routeTo(`${timing_list}`, 'nT'); |
||||
|
} |
||||
|
}, |
||||
|
isTip:true |
||||
|
}) |
||||
|
}, |
||||
|
goBack() { |
||||
|
uni.navigateBack({ |
||||
|
delta: 1 |
||||
|
}) |
||||
|
}, |
||||
|
// 操作接口请求 |
||||
|
operateReq({ |
||||
|
data, |
||||
|
succFun, |
||||
|
isTip = false, |
||||
|
isLoad = true, |
||||
|
|
||||
|
}) { |
||||
|
let that = this |
||||
|
if (isLoad) util.showLoad(); |
||||
|
deviceServer.post({ |
||||
|
url: deviceApi.ouxuanac, |
||||
|
data: data, |
||||
|
isDefaultGet: false, |
||||
|
}) |
||||
|
.then(res => { |
||||
|
if (isLoad) util.hideLoad(); |
||||
|
if (res.data.code == 0) { |
||||
|
if (isTip) util.showNone(res.data.message || '操作成功！'); |
||||
|
succFun(res.data.data) |
||||
|
} else { |
||||
|
if (isTip) util.showNone(res.data.message || '操作失败！'); |
||||
|
} |
||||
|
}) |
||||
|
.catch(err => { |
||||
|
if (isLoad) util.hideLoad() |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss"> |
||||
|
@import '~style/public.scss'; |
||||
|
|
||||
|
.timing-page { |
||||
|
|
||||
|
.t-title { |
||||
|
font-size: 44rpx; |
||||
|
color: #1A1A1A; |
||||
|
font-weight: 900; |
||||
|
margin: 60rpx auto 72rpx 40rpx; |
||||
|
} |
||||
|
|
||||
|
.t-box { |
||||
|
height: 500rpx; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
align-items: center; |
||||
|
justify-content: flex-start; |
||||
|
width: 100%; |
||||
|
|
||||
|
.info-list { |
||||
|
margin-bottom: 50rpx; |
||||
|
padding: 50rpx 30rpx; |
||||
|
width: 700rpx; |
||||
|
height: auto; |
||||
|
background: #FFFFFF; |
||||
|
border-radius: 10rpx; |
||||
|
font-size: 32rpx; |
||||
|
.il-switch{ |
||||
|
width: 580rpx; |
||||
|
@include centerFlex(space-between); |
||||
|
> view{ |
||||
|
@include centerFlex(center); |
||||
|
image{ |
||||
|
margin-left: 20rpx; |
||||
|
width: 40rpx;height: 40rpx; |
||||
|
} |
||||
|
.un-select{ |
||||
|
margin-left: 20rpx; |
||||
|
background-color: white; |
||||
|
width: 40rpx;height: 40rpx; |
||||
|
border-radius: 50%; |
||||
|
border: 2rpx solid lightgray; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
.il-select{ |
||||
|
margin-top: 50rpx; |
||||
|
width: 100%; |
||||
|
@include centerFlex(space-between); |
||||
|
.il-input { |
||||
|
@include centerFlex(space-between); |
||||
|
padding: 20rpx; |
||||
|
margin-left: 20rpx; |
||||
|
width: 480rpx; |
||||
|
height: 96rpx; |
||||
|
background: #FFFFFF; |
||||
|
border: 2rpx solid #D8D8D8; |
||||
|
border-radius: 10rpx; |
||||
|
text{ |
||||
|
color: #9C9C9F; |
||||
|
} |
||||
|
image{ |
||||
|
width: 28rpx; |
||||
|
height: 28rpx; |
||||
|
transform: rotate(90deg); |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.il-select-double{ |
||||
|
margin-top: 50rpx; |
||||
|
width: 100%; |
||||
|
@include centerFlex(flex-start); |
||||
|
align-items: flex-start; |
||||
|
flex-direction: column; |
||||
|
.il-input { |
||||
|
@include centerFlex(space-between); |
||||
|
padding: 20rpx; |
||||
|
margin-top: 20rpx; |
||||
|
width: 648rpx; |
||||
|
height: 96rpx; |
||||
|
background: #FFFFFF; |
||||
|
border: 2rpx solid #D8D8D8; |
||||
|
border-radius: 10rpx; |
||||
|
text{ |
||||
|
color: #9C9C9F; |
||||
|
} |
||||
|
> view{ |
||||
|
padding: 0 10rpx; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
.il-select-week{ |
||||
|
width: 100%; |
||||
|
height: auto; |
||||
|
@include centerFlex(flex-start); |
||||
|
flex-wrap: wrap; |
||||
|
> view{ |
||||
|
@include centerFlex(center); |
||||
|
width: 160rpx; |
||||
|
height: 88rpx; |
||||
|
border: 2rpx solid #979797; |
||||
|
border-radius: 6rpx; |
||||
|
color: #979797; |
||||
|
margin-left: 40rpx; |
||||
|
margin-top: 40rpx; |
||||
|
} |
||||
|
.active{ |
||||
|
background: rgba(0,152,116,0.12); |
||||
|
border: 2rpx solid #009874;color: #009874; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
// 底部css |
||||
|
.save-btn{ |
||||
|
width: 700rpx; |
||||
|
height: 110rpx; |
||||
|
text-align: center; |
||||
|
line-height: 110rpx; |
||||
|
background: #009874; |
||||
|
border-radius: 10px; |
||||
|
color: white; |
||||
|
} |
||||
|
.bottom-tips{ |
||||
|
font-size: 28rpx; |
||||
|
color: #1A1A1A; |
||||
|
text{ |
||||
|
color: #009874; |
||||
|
} |
||||
|
margin: 40rpx; |
||||
|
} |
||||
|
|
||||
|
//弹窗选择 |
||||
|
.voice_control_pad { |
||||
|
position: fixed; |
||||
|
top: 0; |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
z-index: 1; |
||||
|
.cover_bg { |
||||
|
position: fixed; |
||||
|
top: 0; |
||||
|
background: rgba($color: #000000, $alpha: .3); |
||||
|
z-index: 2; |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
||||
|
.v_box { |
||||
|
z-index: 3; |
||||
|
width: 630rpx; |
||||
|
background-color: white; |
||||
|
border-radius: 10rpx; |
||||
|
scroll-view{ |
||||
|
margin-top: 30rpx; |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
justify-content: flex-start; |
||||
|
align-items: flex-start; |
||||
|
border-radius: 5rpx; |
||||
|
flex-wrap: wrap; |
||||
|
width: 100%; |
||||
|
height: 700rpx; |
||||
|
border-bottom: 1rpx solid #F2F2F7; |
||||
|
|
||||
|
.il-select-week{ |
||||
|
width: 100%; |
||||
|
height: auto; |
||||
|
@include centerFlex(flex-start); |
||||
|
flex-wrap: wrap; |
||||
|
> view{ |
||||
|
@include centerFlex(center); |
||||
|
width: 160rpx; |
||||
|
height: 88rpx; |
||||
|
border: 2rpx solid #979797; |
||||
|
border-radius: 6rpx; |
||||
|
color: #979797; |
||||
|
margin-left: 40rpx; |
||||
|
margin-top: 40rpx; |
||||
|
} |
||||
|
.active{ |
||||
|
background: rgba(0,152,116,0.12); |
||||
|
border: 2rpx solid #009874;color: #009874; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
.voice_btn { |
||||
|
width: 392rpx; |
||||
|
height: 112rpx; |
||||
|
background: #009874; |
||||
|
border-radius: 5rpx; |
||||
|
text-align: center; |
||||
|
line-height: 112rpx; |
||||
|
color: white; |
||||
|
font-size: 32rpx; |
||||
|
} |
||||
|
|
||||
|
.btn_active { |
||||
|
color: black; |
||||
|
background-color: rgba($color: #000000, $alpha: .4); |
||||
|
} |
||||
|
|
||||
|
.btn_white { |
||||
|
width: 204rpx; |
||||
|
height: 88rpx; |
||||
|
background-color: white; |
||||
|
color: #009874; |
||||
|
border: 1rpx solid #009874; |
||||
|
line-height: 88rpx; |
||||
|
} |
||||
|
|
||||
|
.btn_green { |
||||
|
width: 204rpx; |
||||
|
height: 88rpx; |
||||
|
background-color: #009874; |
||||
|
color: white; |
||||
|
line-height: 88rpx; |
||||
|
} |
||||
|
|
||||
|
.v_btns { |
||||
|
width: 100%; |
||||
|
display: flex; |
||||
|
flex-direction: row; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
margin: 50rpx 0; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
</style> |
||||
|
After Width: 14 | Height: 14 | Size: 311 B |
|
After Width: 20 | Height: 20 | Size: 395 B |
|
After Width: 80 | Height: 80 | Size: 3.0 KiB |
|
After Width: 80 | Height: 80 | Size: 1.7 KiB |
|
After Width: 80 | Height: 80 | Size: 4.8 KiB |
|
After Width: 80 | Height: 80 | Size: 1.3 KiB |
|
After Width: 200 | Height: 200 | Size: 11 KiB |
|
After Width: 200 | Height: 200 | Size: 9.9 KiB |
|
After Width: 103 | Height: 50 | Size: 2.9 KiB |
|
After Width: 102 | Height: 100 | Size: 2.4 KiB |
|
After Width: 103 | Height: 50 | Size: 2.9 KiB |
|
After Width: 14 | Height: 14 | Size: 512 B |
|
After Width: 187 | Height: 155 | Size: 16 KiB |
|
After Width: 100 | Height: 100 | Size: 6.3 KiB |
|
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: 100 | Height: 100 | Size: 5.1 KiB |
|
After Width: 1014 | Height: 696 | Size: 39 KiB |
Write
Preview
Loading…
Cancel
Save
Reference in new issue