update

Former-commit-id: 900d87b584b0ef52f72cd291d53922b28951f4f6

projects/IoTCenter/Views/Home/Product.cshtml

@@ -2,15 +2,15 @@
     HideBread = true;
 }
 <br />
-<template v-if="model">
+<template v-if="product">
     <div class="row mb-2">
         <div class="col-sm-6">
-            <h1>{{model.name}}</h1>
+            <h1>{{product.name}}</h1>
         </div>
         <div class="col-sm-6">
             <ol class="breadcrumb float-sm-right">
                 <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>
         </div>
     </div>
@@ -25,7 +25,7 @@
                     </div>
                     <div class="card-tools">
                         <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>
                     </div>
                 </div>
@@ -41,8 +41,8 @@
                         <div class="card-tools"> {{GetDataValue(item.number,'状态')}}</div>
                     </template>
                 </div>
-                <a class="card-body" :href="'@Url.Content("~")/Home/Device?number='+item.number+'&productNumber='+model.number" style="display:block;text-align:center;">
-                    <img :alt="item.name" :src="'@Url.Content("~")'+model.image" style="margin:0 auto;max-width:64px;" />
+                <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("~")'+product.image" style="margin:0 auto;max-width:64px;" />
                 </a>
                 <!-- 设备信息 Start -->
 
@@ -57,9 +57,9 @@
                     </div>
                 </div>
                 <!-- 设备信息 End -->
-                <div class="card-footer">
-                    {{item.node.name}}
-                </div>
+                @*<div class="card-footer">
+                        {{item.node.name}}
+                    </div>*@
             </div>
         </div>
     </div>
@@ -67,7 +67,94 @@
 @section scripts{
     <script>
         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 src="~/js/page.js"></script>
-    <script src="~/js/product.js"></script>
 }

projects/IoTCenter/wwwroot/js/util.js

@@ -1,17 +1,17 @@
 //update
 function updateById(list, item) {
-    return update(list, item, 'id');
+    return updateListItem(list, item, 'id');
 }
 
 function updateByNumber(list, item) {
-    return update(list, item, 'number');
+    return updateListItem(list, item, 'number');
 }
 
 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';
     var result = false;
     var to = Enumerable.from(list).where(function (o) { return o[key] === item[key]; }).firstOrDefault();
@@ -87,4 +87,33 @@ function execScene(id) {
         .finally(function () {
             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);
+    }
 }

projects/IoTCenter/wwwroot/product.js

@@ -11,7 +11,7 @@
                 mounted: function () {
                     console.log('当前路由：');
                     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;
                     axios.post(url)
                         .then(function (response) {
@@ -25,7 +25,7 @@
                 },
                 methods: {
                 }
-            })
+            });
         });
     });
 }