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.
75 lines
2.5 KiB
75 lines
2.5 KiB
@{
|
|
ViewData["IsHomePage"] = true;
|
|
}
|
|
<div class="row">
|
|
<div class="col-md-2 col-sm-4 col-xs-6" v-for="p in Products">
|
|
<div class="box box-solid">
|
|
<div class="box-header with-border">
|
|
<h3 class="box-title" style="font-size:12px;">{{p.Name}}</h3>
|
|
<div class="pull-right box-tools">设备：{{p.DeviceCount}}</div>
|
|
</div>
|
|
<a class="box-body" :href="'Home/Product/id'+p.Id" style="display:block;text-align:center;">
|
|
<img :alt="p.Name" :src="p.Image" style="margin:0 auto;max-width:100%;" />
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@section scripts{
|
|
<script>
|
|
var vm = new Vue({
|
|
el: '#app',
|
|
data: {
|
|
Products: []
|
|
},
|
|
mounted() {
|
|
this.load();
|
|
},
|
|
methods: {
|
|
load: function () {
|
|
var url = '/Home/GetProducts?_='+Date.now()
|
|
axios.post(url)
|
|
.then(function (response) {
|
|
vm.Products = response.data;
|
|
})
|
|
.catch(function (error) {
|
|
alert(error, '警告', function () { })
|
|
});
|
|
}
|
|
}
|
|
});
|
|
</script>
|
|
<script>
|
|
var debug = true;
|
|
var wsUrl = '/hub?group=page';
|
|
var connectionId;
|
|
const connection = new signalR.HubConnectionBuilder()
|
|
.withUrl(wsUrl)
|
|
.build();
|
|
function connect() {
|
|
if (debug) { console.log('start connect to server:' + Date()); }
|
|
connection.start().then(function () {
|
|
|
|
}).catch(function (err) {
|
|
console.error(err.toString());
|
|
setTimeout(connect, 15 * 1000);
|
|
});
|
|
}
|
|
connection.on('Connected', function (id) {
|
|
connectionId = id;
|
|
console.log(connectionId);
|
|
});
|
|
connection.onclose(function (err) {
|
|
console.error(err);
|
|
setTimeout(connect, 15 * 1000);
|
|
});
|
|
connection.on("ServerToClient", function (method, json, from) {
|
|
console.log(method + ':' + json);
|
|
if (method == 'ProductEntityInserted' ||
|
|
method == 'DeviceEntityInserted' ||
|
|
method == 'DeviceEntityDeleted') {
|
|
vm.load();
|
|
}
|
|
});
|
|
setTimeout(connect, 0);
|
|
</script>
|
|
} |