You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

613 lines
51 KiB

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui, viewport-fit=cover">
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="stylesheet" href="lib/framework7/css/framework7.bundle.min.css">
<link rel="stylesheet" href="css/framework7-icons.css">
<link rel="stylesheet" href="lib/toastr/toastr.min.css">
<link rel="stylesheet" href="css/app.css">
</head>
<body>
<div class="statusbar"></div>
<div id="app">
<div id="loading" style="">loading...</div>
<f7-app :params="$root.f7params">
<f7-view main>
<f7-col>
<f7-preloader></f7-preloader>
</f7-col>
<f7-page>
<f7-navbar :title="model?model.Name:'节点'">
<a v-if="model" :href="'product.html?number='+model.Product.Number" slot="nav-left" class="link external"><i class="icon icon-back"></i>返回</a>
</f7-navbar>
<div id="template">
<style>
h3 img {
height: 32px;
margin: -8px 8px -8px -8px;
}
.card-tools img, .card-body img {
height: 32px;
cursor: pointer;
}
.content-wrapper {
/*background-color: lightblue;*/
}
label.button {
display: inline-block;
line-height: 28px;
margin: 8px;
}
.card-header img {
height: 24px;
vertical-align: middle;
}
.card-content img {
width: 32px;
}
input.switch {
display: none;
}
label.switch {
display: inline-block;
width: 60px;
height: 30px;
border-radius: 30px;
}
label.switch.on {
background-color: green;
}
label.switch.off {
background-color: grey;
}
label.switch.on::before {
content: '';
display: block;
width: 30px;
height: 30px;
border-radius: 30px;
background-color: white;
position: absolute;
left: 0;
}
label.switch.off::after {
content: '';
display: block;
width: 30px;
height: 30px;
border-radius: 30px;
background-color: white;
position: absolute;
right: 0;
}
.ir label input {
display: none;
}
.danger {
color: red;
}
.normal {
color: green;
}
.ptz {
width: 100%;
}
.ptz td {
text-align: center;
height: 46px;
}
.ir td {
width: 11%;
text-align: center;
}
.keyboard {
table-layout: fixed;
}
input[type='range'] {
-webkit-appearance: none;
outline: none;
background: cadetblue;
display: inline-block;
width: 100%;
height: 15px;
margin: 10px 0;
}
input[type='range'].hue {
background: -webkit-linear-gradient(left, #F00 0%, #FF0 16.66%, #0F0 33.33%, #0FF 50%,#00F 66.66%, #F0F 83.33%, #F00 100%);
}
input[type='range'].saturation {
background: -webkit-linear-gradient(left, #fff 0%, green 100%);
}
input[type='range'].brightness {
background: -webkit-linear-gradient(left, #000 0%, #fff 100%);
}
input[type='range']::-webkit-slider-thumb {
-webkit-appearance: none;
background-color: transparent;
height: 30px;
width: 30px;
border: 15px solid rgba(230,230,230,0.8);
border-radius: 50%;
}
canvas {
width: 100%;
height: 215px;
}
.ir label {
margin: 2px 0 2px 2px;
}
.card-body button.btn {
margin-right: 5px;
}
.card {
margin-bottom: 20px;
}
</style>
<template v-if="model">
<!--折线图-->
<div class="row" v-if="HasChart()">
<div class="col-100">
<div class="card">
<div class="card-header">
<div class="card-title">历史数据</div>
<div class="segmented segmented-raised">
<button class="button button-active" v-on:click="changeTime('1d')">24小时</button>
<button class="button" v-on:click="changeTime('7d')">7日</button>
<button class="button" v-on:click="changeTime('30d')">30日</button>
</div>
</div>
<div class="card-content">
<canvas class="chart" style="width:60%;max-width:100%;" :id="model.Number"></canvas>
</div>
</div>
</div>
</div>
<!--属性-->
<div class="row">
<div class="col-100">
<div class="card">
<div class="card-header">{{model.Name}}</div>
<div class="card-content" v-if="model.Data.length>0">
<div class="row" v-for="data in GetDatas()" style="padding:10px;">
<div class="col-30">{{data.Name}}</div>
<div class="col-70">{{data.Value}}{{data.Unit}}{{data.Description}}</div>
</div>
</div>
</div>
</div>
</div>
<!--命令-->
<div class="row" v-if="model.Commands.length">
<div class="col-100">
<div class="card">
<div class="card-header">
<h3 class="card-title"><img :src="iotCenter+model.Product.Image" />{{model.DisplayName}}</h3>
<div class="card-tools">命令</div>
</div>
<div class="card-content" v-if="model.Commands.length>0">
<button class="button button-raised" v-for="command in GetCommands()" v-on:click="CallCommand(command.Id)">{{command.Name}}</button>
</div>
</div>
</div>
</div>
<!--摄像头-->
<template v-if="model.Name==='摄像头'">
<input type="hidden" id="camera" :value="model.Number" />
<div class="card">
<div class="card-header">
{{model.DisplayName}}
<div class="row">
<label class="button button-raised" v-on:click="CallApi(model.Number,'/Onvif/StartPush')">开始推流</label>
<label class="button button-raised" v-on:click="CallApi(model.Number,'/Onvif/StopPush')">停止推流</label>
</div>
</div>
<div style="max-width:100%;max-height:50%;margin:0;padding:0;background:#000;">
<video id="liveVideo" class="video" controls autoplay style="width:100%;max-width:100%;max-height:100%;" v-on:volumechange="VolumeChange($event)"></video>
</div>
</div>
<div class="card">
<div class="card-header">
<h3 class="card-title"><img :src="iotCenter+'/images/ptz.png'" />云台操作</h3>
</div>
<div class="card-content">
<table class="ptz" style="width:100%;">
<tr>
<td></td>
<td></td>
<td><img class="ajax camera" data-cmd="Up" :src="iotCenter+'/images/up.png'" /></td>
<td></td>
<td></td>
</tr>
<tr>
<td><img class="ajax camera" data-cmd="Zoomin" :src="iotCenter+'/images/zoomin.png'" /></td>
<td><img class="ajax camera" data-cmd="Left" :src="iotCenter+'/images/left.png'" /></td>
<td><img class="ajax camera" data-cmd="Stop" :src="iotCenter+'/images/stop.png'" /></td>
<td><img class="ajax camera" data-cmd="Right" :src="iotCenter+'/images/right.png'" /></td>
<td><img class="ajax camera" data-cmd="Zoomout" :src="iotCenter+'/images/zoomout.png'" /></td>
</tr>
<tr>
<td></td>
<td></td>
<td><img class="ajax camera" data-cmd="Down" :src="iotCenter+'/images/down.png'" /></td>
<td></td>
<td></td>
</tr>
</table>
</div>
</div>
</template>
<!--调色灯-->
<template v-else-if="model.Name==='调色灯'">
<div class="card">
<div class="card-header">
{{model.DisplayName}}
<img v-if="GetDataValue('状态')=='开'" v-on:click="CallApi(model.Number,'/ColorLight/Off')" :src="iotCenter+'/images/on.png'" />
<img v-if="GetDataValue('状态')=='关'" v-on:click="CallApi(model.Number,'/ColorLight/On')" :src="iotCenter+'/images/off.png'" />
</div>
<div class="card-content card-content-padding">
<form method="get" action="/App/ExecApi">
<input type="hidden" name="Number" :value="model.Number" />
<input type="hidden" name="Method" value="/ColorLight/SetColor" />
<div class="row">
<div class="col-20">
<label class="btn">色调</label>
</div>
<div class="col-80">
<input v-on:change="AjaxSubmit($event,model.Number,'色调')" type="range" min="0" step="1" max="255" name="Hue" class="hue" :value="GetDataValue('色调')" />
</div>
</div>
<div class="row">
<div class="col-20">
<label class="btn">饱和度</label>
</div>
<div class="col-80">
<input v-on:change="AjaxSubmit($event,model.Number,'饱和度')" type="range" min="0" step="1" max="254" name="Saturation" class="saturation" :value="GetDataValue('饱和度')" />
</div>
</div>
</form>
<form method="get" action="/App/ExecApi">
<input type="hidden" name="Number" :value="model.Number" />
<input type="hidden" name="Method" value="/ColorLight/SetBrightness" />
<div class="row">
<div class="col-20">
<label class="btn">亮度</label>
</div>
<div class="col-80">
<input v-on:change="AjaxSubmit($event,model.Number,'亮度')" type="range" min="0" step="1" max="254" name="Brightness" class="brightness" :value="GetDataValue('亮度')" />
</div>
</div>
</form>
</div>
</div>
</template>
<!--红外转发器-->
<template v-else-if="model.Name==='红外转发器'">
<div class="card" style="min-height:176px;">
<div class="card-header">
{{model.DisplayName}}
</div>
<div class="card-content card-content-padding">
<f7-toolbar tabbar bottom>
<f7-link :tab-link="'#tab_1'+model.Number" tab-link-active>空调</f7-link>
<f7-link :tab-link="'#tab_2'+model.Number">电视</f7-link>
<f7-link :tab-link="'#tab_3'+model.Number">机顶盒</f7-link>
<f7-link :tab-link="'#tab_4'+model.Number">自定义</f7-link>
</f7-toolbar>
<f7-tabs class="tab-content" style="min-height:176px;">
<f7-tab class="block block-strong" tab-active :id="'tab_1'+model.Number">
<form class="ir type1" method="get" action="/App/ExecApi">
<input type="hidden" name="Number" :value="model.Number" />
<input type="hidden" name="Method" value="/Ir/Send" />
<input type="hidden" name="Type" value="1" />
<input type="hidden" name="Code" :value="GetDataValue('按键')" />
<div class="row">
<div class="col-md-12">
<label class="btn">电源</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="power" type="radio" value="2" v-model="getCode1(GetDataValue('按键')).power" /></label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="power" type="radio" value="1" v-model="getCode1(GetDataValue('按键')).power" /></label>
<label class="btn">模式</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="pattern" type="radio" value="0" v-model="getCode1(GetDataValue('按键')).pattern" />制冷</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="pattern" type="radio" value="120" v-model="getCode1(GetDataValue('按键')).pattern" />自动</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="pattern" type="radio" value="240" v-model="getCode1(GetDataValue('按键')).pattern" />制热</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="pattern" type="radio" value="360" v-model="getCode1(GetDataValue('按键')).pattern" />抽湿</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="pattern" type="radio" value="480" v-model="getCode1(GetDataValue('按键')).pattern" />送风</label>
<lable class="btn">风向</lable>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="direction" type="radio" value="0" v-model="getCode1(GetDataValue('按键')).direction" />任意</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="direction" type="radio" value="60" v-model="getCode1(GetDataValue('按键')).direction" />手动</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="direction" type="radio" value="75" v-model="getCode1(GetDataValue('按键')).direction" />自动</label>
<lable class="btn">风量</lable>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="wind" type="radio" value="0" v-model="getCode1(GetDataValue('按键')).wind" />自动</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="wind" type="radio" value="15" v-model="getCode1(GetDataValue('按键')).wind" /></label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="wind" type="radio" value="30" v-model="getCode1(GetDataValue('按键')).wind" /></label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="wind" type="radio" value="45" v-model="getCode1(GetDataValue('按键')).wind" /></label>
</div>
</div>
<div class="row">
<div class="col-md-2">
<span class="btn">温度:{{getCode1(GetDataValue('按键')).temperature+15}}℃</span>
</div>
<div class="col-md-10">
<input v-on:click="SendCode1($event)" name="temperature" type="range" step="1" min="1" max="15" :value="getCode1(GetDataValue('按键')).temperature" />
</div>
</div>
</form>
</f7-tab>
<f7-tab class="block block-strong" :id="'tab_2'+model.Number">
<form class="ir type2" method="get" action="/App/ExecApi">
<input type="hidden" name="Number" :value="model.Number" />
<input type="hidden" name="Method" value="/Ir/Send" />
<input type="hidden" name="Type" value="2" />
<div class="row">
<div class="col-md-12 col-xs-12">
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="1" />POWR</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="2" />AV</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="3" />1</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="4" />2</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="5" />3</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="6" />4</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="7" />5</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="8" />6</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="9" />7</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="10" />8</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="11" />9</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="12" />0</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="13" />返回</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="14" />退出</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="15" />静音</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="16" />菜单</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="17" />音量+</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="18" />音量-</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="19" /></label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="20" /></label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="21" /></label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="22" /></label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="26" />快退</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="27" />播放</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="28" />快进</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="29" />录像</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="30" />暂停</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="31" />停止</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="23" />OK</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="24" />ch+</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="25" />ch-</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="32" />A</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="33" />B</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="34" />C</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="35" />D</label>
</div>
</div>
</form>
</f7-tab>
<f7-tab class="block block-strong" :id="'tab_3'+model.Number">
<form class="ir type3" method="get" action="/App/ExecApi">
<input type="hidden" name="Number" :value="model.Number" />
<input type="hidden" name="Method" value="/Ir/Send" />
<input type="hidden" name="Type" value="3" />
<div class="row">
<div class="col-md-12 col-xs-12">
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="1" />PW-ON</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="2" />PW-OFF</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="3" />1</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="4" />2</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="5" />3</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="6" />4</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="7" />5</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="8" />6</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="9" />7</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="10" />8</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="11" />9</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="12" />0</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="13" />CLEAR</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="14" />退出</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="15" />静音</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="16" />菜单</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="17" />音量+</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="18" />音量-</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="19" /></label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="20" /></label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="21" /></label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="22" /></label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="26" />鼠标L</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="27" />节能</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="28" />鼠标R</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="29" />局部放大+</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="30" />局部放大-</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="31" />冻结</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="23" />ENTER</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="24" />page+</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="25" />page-</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="32" />梯形修正</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="33" />图像</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="34" />ID SET</label>
<label class="button button-raised"><input v-on:click="SendCode1($event)" name="Code" type="radio" value="35" />自动调整</label>
</div>
</div>
</form>
</f7-tab>
<f7-tab class="block block-strong" :id="'tab_4'+model.Number">
<form class="ir type3" method="get" action="/App/ExecApi">
<input type="hidden" name="Number" :value="model.Number" />
<input type="hidden" name="Method" value="/Ir/Send" />
<input type="hidden" name="Type" value="5" />
<div class="row">
<div class="col-md-12 col-xs-12">
<label class="button button-raised" v-for="btn in GetButtons()"><input v-on:click="SendCode1($event)" name="Code" type="radio" :value="btn.Value" />{{btn.Name}}</label>
</div>
</div>
</form>
</f7-tab>
</f7-tabs>
</div>
</div>
<div class="card">
<div class="card-header">
遥控器匹配
<div class="row">
<label class="button button-raised" v-on:click="CallApi(model.Number,'/Ir/MathAir1')">空调匹配</label>
<label class="button button-raised" v-on:click="CallApi(model.Number,'/Ir/MathAir2')">电视匹配</label>
<label class="button button-raised" v-on:click="CallApi(model.Number,'/Ir/MathAir3')">机顶盒匹配</label>
</div>
</div>
</div>
<div class="card">
<div class="card-header">
自定义指令
<div class="row">
<label class="button button-raised" v-on:click="AddButton()">添加</label>
<label class="button button-raised" v-on:click="SaveButtons()">保存</label>
</div>
</div>
<div class="card-content card-content-padding" id="irbuttons" v-if="GetButtons().length">
<template v-for="btn in GetButtons()">
<div class="row form-group irbtn" style="padding:5px;">
<input class="col-33" style="line-height:28px;padding:2px;margin:5px auto;border:1px solid lightblue;" type="text" name="name" :value="btn.Name" placeholder="名称" />
<input class="col-33" style="line-height:28px;padding:2px;margin:5px auto;border:1px solid lightblue;" type="text" name="value" :value="btn.Value" placeholder="编码" />
<input class="col-33" style="line-height:28px;padding:2px;margin:5px auto;border:1px solid lightblue;" type="text" name="order" :value="btn.Order" placeholder="序号" />
</div>
<div class="col-100 row" style="padding:5px;">
<button class="col-33 button button-raised" v-on:click="Study(btn.Value)">学习</button>
<button class="col-33 button button-raised" v-on:click="TestButton(btn.Value)">使用</button>
<button class="col-33 button button-raised" v-on:click="RemoveButton(btn.Name)">移除</button>
</div>
</template>
</div>
</div>
</template>
<template v-else-if="model.Name==='串口控制器'">
<div class="card">
<div class="card-header">
{{model.DisplayName}}
</div>
<div class="card-content card-content-padding">
<form class="ir type3" method="get" action="/App/ExecApi">
<input type="hidden" name="Number" :value="model.Number" />
<input type="hidden" name="Method" value="/SerialPort/Send" />
<div class="row">
<div class="col-md-12 col-xs-12">
<label class="button button-raised" v-for="btn in GetSPButtons()"><input v-on:click="SendSPCmd($event)" name="Name" type="radio" :value="btn.Name" />{{btn.Name}}</label>
</div>
</div>
</form>
</div>
</div>
<div class="card">
<div class="card-header">
自定义指令
<div class="row">
<label class="button button-raised" v-on:click="AddSPButton()">添加</label>
<label class="button button-raised" v-on:click="SaveSPButtons()">保存</label>
</div>
</div>
<div class="card-content card-content-padding" id="irbuttons" v-if="GetButtons().length">
<div class="row form-group irbtn" v-for="btn in GetButtons()">
<input class="col-33" style="line-height:28px;padding:2px;margin:5px auto;border:1px solid lightblue;" type="text" name="Name" :value="btn.Name" placeholder="名称" />
<input class="col-33" style="line-height:28px;padding:2px;margin:5px auto;border:1px solid lightblue;" type="text" name="PortName" :value="btn.PortName" placeholder="串口" />
<input class="col-33" style="line-height:28px;padding:2px;margin:5px auto;border:1px solid lightblue;" type="text" name="BaudRate" :value="btn.BaudRate" placeholder="波特率" />
<input class="col-33" style="line-height:28px;padding:2px;margin:5px auto;border:1px solid lightblue;" type="text" name="DataBits" :value="btn.DataBits" placeholder="数据位" />
<input class="col-33" style="line-height:28px;padding:2px;margin:5px auto;border:1px solid lightblue;" type="text" name="Parity" :value="btn.Parity" placeholder="校验位" />
<input class="col-33" style="line-height:28px;padding:2px;margin:5px auto;border:1px solid lightblue;" type="text" name="StopBits" :value="btn.StopBits" placeholder="停止位" />
<input class="col-33" style="line-height:28px;padding:2px;margin:5px auto;border:1px solid lightblue;" type="text" name="Message" :value="btn.Message" placeholder="消息" />
<input class="col-33" style="line-height:28px;padding:2px;margin:5px auto;border:1px solid lightblue;" type="text" name="Order" :value="btn.Order" placeholder="序号" />
<div class="col-33" style="padding:8px 0;"><button class="button button-raised" v-on:click="RemoveSPButton(btn.Name)">移除</button></div>
</div>
</div>
</div>
</template>
<!--通用-->
<template v-else>
<div class="row" v-if="GetSimpleApis().length>0">
<div class="col-md-12">
<div class="card">
<div class="card-content">
<div class="row">
<label class="button button-raised" v-for="api in GetSimpleApis()" v-on:click="CallApi(model.Number,api.Path+api.Command)">{{api.Name}}</label>
</div>
</div>
</div>
</div>
</div>
<div class="=row" v-for="api in Enumerable.from(model.Product.Apis).orderBy('o=>o.Name')" v-if="api.Parameters.length>1">
<div class="card">
<div class="card-header">
<h3 class="card-title">{{api.Name}}</h3>
</div>
<div class="card-content card-content-padding">
<form class="form-horizontal">
<input type="hidden" name="Number" :value="model.Number" />
<input type="hidden" name="Method" :value="api.Method" />
<div class="form-group" v-for="parameter in api.Parameters" v-if="parameter.Name!=='number'">
<label :for="parameter.Name">{{parameter.Description}}:</label>
<template v-if="model.Name==='网关'&&api.Name==='删掉制定设备'&&parameter.Name==='设备编号'">
</template>
<template v-else>
<template v-if="parameter.Type==='string'">
<input type="text" class="form-control" :name="parameter.Name" :value="GetDataValueByKey(parameter.Name)" />
</template>
<template v-else>
<input type="text" class="form-control" :name="parameter.Name" :value="GetDataValueByKey(parameter.Name)" />
</template>
</template>
</div>
<div class="row">
<div class="col-sm-12">
<button class="button button-raised">确定</button>
</div>
</div>
</form>
</div>
</div>
</div>
</template>
</template>
</div>
</f7-page>
</f7-view>
</f7-app>
</div>
<script src="lib/signalr/signalr.min.js"></script>
<script src="lib/axios/axios.min.js"></script>
<script src="lib/urijs/URI.min.js"></script>
<script src="lib/linq/linq.min.js"></script>
<script src="lib/jquery/jquery.min.js"></script>
<script src="lib/jquery-validation/jquery.validate.min.js"></script>
<script src="lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"></script>
<script src="lib/vue/vue.min.js"></script>
<script src="lib/framework7/js/framework7.bundle.min.js"></script>
<script src="lib/framework7/js/framework7-vue.bundle.min.js"></script>
<script src="lib/flv.js/flv.min.js"></script>
<script src="lib/chart.js/Chart.bundle.min.js"></script>
<script src="lib/toastr/toastr.min.js"></script>
<script src="js/page.js"></script>
<script src="js/device.js"></script>
</body>
</html>