wanggang
/
iot
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

调整节点页面界面布局和图标

Browse Source 
Former-commit-id: dede8a3fab1109bcf078d92fe2d71c8434bb9f21
TangShanKaiPing
wanggang 6 years ago
parent 8a96097cbb
commit 0b551023f9
8 changed files with 265 additions and 218 deletions
Show Stats Download Patch File Download Diff File

19
projects/IoTCenter/Views/Home/Node.cshtml
Unescape View File

@ -73,19 +73,16 @@
padding: 11px 0;
}
.btns {
padding: 10.5px;
}
.btns .btn {
margin: 18px 0;
.ptz img, .control img {
cursor: pointer;
}
.ptz img, .control img {
cursor: pointer;
form .label1 {
line-height: 50px;
vertical-align: middle;
}
label.button input {
.ir label input {
display: none;
}
@ -102,7 +99,7 @@
input[type=range] {
-webkit-appearance: none;
height: 25px;
height: 50px;
}
input[type=range]::-webkit-slider-runnable-track {
@ -119,7 +116,7 @@
height: 16px;
width: 16px;
border-radius: 50%;
background-color: Highlight;
background-color: green;
margin-top: -5px;
}

459
projects/IoTCenter/wwwroot/node.default.html
Unescape View File

@ -1,27 +1,65 @@
<div v-if="ViewModel" class="callout callout-info">
<h4>{{ViewModel.Name}}</h4>
<div class="row">
<div v-if="ViewModel" class="callout callout-success">
<h4>{{ViewModel.Name}}</h4>
</div>
</div>
<div class="row" v-if="ViewModel">
<div class="col-md-6">
<select class="form-control" id="camera" @change="CameraSelected">
<option v-for="c in GetCameras()" :value="c.Number">{{c.DisplayName||c.Name}}</option>
</select>
<div style="width:100%;height:265px;margin:0;padding:0;background:#000;">
<video id="flvPlayer" class="video" controls autoplay style="width:100%;max-width:100%;height:100%;"></video>
<div class="row">
<div class="box box-solid">
<select class="form-control" id="camera" @change="CameraSelected">
<option v-for="c in GetCameras()" :value="c.Number">{{c.DisplayName||c.Name}}</option>
</select>
<div style="width:100%;height:265px;margin:0;padding:0;background:#000;">
<video id="flvPlayer" class="video" controls autoplay style="width:100%;max-width:100%;height:100%;"></video>
</div>
</div>
</div>
<div class="row" v-if="PTZControlSupport()">
<div class="box box-solid">
<div class="box-header with-border">
<img src="/images/ptz.png" style="height:18px;margin-right:10px;" />云台操作
</div>
<div class="box-body">
<table class="ptz">
<tr>
<td></td>
<td></td>
<td><img class="ajax camera Up" src="/images/up.png" /></td>
<td></td>
<td></td>
</tr>
<tr>
<td><img class="ajax camera Zoomin" src="/images/zoomin.png" /></td>
<td><img class="ajax camera Left" src="/images/left.png" /></td>
<td><img class="ajax camera Stop" src="/images/stop.png" /></td>
<td><img class="ajax camera Right" src="/images/right.png" /></td>
<td><img class="ajax camera Zoomout" src="/images/zoomout.png" /></td>
</tr>
<tr>
<td></td>
<td></td>
<td><img class="ajax camera Down" src="/images/down.png" /></td>
<td></td>
<td></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="row">
<div class="col-md-6">
<div class="box box-solid">
<div class="row">
<div class="row">
<div class="box box-solid">
<div class="col-md-4">
<img src="/images/temperature.png" style="width:48px;height:48px;margin:20px;" />
<img src="/images/temperature.png" style="width:48px;height:48px;margin:19px;" />
</div>
<div class="col-md-4" style="height:88px;">
<h3 style="line-height:88px;margin:0;">{{GetData('温湿度传感器',null,null,'温度','Description')}}</h3>
<div class="col-md-4" style="height:86px;">
<h3 style="line-height:86px;margin:0;">{{GetData('温湿度传感器',null,null,'温度','Description')}}</h3>
</div>
<div class="col-md-4" style="height:88px;">
<div class="col-md-4" style="height:86px;">
<span style="display:inline-block;position:absolute;right:20px;bottom:5px;white-space: nowrap;">温度：{{GetData('温湿度传感器',null,null,'温度','Value')}}{{ GetData('温湿度传感器',null,null,'温度','Unit')}}</span>
</div>
</div>
@ -31,12 +69,12 @@
<div class="box box-solid">
<div class="row">
<div class="col-md-4">
<img src="/images/humidity.png" style="width:48px;height:48px;margin:20px;" />
<img src="/images/humidity.png" style="width:48px;height:48px;margin:19px;" />
</div>
<div class="col-md-4" style="height:88px;">
<h3 style="line-height:88px;margin:0;">{{GetData('温湿度传感器',null,null,'湿度','Description')}}</h3>
<div class="col-md-4" style="height:86px;">
<h3 style="line-height:86px;margin:0;">{{GetData('温湿度传感器',null,null,'湿度','Description')}}</h3>
</div>
<div class="col-md-4" style="height:88px;">
<div class="col-md-4" style="height:86px;">
<span style="display:inline-block;position:absolute;right:20px;bottom:5px;white-space: nowrap;">湿度：{{GetData('温湿度传感器',null,null,'湿度','Value')}}{{ GetData('温湿度传感器',null,null,'温度','Unit')}}</span>
</div>
</div>
@ -48,12 +86,12 @@
<div class="box box-solid">
<div class="row">
<div class="col-md-4">
<img src="/images/light.png" style="width:48px;height:48px;margin:20px;" />
<img src="/images/light.png" style="width:48px;height:48px;margin:19px;" />
</div>
<div class="col-md-4" style="height:88px;">
<h3 style="line-height:88px;margin:0;">{{GetData('光强检测器',null,'前门','光照度','Description')}}</h3>
<div class="col-md-4" style="height:86px;">
<h3 style="line-height:86px;margin:0;">{{GetData('光强检测器',null,'前门','光照度','Description')}}</h3>
</div>
<div class="col-md-4" style="height:88px;">
<div class="col-md-4" style="height:86px;">
<span style="display:inline-block;position:absolute;right:20px;bottom:5px;white-space: nowrap;">前门光照：{{GetData('光强检测器',null,'前门','光照度','Value')}}{{ GetData('光强检测器',null,'前门','光照度','Unit')}}</span>
</div>
</div>
@ -63,12 +101,12 @@
<div class="box box-solid">
<div class="row">
<div class="col-md-4">
<img src="/images/light.png" style="width:48px;height:48px;margin:20px;" />
<img src="/images/light.png" style="width:48px;height:48px;margin:19px;" />
</div>
<div class="col-md-4" style="height:88px;">
<h3 style="line-height:88px;margin:0;">{{GetData('光强检测器',null,'后门','光照度','Description')}}</h3>
<div class="col-md-4" style="height:86px;">
<h3 style="line-height:86px;margin:0;">{{GetData('光强检测器',null,'后门','光照度','Description')}}</h3>
</div>
<div class="col-md-4" style="height:88px;">
<div class="col-md-4" style="height:86px;">
<span style="display:inline-block;position:absolute;right:20px;bottom:5px;white-space: nowrap;">后门光照：{{GetData('光强检测器',null,'后门','光照度','Value') }}{{ GetData('光强检测器',null,'后门','光照度','Unit')}}</span>
</div>
</div>
@ -80,12 +118,12 @@
<div class="box box-solid">
<div class="row">
<div class="col-md-4">
<img src="/images/person.png" style="width:48px;height:48px;margin:20px;" />
<img src="/images/person.png" style="width:48px;height:48px;margin:19px;" />
</div>
<div class="col-md-4" style="height:88px;">
<div class="col-md-4" style="height:86px;">
<img src="/images/warn.png" style="width:36px;height:36px;margin:32px 0 0 0;" v-if="GetData('红外感应器',null,'前门','状态','Value')==='警报'" />
</div>
<div class="col-md-4" style="height:88px;">
<div class="col-md-4" style="height:86px;">
<span style="display:inline-block;position:absolute;right:20px;bottom:5px;white-space: nowrap;">前门人体：{{GetData('红外感应器',null,'前门','状态','Value') }}</span>
</div>
</div>
@ -95,214 +133,175 @@
<div class="box box-solid">
<div class="row">
<div class="col-md-4">
<img src="/images/person.png" style="width:48px;height:48px;margin:20px;" />
<img src="/images/person.png" style="width:48px;height:48px;margin:19px;" />
</div>
<div class="col-md-4" style="height:88px;">
<div class="col-md-4" style="height:86px;">
<img src="/images/warn.png" style="width:36px;height:36px;margin:32px 0 0 0;" v-if="GetData('红外感应器',null,'后门','状态','Value')==='警报'" />
</div>
<div class="col-md-4" style="height:88px;">
<div class="col-md-4" style="height:86px;">
<span style="display:inline-block;position:absolute;right:20px;bottom:5px;white-space: nowrap;">后门人体：{{GetData('红外感应器',null,'后门','状态','Value') }}</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row" v-if="ViewModel">
<div class="col-md-6">
<div class="box box-solid">
<table class="ptz" v-if="PTZControlSupport()">
<tr>
<td><img class="ajax camera Zoomin" src="/images/zoomin.png" /></td>
<td></td>
<td><img class="ajax camera Up" src="/images/up.png" /></td>
<td></td>
<td><img class="ajax camera Zoomout" src="/images/zoomout.png" /></td>
</tr>
<tr>
<td></td>
<td><img class="ajax camera Left" src="/images/left.png" /></td>
<td><img class="ajax camera Stop" src="/images/stop.png" /></td>
<td><img class="ajax camera Right" src="/images/right.png" /></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td><img class="ajax camera Down" src="/images/down.png" /></td>
<td></td>
<td></td>
</tr>
</table>
<p v-else>该摄像头不支持云台</p>
</div>
<div class="box box-solid">
<div class="box-body row">
<div class="col-md-12">
<canvas id="TemperatureChart" :data-device-number="GetDeviceNumber('温湿度传感器')"></canvas>
</div>
</div>
</div>
<div class="box box-solid">
<div class="box-body row">
<div class="col-md-12">
<canvas id="humidityChart" :data-device-number="GetDeviceNumber('温湿度传感器')"></canvas>
<div class="row">
<div class="col-md-12">
<div class="box box-solid">
<div class="box-header with-border">
<h3 class="box-title"><img src="/images/batch.png" style="height:18px;margin-right:10px;" />批量操作</h3>
<div class="box-tools pull-right">
<button class="btn btn-sm bg-olive ajax NodePowerOn" :data-node-number="ViewModel.Number">一键开</button>
<button class="btn btn-sm bg-olive ajax NodePowerOff" :data-node-number="ViewModel.Number">一键关</button>
</div>
</div>
</div>
</div>
</div>
<div class="box box-solid">
<div class="box-body row">
<div class="col-md-12">
<canvas id="LightChart1" :data-device-number="GetDeviceNumber('光强检测器','前门')"></canvas>
<div class="row">
<div class="col-md-12">
<div class="box box-solid btns">
<div class="box-header with-border">
<img src="/images/scene.png" style="height:18px;margin-right:10px;" />场景
</div>
<div class="box-body">
<button class="btn bg-olive margin ajax Scene" v-for="scene in ViewModel.Scenes" :data-node-number="ViewModel.Number" :data-scene-name="scene.Name">{{scene.Name}}</button>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 control">
<div class="box box-solid">
<div class="box-body row">
<div class="col-md-12">
<canvas id="LightChart2" :data-device-number="GetDeviceNumber('光强检测器','后门')"></canvas>
<div class="box-header with-border">
<h3 class="box-title"><img src="/images/switch2.png" style="height:18px;margin-right:10px;" />一路开关</h3>
<div class="box-tools pull-right">
<button class="btn btn-sm bg-olive ajax NodeSwitchOn" :data-node-number="ViewModel.Number">一键开</button>
<button class="btn btn-sm bg-olive ajax NodeSwitchOff" :data-node-number="ViewModel.Number">一键关</button>
</div>
</div>
</div>
<div class="box box-solid">
<div class="box-body row">
<div class="col-md-12">
<canvas id="EnergyChart" :data-device-number="GetDeviceNumber('智能插座')"></canvas>
<div class="box-body">
<div class="row">
<div class="col-md-3" v-for="device in GetDevices('一路开关')">
<div class="row" style="background-color:#fff;border:1px solid #eee;border-radius:5px;text-align:center;padding:10px 0;margin:10px 0">
<img v-if="GetDataValue(device.Number,'状态')=='开'" @click="CallApi(device.Number,'/Socket/Off')" src="/images/on.png" />
<img v-if="GetDataValue(device.Number,'状态')=='关'" @click="CallApi(device.Number,'/Socket/On')" src="/images/off.png" />
</div>
<div class="row" style="text-align:center;">
{{device.Name||device.DisplayName}}
</div>
<br />
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 control">
<div class="box box-solid btns">
<div class="row">
<div class="col-md-4"><span style="display:inline-block;line-height:70px;">用电:</span></div>
<div class="col-md-4"><button class="btn btn-block btn-primary ajax NodePowerOn" :data-node-number="ViewModel.Number">一键开</button></div>
<div class="col-md-4"><button class="btn btn-block btn-primary ajax NodePowerOff" :data-node-number="ViewModel.Number">一键关</button></div>
</div>
<hr style="margin: 0;" />
<div class="row">
<div class="col-md-3" v-for="scene in ViewModel.Scenes">
<button class="btn btn-block btn-info ajax Scene" :data-node-number="ViewModel.Number" :data-scene-name="scene.Name">{{scene.Name}}</button>
<div class="col-md-6">
<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>
<div class="box-tools pull-right">
<button class="btn btn-sm bg-olive ajax NodeSwitch3On" :data-node-number="ViewModel.Number">一键开</button>
<button class="btn btn-sm bg-olive ajax NodeSwitch3Off" :data-node-number="ViewModel.Number">一键关</button>
</div>
</div>
</div>
<div class="box box-solid btns">
<div class="row">
<div class="col-md-4"><span style="display:inline-block;line-height:70px;">一路开关:</span></div>
<div class="col-md-4"><button class="btn btn-block btn-primary ajax NodeSwitchOn" :data-node-number="ViewModel.Number">一键开</button></div>
<div class="col-md-4"><button class="btn btn-block btn-primary ajax NodeSwitchOff" :data-node-number="ViewModel.Number">一键关</button></div>
</div>
<hr style="margin: 0;" />
<div class="row">
<div class="col-md-3" v-for="device in GetDevices('一路开关')">
<div class="row" style="background-color:#fff;border:1px solid #eee;border-radius:5px;text-align:center;padding:10px 0;margin:10px 0">
<img v-if="GetDataValue(device.Number,'状态')=='开'" @click="CallApi(device.Number,'/Socket/Off')" src="/images/on.png" />
<img v-if="GetDataValue(device.Number,'状态')=='关'" @click="CallApi(device.Number,'/Socket/On')" src="/images/off.png" />
</div>
<div class="row" style="text-align:center;">
{{device.Name||device.DisplayName}}
<div class="box-body">
<div class="row">
<div class="col-md-3" v-for="device in GetDevices('三路开关')">
<div class="row" style="background-color:#fff;border:1px solid #eee;border-radius:5px;text-align:center;padding:10px 0;margin:10px 0">
<img v-if="GetDataValue(device.Number,'L1状态')=='开'" @click="CallApi(device.Number,'/Switch3/L1Off')" src="/images/on.png" />
<img v-if="GetDataValue(device.Number,'L1状态')=='关'" @click="CallApi(device.Number,'/Switch3/L1On')" src="/images/off.png" />
<img v-if="GetDataValue(device.Number,'L2状态')=='开'" @click="CallApi(device.Number,'/Switch3/L2Off')" src="/images/on.png" />
<img v-if="GetDataValue(device.Number,'L2状态')=='关'" @click="CallApi(device.Number,'/Switch3/L2On')" src="/images/off.png" />
<img v-if="GetDataValue(device.Number,'L3状态')=='开'" @click="CallApi(device.Number,'/Switch3/L3Off')" src="/images/on.png" />
<img v-if="GetDataValue(device.Number,'L3状态')=='关'" @click="CallApi(device.Number,'/Switch3/L3On')" src="/images/off.png" />
</div>
<div class="row" style="text-align:center;">
{{device.Name||device.DisplayName}}
</div>
<br />
</div>
<br />
</div>
</div>
</div>
<div class="box box-solid btns">
<div class="row">
<div class="col-md-4"><span style="display:inline-block;line-height:70px;">三路开关:</span></div>
<div class="col-md-4"><button class="btn btn-block btn-primary ajax NodeSwitch3On" :data-node-number="ViewModel.Number">一键开</button></div>
<div class="col-md-4"><button class="btn btn-block btn-primary ajax NodeSwitch3Off" :data-node-number="ViewModel.Number">一键关</button></div>
</div>
<hr style="margin: 0;" />
<div class="row">
<div class="col-md-3" v-for="device in GetDevices('三路开关')">
<div class="row" style="background-color:#fff;border:1px solid #eee;border-radius:5px;text-align:center;padding:10px 0;margin:10px 0">
<img v-if="GetDataValue(device.Number,'L1状态')=='开'" @click="CallApi(device.Number,'/Switch3/L1Off')" src="/images/on.png" />
<img v-if="GetDataValue(device.Number,'L1状态')=='关'" @click="CallApi(device.Number,'/Switch3/L1On')" src="/images/off.png" />
<img v-if="GetDataValue(device.Number,'L2状态')=='开'" @click="CallApi(device.Number,'/Switch3/L2Off')" src="/images/on.png" />
<img v-if="GetDataValue(device.Number,'L2状态')=='关'" @click="CallApi(device.Number,'/Switch3/L2On')" src="/images/off.png" />
<img v-if="GetDataValue(device.Number,'L3状态')=='开'" @click="CallApi(device.Number,'/Switch3/L3Off')" src="/images/on.png" />
<img v-if="GetDataValue(device.Number,'L3状态')=='关'" @click="CallApi(device.Number,'/Switch3/L3On')" src="/images/off.png" />
</div>
<div class="row" style="text-align:center;">
{{device.Name||device.DisplayName}}
</div>
<br />
</div>
<div class="col-md-6">
<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>
<div class="box-tools pull-right">
<button class="btn btn-sm bg-olive ajax NodeSocketOn" :data-node-number="ViewModel.Number">一键开</button>
<button class="btn btn-sm bg-olive ajax NodeSocketOff" :data-node-number="ViewModel.Number">一键关</button>
</div>
</div>
</div>
<div class="box box-solid btns">
<div class="row">
<div class="col-md-4"><span style="display:inline-block;line-height:70px;">插座:</span></div>
<div class="col-md-4"><button class="btn btn-block btn-primary ajax NodeSocketOn" :data-node-number="ViewModel.Number">一键开</button></div>
<div class="col-md-4"><button class="btn btn-block btn-primary ajax NodeSocketOff" :data-node-number="ViewModel.Number">一键关</button></div>
</div>
<hr style="margin: 0;" />
<div class="row">
<div class="col-md-3" v-for="device in GetDevices('智能插座')">
<div class="row" style="background-color:#fff;border:1px solid #eee;border-radius:5px;text-align:center;padding:10px 0;margin:10px 0">
<img v-if="GetDataValue(device.Number,'状态')=='开'" @click="CallApi(device.Number,'/Socket/Off')" src="/images/on.png" />
<img v-if="GetDataValue(device.Number,'状态')=='关'" @click="CallApi(device.Number,'/Socket/On')" src="/images/off.png" />
</div>
<div class="row" style="text-align:center;">
{{device.Name||device.DisplayName}}
<div class="box-body">
<div class="row">
<div class="col-md-3" v-for="device in GetDevices('智能插座')">
<div class="row" style="background-color:#fff;border:1px solid #eee;border-radius:5px;text-align:center;padding:10px 0;margin:10px 0">
<img v-if="GetDataValue(device.Number,'状态')=='开'" @click="CallApi(device.Number,'/Socket/Off')" src="/images/on.png" />
<img v-if="GetDataValue(device.Number,'状态')=='关'" @click="CallApi(device.Number,'/Socket/On')" src="/images/off.png" />
</div>
<div class="row" style="text-align:center;">
{{device.Name||device.DisplayName}}
</div>
<br />
</div>
<br />
</div>
</div>
</div>
<div class="box box-solid btns">
<template v-for="device in GetDevices('调色灯')">
<div class="row" style="text-align:center;">
{{device.Name||device.DisplayName}}
</div>
<div class="row" style="background-color:#fff;border:1px solid #eee;border-radius:5px;text-align:center;padding:10px 0;margin:10px 0">
<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>
<template v-for="device in GetDevices('调色灯')">
<div class="col-md-6">
<div class="box box-solid">
<div class="box-header with-border">
<h3 class="box-title"><img src="/images/light2.png" style="height:18px;margin-right:10px;" />{{device.Name||device.DisplayName}}</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>
<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 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-3">
亮度：
<span class="label1">亮度</span>
</div>
<div class="col-md-9">
<input @change="AjaxSubmit($event,device.Number,'亮度')" type="range" min="0" step="1" max="255" name="Brightness" :value="GetDataValue(device.Number,'亮度')" />
</div>
</div>
</form>
</div>
<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" style="background-color:#fff;border:1px solid #eee;border-radius:5px;text-align:center;padding:10px 0;margin:10px 0">
<div class="col-md-3">
色调：
</div>
<div class="col-md-9">
<input @change="AjaxSubmit($event,device.Number,'色调')" type="range" min="0" step="1" max="255" name="Hue" :value="GetDataValue(device.Number,'色调')" />
</div>
</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="col-md-3">
饱和度：
<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-3">
<span class="label1">色调</span>
</div>
<div class="col-md-9">
<input @change="AjaxSubmit($event,device.Number,'色调')" type="range" min="0" step="1" max="255" name="Hue" :value="GetDataValue(device.Number,'色调')" />
</div>
</div>
<div class="col-md-9">
<input @change="AjaxSubmit($event,device.Number,'饱和度')" type="range" min="0" step="1" max="255" name="Saturation" :value="GetDataValue(device.Number,'饱和度')" />
<div class="row">
<div class="col-md-3">
<span class="label1">饱和度</span>
</div>
<div class="col-md-9">
<input @change="AjaxSubmit($event,device.Number,'饱和度')" type="range" min="0" step="1" max="255" name="Saturation" :value="GetDataValue(device.Number,'饱和度')" />
</div>
</div>
</div>
</form>
</template>
</form>
</div>
</div>
</div>
<div class="box box-solid btns">
<template v-for="device in GetDevices('红外转发器')">
<div class="row" style="text-align:center;">
{{device.Name||device.DisplayName}}
</template>
<template v-for="device in GetDevices('红外转发器')">
<div class="col-md-6">
<div class="box box-solid btns">
<div class="box-header with-border">
<h3 class="box-title"><img src="/images/control.png" style="height:18px;margin-right:10px;" />{{device.Name||device.DisplayName}}</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">
<form class="device KeyCodeType1 ir" method="get" action="/App/Exec">
@ -312,28 +311,28 @@
<input type="hidden" name="Code" :value="GetDataValue(device.Number,'按键')" />
<div class="row">
<div class="col-md-2">
<label>电源：</label>
<span class="label1">电源</span>
</div>
<div class="col-md-10">
<label class="button button-raised button-round"><input @change="SendCode1($event)" name="power" type="radio" value="2" v-model="getCode1(GetDataValue(device.Number,'按键')).power" />开</label>
<label class="button button-raised button-round"><input @change="SendCode1($event)" name="power" type="radio" value="1" v-model="getCode1(GetDataValue(device.Number,'按键')).power" />关</label>
<label class="btn btn-sm bg-olive margin"><input @change="SendCode1($event)" name="power" type="radio" value="2" v-model="getCode1(GetDataValue(device.Number,'按键')).power" />开</label>
<label class="btn btn-sm bg-olive margin"><input @change="SendCode1($event)" name="power" type="radio" value="1" v-model="getCode1(GetDataValue(device.Number,'按键')).power" />关</label>
</div>
</div>
<div class="row">
<div class="col-md-2">
<label>模式：</label>
<span class="label1">模式</span>
</div>
<div class="col-md-10">
<label class="button button-raised button-round"><input @change="SendCode1($event)" name="pattern" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).pattern" value="0" />制冷</label>
<label class="button button-raised button-round"><input @change="SendCode1($event)" name="pattern" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).pattern" value="120" />自动</label>
<label class="button button-raised button-round"><input @change="SendCode1($event)" name="pattern" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).pattern" value="240" />制热</label>
<label class="button button-raised button-round"><input @change="SendCode1($event)" name="pattern" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).pattern" value="360" />抽湿</label>
<label class="button button-raised button-round"><input @change="SendCode1($event)" name="pattern" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).pattern" value="480" />送风</label>
<label class="btn btn-sm bg-olive margin"><input @change="SendCode1($event)" name="pattern" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).pattern" value="0" />制冷</label>
<label class="btn btn-sm bg-olive margin"><input @change="SendCode1($event)" name="pattern" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).pattern" value="120" />自动</label>
<label class="btn btn-sm bg-olive margin"><input @change="SendCode1($event)" name="pattern" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).pattern" value="240" />制热</label>
<label class="btn btn-sm bg-olive margin"><input @change="SendCode1($event)" name="pattern" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).pattern" value="360" />抽湿</label>
<label class="btn btn-sm bg-olive margin"><input @change="SendCode1($event)" name="pattern" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).pattern" value="480" />送风</label>
</div>
</div>
<div class="row">
<div class="col-md-2">
<label>温度：</label>
<span class="label1">温度</span>
</div>
<div class="col-md-10">
<input @change="SendCode1($event)" name="temperature" type="range" step="1" min="1" max="15" :value="getCode1(GetDataValue(device.Number,'按键')).temperature" />
@ -341,28 +340,74 @@
</div>
<div class="row">
<div class="col-md-2">
<label>风向：</label>
<span class="label1">风向</span>
</div>
<div class="col-md-10">
<label class="button button-raised button-round"><input @change="SendCode1($event)" name="direction" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).direction" value="0" />任意</label>
<label class="button button-raised button-round"><input @change="SendCode1($event)" name="direction" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).direction" value="60" />手动</label>
<label class="button button-raised button-round"><input @change="SendCode1($event)" name="direction" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).direction" value="75" />自动</label>
<label class="btn btn-sm bg-olive margin"><input @change="SendCode1($event)" name="direction" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).direction" value="0" />任意</label>
<label class="btn btn-sm bg-olive margin"><input @change="SendCode1($event)" name="direction" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).direction" value="60" />手动</label>
<label class="btn btn-sm bg-olive margin"><input @change="SendCode1($event)" name="direction" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).direction" value="75" />自动</label>
</div>
</div>
<div class="row">
<div class="col-md-2">
<label>风量：</label>
<span class="label1">风量</span>
</div>
<div class="col-md-10">
<label class="button button-raised button-round"><input @change="SendCode1($event)" name="wind" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).wind" value="0" />自动</label>
<label class="button button-raised button-round"><input @change="SendCode1($event)" name="wind" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).wind" value="15" />高</label>
<label class="button button-raised button-round"><input @change="SendCode1($event)" name="wind" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).wind" value="30" />中</label>
<label class="button button-raised button-round"><input @change="SendCode1($event)" name="wind" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).wind" value="45" />低</label>
<label class="btn btn-sm bg-olive margin"><input @change="SendCode1($event)" name="wind" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).wind" value="0" />自动</label>
<label class="btn btn-sm bg-olive margin"><input @change="SendCode1($event)" name="wind" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).wind" value="15" />高</label>
<label class="btn btn-sm bg-olive margin"><input @change="SendCode1($event)" name="wind" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).wind" value="30" />中</label>
<label class="btn btn-sm bg-olive margin"><input @change="SendCode1($event)" name="wind" type="radio" v-model="getCode1(GetDataValue(device.Number,'按键')).wind" value="45" />低</label>
</div>
</div>
</form>
</div>
</template>
</div>
</div>
</template>
<div class="col-md-6">
<div class="box box-solid">
<div class="box-body row">
<div class="col-md-12">
<canvas id="TemperatureChart" :data-device-number="GetDeviceNumber('温湿度传感器')"></canvas>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="box box-solid">
<div class="box-body row">
<div class="col-md-12">
<canvas id="humidityChart" :data-device-number="GetDeviceNumber('温湿度传感器')"></canvas>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="box box-solid">
<div class="box-body row">
<div class="col-md-12">
<canvas id="LightChart1" :data-device-number="GetDeviceNumber('光强检测器','前门')"></canvas>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="box box-solid">
<div class="box-body row">
<div class="col-md-12">
<canvas id="LightChart2" :data-device-number="GetDeviceNumber('光强检测器','后门')"></canvas>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="box box-solid">
<div class="box-body row">
<div class="col-md-12">
<canvas id="EnergyChart" :data-device-number="GetDeviceNumber('智能插座')"></canvas>
</div>
</div>
</div>
</div>
</div>

5
projects/IoTClient/Assets/StreamingAssets/IoT.Resources.csproj
Unescape View File

@ -12,7 +12,12 @@
 <ItemGroup>
<EmbeddedResource Include="wwwroot\**\*" />
</ItemGroup><ItemGroup>
<None Remove="wwwroot\images\batch.png" />
<None Remove="wwwroot\images\classroom.png" />
<None Remove="wwwroot\images\light2.png" />
<None Remove="wwwroot\images\ptz.png" />
<None Remove="wwwroot\images\scene.png" />
<None Remove="wwwroot\images\switch2.png" />
<None Remove="wwwroot\images\temperature.png" />
</ItemGroup>
</Project>

BIN
projects/IoTClient/Assets/StreamingAssets/wwwroot/images/batch.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 338 B

BIN
projects/IoTClient/Assets/StreamingAssets/wwwroot/images/light2.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 683 B

BIN
projects/IoTClient/Assets/StreamingAssets/wwwroot/images/ptz.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 807 B

BIN
projects/IoTClient/Assets/StreamingAssets/wwwroot/images/scene.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 571 B

BIN
projects/IoTClient/Assets/StreamingAssets/wwwroot/images/switch2.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 557 B

Write Preview
Loading…
Cancel
Save