Former-commit-id: 900d87b584b0ef52f72cd291d53922b28951f4f6
TangShanKaiPing
wanggang 5 years ago
parent fb69b86ed6
commit a58eae7e12

@ -2,15 +2,15 @@
HideBread = true; HideBread = true;
} }
<br /> <br />
<template v-if="model"> <template v-if="product">
<div class="row mb-2"> <div class="row mb-2">
<div class="col-sm-6"> <div class="col-sm-6">
<h1>{{model.name}}</h1> <h1>{{product.name}}</h1>
</div> </div>
<div class="col-sm-6"> <div class="col-sm-6">
<ol class="breadcrumb float-sm-right"> <ol class="breadcrumb float-sm-right">
<li class="breadcrumb-item"><a href="/">产品列表</a></li> <li class="breadcrumb-item"><a href="/">产品列表</a></li>
<li class="breadcrumb-item active">{{model.name}}</li> <li class="breadcrumb-item active">{{product.name}}</li>
</ol> </ol>
</div> </div>
</div> </div>
@ -25,7 +25,7 @@
</div> </div>
<div class="card-tools"> <div class="card-tools">
<button class="btn btn-success" v-on:click="CallApiAll('On')">开</button> <button class="btn btn-success" v-on:click="CallApiAll('On')">开</button>
<button class="btn btn-success" v-on:click="CallApiAll('Stop')" v-if="model.name.indexOf('窗帘电机')>=0">停</button> <button class="btn btn-success" v-on:click="CallApiAll('Stop')" v-if="product.name.indexOf('窗帘电机')>=0">停</button>
<button class="btn btn-success" v-on:click="CallApiAll('Off')">关</button> <button class="btn btn-success" v-on:click="CallApiAll('Off')">关</button>
</div> </div>
</div> </div>
@ -41,8 +41,8 @@
<div class="card-tools"> {{GetDataValue(item.number,'状态')}}</div> <div class="card-tools"> {{GetDataValue(item.number,'状态')}}</div>
</template> </template>
</div> </div>
<a class="card-body" :href="'@Url.Content("~")/Home/Device?number='+item.number+'&productNumber='+model.number" style="display:block;text-align:center;"> <a class="card-body" :href="'@Url.Content("~")/Home/Device?number='+item.number+'&productNumber='+product.number" style="display:block;text-align:center;">
<img :alt="item.name" :src="'@Url.Content("~")'+model.image" style="margin:0 auto;max-width:64px;" /> <img :alt="item.name" :src="'@Url.Content("~")'+product.image" style="margin:0 auto;max-width:64px;" />
</a> </a>
<!-- 设备信息 Start --> <!-- 设备信息 Start -->
@ -57,9 +57,9 @@
</div> </div>
</div> </div>
<!-- 设备信息 End --> <!-- 设备信息 End -->
<div class="card-footer"> @*<div class="card-footer">
{{item.node.name}} {{item.node.name}}
</div> </div>*@
</div> </div>
</div> </div>
</div> </div>
@ -67,7 +67,94 @@
@section scripts{ @section scripts{
<script> <script>
var baseUrl = '@Url.Content("~")'; var baseUrl = '@Url.Content("~")';
var hubUrl = "@Url.Content("~")/hub?group=page";
var onMessage = null;
</script>
<script src="~/lib/WXInlinePlayer/index.js"></script>
<script src="~/js/util.js"></script>
<script src="~/js/iot.js"></script>
<script src="~/js/message.js"></script>
<script>
var app = new Vue({
el: '#app',
data() {
return {
title: "产品",
url: '/api/v1/product/getProducts',
product: null,
};
},
mounted: function () {
connect();
this.load();
},
methods: {
load: function () {
var vm = this;
axios.post(baseUrl + '/api/v1/product/getProduct?number=' + new URI().search(true).number).then(function (response) {
vm.product = response.data;
});
},
HasBatchCommand() {
return this.product.name === '调色灯'
|| this.product.name.indexOf('窗帘电机') >= 0
|| this.product.name.indexOf('开关') >= 0
|| this.product.name.indexOf('插座') >= 0;
},
GetDevices() {
return Enumerable.from(this.product.devices).orderBy(function (o) { return o.displayOrder; }).orderBy(function (o) { return o.name; }).toArray();
},
GetDataValue(number, name) {
var device = Enumerable.from(this.product.devices)
.where(function (o) { return o.number === number; })
.firstOrDefault();
if (device !== null) {
var data = Enumerable.from(device.data)
.where(function (o) { return o.name === name; })
.firstOrDefault();
if (data !== null) {
return data.value;
}
}
return null;
},
GetDeviceDataAttr(number, name, attr) {
var device = Enumerable.from(this.product.devices).where(function (o) { return o.number === number; }).firstOrDefault();
var data = Enumerable.from(device.data).where(o => o.name === name).firstOrDefault();
if (data !== null) {
return data[attr];
}
return null;
},
SelectDevice: Select,
CallApiAll(method) {
var numbers = [];
$('.item:checked').each(function () {
numbers.push($(this).val());
});
if (numbers.length) {
for (var i = 0; i < numbers.length; i++) {
execApi(numbers[i], this.product.path + method, null);
}
}
}
}
});
onMessage = function (method, json, to, from) {
var item = JSON.parse(json);
if (method === 'DeviceEntityInserted' ||
method === 'DeviceEntityUpdated' ||
method === 'DeviceEntityDeleted') {
loadData();
}
else if (method === 'DataEntityInserted' ||
method === 'DataEntityUpdated' ||
method === 'DataEntityDeleted') {
var device = Enumerable.from(app.product.devices).firstOrDefault(function (o) { return o.id === item.deviceId; });
if (device) {
updateById(device.data, item);
}
}
}
</script> </script>
<script src="~/js/page.js"></script>
<script src="~/js/product.js"></script>
} }

@ -1,17 +1,17 @@
//update //update
function updateById(list, item) { function updateById(list, item) {
return update(list, item, 'id'); return updateListItem(list, item, 'id');
} }
function updateByNumber(list, item) { function updateByNumber(list, item) {
return update(list, item, 'number'); return updateListItem(list, item, 'number');
} }
function updateByKey(list, item) { function updateByKey(list, item) {
return update(list, item, 'key'); return updateListItem(list, item, 'key');
} }
function update(list, item, key) { function updateListItem(list, item, key) {
key = key || 'number'; key = key || 'number';
var result = false; var result = false;
var to = Enumerable.from(list).where(function (o) { return o[key] === item[key]; }).firstOrDefault(); var to = Enumerable.from(list).where(function (o) { return o[key] === item[key]; }).firstOrDefault();
@ -87,4 +87,33 @@ function execScene(id) {
.finally(function () { .finally(function () {
loading.show(); loading.show();
}); });
}
//
function Select(e) {
var checkbox = $(e.target);
if (checkbox.hasClass('checkall')) {
if (e.target.checked) {
$('input.item:visible').not(':checked').prop("checked", true);
}
else {
$('input.item:visible').filter(':checked').prop("checked", false);
}
}
else if (checkbox.hasClass('uncheck')) {
$('input.item:visible').each(function () {
$(this).prop("checked", !$(this).prop("checked")).change();
});
}
var parent = $('input.checkall');
if ($('input.item').not(':checked').length === 0) {
parent.prop("indeterminate", false);
parent.prop("checked", true);
}
else if ($('input.item').filter(':checked').length === 0) {
parent.prop("indeterminate", false);
parent.prop("checked", false);
}
else {
parent.prop("indeterminate", true);
}
} }

@ -11,7 +11,7 @@
mounted: function () { mounted: function () {
console.log('当前路由:'); console.log('当前路由:');
console.log(this.$route); console.log(this.$route);
var url = '/IoTCenter/api/v1/product/getDevices?number='+this.$route.query.number; var url = '/IoTCenter/api/v1/product/getDevices?number=' + this.$route.query.number;
var component = this; var component = this;
axios.post(url) axios.post(url)
.then(function (response) { .then(function (response) {
@ -25,7 +25,7 @@
}, },
methods: { methods: {
} }
}) });
}); });
}); });
} }
Loading…
Cancel
Save