|
|
|
@ -4,7 +4,7 @@
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="row" v-if="ViewModel">
|
|
|
|
|
<div class="col-md-6" v-if="HasCameras()">
|
|
|
|
|
<div class="col-md-6" v-if="HasDevices('摄像头')">
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="box box-solid">
|
|
|
|
|
<select class="form-control" id="camera" @change="CameraSelected">
|
|
|
|
@ -139,7 +139,7 @@
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-md-6 control">
|
|
|
|
|
<div class="col-md-6 control" v-if="HasDevices('一路开关')">
|
|
|
|
|
<div class="box box-solid">
|
|
|
|
|
<div class="box-header with-border">
|
|
|
|
|
<h3 class="box-title"><img src="/images/switch2.png" style="height:18px;margin-right:10px;" />一路开关</h3>
|
|
|
|
@ -164,7 +164,7 @@
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-md-6 control">
|
|
|
|
|
<div class="col-md-6 control" v-if="HasDevices('三路开关')">
|
|
|
|
|
<div class="box box-solid">
|
|
|
|
|
<div class="box-header with-border">
|
|
|
|
|
<h3 class="box-title"><img src="/images/switch2.png" style="height:18px;margin-right:10px;" />三路开关</h3>
|
|
|
|
@ -193,7 +193,7 @@
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-md-6 control">
|
|
|
|
|
<div class="col-md-6 control" v-if="HasDevices('插座')">
|
|
|
|
|
<div class="box box-solid">
|
|
|
|
|
<div class="box-header with-border">
|
|
|
|
|
<h3 class="box-title"><img src="/images/switch2.png" style="height:18px;margin-right:10px;" />插座</h3>
|
|
|
|
@ -211,6 +211,8 @@
|
|
|
|
|
</div>
|
|
|
|
|
<div class="row" style="text-align:center;">
|
|
|
|
|
{{device.DisplayName||device.Name}}
|
|
|
|
|
<br />
|
|
|
|
|
{{GetDataValue(device.Number,'电量')}} 度
|
|
|
|
|
</div>
|
|
|
|
|
<br />
|
|
|
|
|
</div>
|
|
|
|
@ -220,49 +222,47 @@
|
|
|
|
|
</div>
|
|
|
|
|
<template v-for="device in GetDevices('调色灯')">
|
|
|
|
|
<div class="col-md-6 control">
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="box box-solid btns">
|
|
|
|
|
<div class="box-header with-border">
|
|
|
|
|
<h3 class="box-title"><img src="/images/light2.png" style="height:18px;margin-right:10px;" />{{device.DisplayName||device.Name}}</h3>
|
|
|
|
|
<div class="box-tools pull-right">
|
|
|
|
|
<img v-if="GetDataValue(device.Number,'状态')=='开'" @click="CallApi(device.Number,'/ColorLight/Off')" src="/images/on.png" />
|
|
|
|
|
<img v-if="GetDataValue(device.Number,'状态')=='关'" @click="CallApi(device.Number,'/ColorLight/On')" src="/images/off.png" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="box box-solid btns">
|
|
|
|
|
<div class="box-header with-border">
|
|
|
|
|
<h3 class="box-title"><img src="/images/light2.png" style="height:18px;margin-right:10px;" />{{device.DisplayName||device.Name}}</h3>
|
|
|
|
|
<div class="box-tools pull-right">
|
|
|
|
|
<img v-if="GetDataValue(device.Number,'状态')=='开'" @click="CallApi(device.Number,'/ColorLight/Off')" src="/images/on.png" />
|
|
|
|
|
<img v-if="GetDataValue(device.Number,'状态')=='关'" @click="CallApi(device.Number,'/ColorLight/On')" src="/images/off.png" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="box-body">
|
|
|
|
|
<form method="get" action="/App/Exec">
|
|
|
|
|
<input type="hidden" name="Number" :value="device.Number" />
|
|
|
|
|
<input type="hidden" name="Method" value="/ColorLight/SetBrightness" />
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-md-2">
|
|
|
|
|
<span class="label1">亮度</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-md-10">
|
|
|
|
|
<input @change="AjaxSubmit($event,device.Number,'亮度')" type="range" min="0" step="1" max="255" name="Brightness" :value="GetDataValue(device.Number,'亮度')" />
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="box-body">
|
|
|
|
|
<form method="get" action="/App/Exec">
|
|
|
|
|
<input type="hidden" name="Number" :value="device.Number" />
|
|
|
|
|
<input type="hidden" name="Method" value="/ColorLight/SetBrightness" />
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-md-2">
|
|
|
|
|
<span class="label1">亮度</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-md-10">
|
|
|
|
|
<input @change="AjaxSubmit($event,device.Number,'亮度')" type="range" min="0" step="1" max="255" name="Brightness" :value="GetDataValue(device.Number,'亮度')" />
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</form>
|
|
|
|
|
<form method="get" action="/App/Exec">
|
|
|
|
|
<input type="hidden" name="Number" :value="device.Number" />
|
|
|
|
|
<input type="hidden" name="Method" value="/ColorLight/SetColor" />
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-md-2">
|
|
|
|
|
<span class="label1">色调</span>
|
|
|
|
|
</div>
|
|
|
|
|
</form>
|
|
|
|
|
<form method="get" action="/App/Exec">
|
|
|
|
|
<input type="hidden" name="Number" :value="device.Number" />
|
|
|
|
|
<input type="hidden" name="Method" value="/ColorLight/SetColor" />
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-md-2">
|
|
|
|
|
<span class="label1">色调</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-md-10">
|
|
|
|
|
<input @change="AjaxSubmit($event,device.Number,'色调')" type="range" min="0" step="1" max="255" name="Hue" :value="GetDataValue(device.Number,'色调')" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-md-10">
|
|
|
|
|
<input @change="AjaxSubmit($event,device.Number,'色调')" type="range" min="0" step="1" max="255" name="Hue" :value="GetDataValue(device.Number,'色调')" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-md-2">
|
|
|
|
|
<span class="label1">饱和度</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-md-10">
|
|
|
|
|
<input @change="AjaxSubmit($event,device.Number,'饱和度')" type="range" min="0" step="1" max="255" name="Saturation" :value="GetDataValue(device.Number,'饱和度')" />
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-md-2">
|
|
|
|
|
<span class="label1">饱和度</span>
|
|
|
|
|
</div>
|
|
|
|
|
</form>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="col-md-10">
|
|
|
|
|
<input @change="AjaxSubmit($event,device.Number,'饱和度')" type="range" min="0" step="1" max="255" name="Saturation" :value="GetDataValue(device.Number,'饱和度')" />
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</form>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
@ -273,7 +273,7 @@
|
|
|
|
|
<div class="box-header with-border">
|
|
|
|
|
<h3 class="box-title"><img src="/images/control.png" style="height:18px;margin-right:10px;" />{{device.DisplayName||device.Name}}</h3>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="row" style="background-color:#fff;border:1px solid #eee;border-radius:5px;text-align:center;padding:10px 0;margin:10px 0">
|
|
|
|
|
<div class="box-body">
|
|
|
|
|
<form class="device KeyCodeType1 ir" method="get" action="/App/Exec">
|
|
|
|
|
<input type="hidden" name="Number" :value="device.Number" />
|
|
|
|
|
<input type="hidden" name="Method" value="/Ir/Send" />
|
|
|
|
@ -403,18 +403,20 @@
|
|
|
|
|
});
|
|
|
|
|
connection.on("UpdateDevice", (message) => {
|
|
|
|
|
var newDevice = JSON.parse(message);
|
|
|
|
|
var update = false;
|
|
|
|
|
for (var i = 0; i < vm.ViewModel.Devices.length; i++) {
|
|
|
|
|
if (vm.ViewModel.Devices[i].Number == newDevice.Number) {
|
|
|
|
|
update = true;
|
|
|
|
|
break;
|
|
|
|
|
if (newDevice.NodeId === vm.ViewModel.Id) {
|
|
|
|
|
var update = false;
|
|
|
|
|
for (var i = 0; i < vm.ViewModel.Devices.length; i++) {
|
|
|
|
|
if (vm.ViewModel.Devices[i].Number == newDevice.Number) {
|
|
|
|
|
update = true;
|
|
|
|
|
break;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
if (update) {
|
|
|
|
|
vm.ViewModel.Devices.splice(i, 1, newDevice);
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
vm.ViewModel.Devices.push(newDevice);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
if (update) {
|
|
|
|
|
vm.ViewModel.Devices.splice(i, 1, newDevice);
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
vm.ViewModel.Devices.push(newDevice);
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
@ -632,10 +634,10 @@
|
|
|
|
|
}
|
|
|
|
|
return null;
|
|
|
|
|
},
|
|
|
|
|
HasCameras() {
|
|
|
|
|
HasDevices(name) {
|
|
|
|
|
return Enumerable
|
|
|
|
|
.from(vm.ViewModel.Devices)
|
|
|
|
|
.any(function (o) { return o.Name === '摄像头' });
|
|
|
|
|
.any(function (o) { return o.Name === name });
|
|
|
|
|
},
|
|
|
|
|
GetCameras() {
|
|
|
|
|
return Enumerable
|
|
|
|
|