Set Light is now functional when clic on a switch button.

This commit is contained in:
2016-05-09 23:08:17 +02:00
parent 8e6ea46803
commit ed18b11c6a
2 changed files with 18 additions and 75 deletions

View File

@@ -5,7 +5,7 @@
<inline-desc v-if="inlineDesc">{{inlineDesc}}</inline-desc> <inline-desc v-if="inlineDesc">{{inlineDesc}}</inline-desc>
</div> </div>
<div class="weui_cell_ft"> <div class="weui_cell_ft">
<input class="weui_switch" type="checkbox" :disabled="disabled" v-model="value"/> <input class="weui_switch" type="checkbox" :disabled="disabled" v-model="data.state"/>
</div> </div>
</div> </div>
</template> </template>
@@ -27,27 +27,19 @@ export default {
} }
}, },
props: { props: {
title: {
type: String,
required: true
},
data: {}, data: {},
disabled: { disabled: {
type: Boolean, type: Boolean,
default: false default: false
}, },
value: {
type: Boolean,
twoWay: true
},
inlineDesc: { inlineDesc: {
type: String type: String
} }
}, },
ready: function () {}, ready: function () {},
watch: { watch: {
value: function (newVal) { 'data.state': function (newState) {
this.$dispatch('on-change', newVal) this.$dispatch('on-change', this.data)
} }
} }
} }

View File

@@ -1,11 +1,7 @@
<template> <template>
<h1>Lights</h1> <h1>Lights</h1>
<group> <group>
<light v-for="item in lights" :data="item" @on-change="setLight"></light>
<!--<div v-for="(index, item) in items">
{{ index }} {{ item.message }}
-->
<light v-for="item in lights" :data="item" :value="item.state" @on-change="change"></light>
</group> </group>
</template> </template>
@@ -33,9 +29,7 @@ export default {
Light Light
}, },
methods: { methods: {
change (e) { /* Get Lights */
console.log(e)
},
getLights () { getLights () {
this.$http.get('http://192.168.1.6:8081/v1/capabilities/lights') this.$http.get('http://192.168.1.6:8081/v1/capabilities/lights')
.then(function (response) { .then(function (response) {
@@ -44,64 +38,21 @@ export default {
}, function (err) { }, function (err) {
console.log(err) console.log(err)
}) })
},
/* Set Light */
setLight (data) {
var msg = ''
console.log(data)
msg = '{"id": ' + data.id + ', "state": ' + data.state + '}'
console.log(msg)
this.$http.post('http://192.168.1.6:8081/v1/capabilities/lights', msg)
.then(function (response) {
console.log('Success!:', response.data)
}, function (err) {
console.log(err)
})
} }
} }
} }
</script> </script>
<!--
// GET request
this.$http({url: '/someUrl', method: 'GET'}).then(function (response) {
// success callback
}, function (response) {
// error callback
});
quote: ''
}
},
methods: {
getQuote() {
this.$http
.get('http://localhost:3001/api/random-quote', (data) => {
this.quote = data;
})
.error((err) => console.log(err))
}
lightProvider.service ('LightService', function ($http, $q) {
// Get the Array of All the Lights.
this.getLights = function() {
return $http.get('/v1/capabilities/lights').then (function (results) {
// Result of the Get.
if (results.data.response_code == 200)
return results.data.Lights;
else
return $q.reject(results.data.status);
}, function(error) {
return $q.reject('Failed to make the Request');
});
};
// Set a new Light State.
this.setLight = function ($id, $state) {
msg = '{"id": '+ $id + ', "state": ' + $state + '}';
return $http.post('/v1/capabilities/lights', msg).then (function (results) {
if (results.data.response_code == 200)
return $q.resolve(results.data.status);
else
return $q.reject(results.data.status);
}, function(error) {
return $q.reject('Failed to make the Request');
});
};
});
-->