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.
iot/projects/WebApp/wwwroot/pages/iot/node.html

72 lines
3.7 KiB

<div class="page js_show" v-if="node">
<mt-header :title="node.name">
<router-link to="/pages/iot/nodes" slot="left">
<mt-button icon="back">back</mt-button>
</router-link>
</mt-header>
<!--场景-->
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="card-header">场景</div>
<div class="card-body">
<button class="btn btn-success mr-1" v-for="scene in scenes" v-on:click="CallScene(scene.Id)">{{scene.name}}</button>
</div>
</div>
</div>
</div>
<div class="col-md-12 py-2">环境</div>
<!--环境-->
<div class="row">
<div class="col-lg-3 col-md-4 col-sm-6" v-for="device in getDevices('温湿度传感器')">
<div class="card">
<div class="card-header">
{{device.displayName}}
<span class="float-right text-success" v-if="device.isOnline"><i class="ion ion-ios-wifi"></i></span>
<span class="float-right text-danger" v-else><i class="ion ion-ios-wifi"></i></span>
</div>
<div class="card-body">
<div class="row" style="height:100px;">
<div class="col-md-4 text-center">
<img class="mh-100" src="/IoTCenter/images/humiture.png" />
</div>
<div class="col-md-8">
<div class="row" style="height:50px;line-height:28px;">
<span>温度:</span>
<span class="text-success mx-2" style="font-size:28px;" v-if="getDeviceDataAttr(device.number,'温度','description')==='适中'">
{{getDeviceDataAttr(device.number,'温度','description')}}
</span>
<span v-else class="text-danger" style="font-size:28px;">
{{getDeviceDataAttr(device.number,'温度','description')}}
</span>
<span>{{getDeviceDataAttr(device.number,'温度','value')}}{{ getDeviceDataAttr(device.number,'温度','unit')}}</span>
</div>
<div class="row" style="height:50px;line-height:28px;">
<span>湿度:</span>
<span class="text-success" style="font-size:28px;" v-if="getDeviceDataAttr(device.number,'湿度','description')==='适中'">
{{getDeviceDataAttr(device.number,'湿度','description')}}
</span>
<span v-else class="text-danger mx-2" style="font-size:28px;">
{{getDeviceDataAttr(device.number,'湿度','description')}}
</span>
<span>{{getDeviceDataAttr(device.number,'湿度','value')}}{{ getDeviceDataAttr(device.number,'湿度','unit')}}</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12" v-if="node">
<div class="row">
<template v-if="node">
<div v-for="device in node.devices" class="col-lg-3 col-md-4 col-sm-6 p-1">
<div class="weui-grid__icon">
<img :src="'/IoTCenter'+device.product.image" />
</div>
<p class="weui-grid__label">{{device.displayName}}</p>
</div>
</template>
</div>
</div>
</div>