diff --git a/src/prog/dashboard3/package-lock.json b/src/prog/dashboard3/package-lock.json
index ecb3cf15..5ca9d30e 100644
--- a/src/prog/dashboard3/package-lock.json
+++ b/src/prog/dashboard3/package-lock.json
@@ -3454,6 +3454,23 @@
             "number-is-nan": "^1.0.0"
           }
         },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
+          "dev": true,
+          "requires": {
+            "ansi-regex": "^3.0.0"
+          },
+          "dependencies": {
+            "ansi-regex": {
+              "version": "3.0.0",
+              "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+              "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
+              "dev": true
+            }
+          }
+        },
         "wrap-ansi": {
           "version": "2.1.0",
           "resolved": "http://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
@@ -4857,6 +4874,23 @@
         "strip-json-comments": "~2.0.1",
         "table": "4.0.2",
         "text-table": "~0.2.0"
+      },
+      "dependencies": {
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
+          "dev": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
+          "dev": true,
+          "requires": {
+            "ansi-regex": "^3.0.0"
+          }
+        }
       }
     },
     "eslint-config-standard": {
@@ -4879,11 +4913,26 @@
         "text-table": "^0.2.0"
       },
       "dependencies": {
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
+          "dev": true
+        },
         "minimist": {
           "version": "1.2.0",
           "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
           "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
           "dev": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
+          "dev": true,
+          "requires": {
+            "ansi-regex": "^3.0.0"
+          }
         }
       }
     },
@@ -6891,6 +6940,23 @@
         "string-width": "^2.1.0",
         "strip-ansi": "^4.0.0",
         "through": "^2.3.6"
+      },
+      "dependencies": {
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
+          "dev": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
+          "dev": true,
+          "requires": {
+            "ansi-regex": "^3.0.0"
+          }
+        }
       }
     },
     "internal-ip": {
@@ -7479,8 +7545,7 @@
     "lodash.clonedeep": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
-      "integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8=",
-      "dev": true
+      "integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8="
     },
     "lodash.debounce": {
       "version": "4.0.8",
@@ -13423,6 +13488,23 @@
       "requires": {
         "is-fullwidth-code-point": "^2.0.0",
         "strip-ansi": "^4.0.0"
+      },
+      "dependencies": {
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
+          "dev": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
+          "dev": true,
+          "requires": {
+            "ansi-regex": "^3.0.0"
+          }
+        }
       }
     },
     "string_decoder": {
@@ -13446,20 +13528,12 @@
       }
     },
     "strip-ansi": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
-      "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
+      "version": "3.0.1",
+      "resolved": "http://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+      "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
       "dev": true,
       "requires": {
-        "ansi-regex": "^3.0.0"
-      },
-      "dependencies": {
-        "ansi-regex": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
-          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
-          "dev": true
-        }
+        "ansi-regex": "^2.0.0"
       }
     },
     "strip-bom": {
@@ -14450,6 +14524,14 @@
       "integrity": "sha512-wLoqz0B7DSZtgbWL1ShIBBCjv22GV5U+vcBFox658g6V0s4wZV9P4YjCNyoHSyIBpj1f29JBoNQIqD82cR4O3w==",
       "dev": true
     },
+    "vuex-rest-api": {
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/vuex-rest-api/-/vuex-rest-api-2.10.0.tgz",
+      "integrity": "sha512-xzPXj7ytH+QF/rS6gTUq6tzDTY6pLF6JDajjJcNSQE0Uu1mKNNKsXaSooLBBcKHBLeswiPJbG39FEdY0HNz7dQ==",
+      "requires": {
+        "lodash.clonedeep": "4.5.x"
+      }
+    },
     "watchpack": {
       "version": "1.6.0",
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.6.0.tgz",
@@ -15012,6 +15094,23 @@
       "requires": {
         "string-width": "^2.1.1",
         "strip-ansi": "^4.0.0"
+      },
+      "dependencies": {
+        "ansi-regex": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
+          "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
+          "dev": true
+        },
+        "strip-ansi": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
+          "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
+          "dev": true,
+          "requires": {
+            "ansi-regex": "^3.0.0"
+          }
+        }
       }
     },
     "wrappy": {
diff --git a/src/prog/dashboard3/package.json b/src/prog/dashboard3/package.json
index 465d1c1c..cec9b013 100644
--- a/src/prog/dashboard3/package.json
+++ b/src/prog/dashboard3/package.json
@@ -14,7 +14,8 @@
     "axios": "^0.18.0",
     "loadash": "^1.0.0",
     "npm": "^6.4.1",
-    "vue-axios": "^2.1.1"
+    "vue-axios": "^2.1.1",
+    "vuex-rest-api": "^2.10.0"
   },
   "devDependencies": {
     "babel-eslint": "^8.2.1",
diff --git a/src/prog/dashboard3/src/api/domo.js b/src/prog/dashboard3/src/api/domo.js
index e42fcf29..70e2e4d0 100644
--- a/src/prog/dashboard3/src/api/domo.js
+++ b/src/prog/dashboard3/src/api/domo.js
@@ -51,7 +51,7 @@ export default {
     })
   },
   // server: '',
-  server: 'http://192.168.1.129:8080',
+  baseURL: 'http://192.168.1.129:8080',
   timeout: 1000,
   etag_timeout: 10,
   route: {
diff --git a/src/prog/dashboard3/src/components/.gitkeep b/src/prog/dashboard3/src/components/.gitkeep
deleted file mode 100644
index e69de29b..00000000
diff --git a/src/prog/dashboard3/src/components/domo-item.vue b/src/prog/dashboard3/src/components/domo-item.vue
index b1c5d017..daa750cd 100644
--- a/src/prog/dashboard3/src/components/domo-item.vue
+++ b/src/prog/dashboard3/src/components/domo-item.vue
@@ -13,9 +13,12 @@ export default {
   props: {
     data: {}
   },
+  created () {
+    // console.log('domo-item created')
+  },
   watch: {
     'data.state': function (newState) {
-      this.$emit('on-change', this.data)
+      this.$emit('state-change', this.data)
     }
   }
 }
diff --git a/src/prog/dashboard3/src/pages/sprinklers.vue b/src/prog/dashboard3/src/pages/sprinklers.vue
index 1d002b95..404f993a 100644
--- a/src/prog/dashboard3/src/pages/sprinklers.vue
+++ b/src/prog/dashboard3/src/pages/sprinklers.vue
@@ -3,51 +3,38 @@
     <!-- content -->
     <q-list>
       <q-list-header>Sprinklers</q-list-header>
-      <q-item link v-ripple.mat v-for="sprinkler in sprinklers" :key="sprinkler.id">
-        <q-item-side icon="settings" />
-        <q-item-main :label="sprinkler.name" />
-        <q-item-side right>
-        <q-toggle :val="sprinkler.state" @click="updateSprinkler(sprinkler)" />
-      </q-item-side>
-  </q-item>
+      <div v-for="sprinkler in sprinklers" :key="sprinkler.id">
+        <domo-item :data="sprinkler" v-on:state-change="updateSprinkler" />
+      </div>
     </q-list>
   </q-page>
 </template>
 
 <script>
 import DomoItem from 'components/domo-item'
-import _ from 'lodash'
+import { mapState, mapActions } from 'vuex'
 
 export default {
   name: 'PageSprinklers',
   components: {
     DomoItem
   },
-  data () {
-    return {
-      sprinklers: _.cloneDeep(this.$store.state.sprinklers.all)
-    }
-  },
-  created () {
+  computed: mapState({
+    sprinklers: state => state.sprinklers
+  }),
+  async created () {
     console.log('created')
-    this.$store.dispatch('sprinklers/load')
-    console.log('sprin', this.sprinklers)
-  },
-  watch: {
-    sprinklers: {
-      handler: _.debounce(function (sprinkler) {
-        console.log('update sprinkler')
-        this.$store.commit('sprinklers/update', sprinkler)
-      }, 500),
-      deep: true
-    }
+    await this.listSprinklers()
   },
   methods: {
+    ...mapActions([
+      'listSprinklers',
+      'updateSprinklers'
+    ]),
     updateSprinkler (sprinkler) {
-      console.log('updateSprinkler', sprinkler)
-      /* this.$store.commit('updateUser', {
-         [field]: value
-     }); */
+      console.log('updateSprinkler: ', sprinkler)
+      const params = { id: sprinkler.id }
+      this.updateSprinklers({ params, sprinkler })
     }
   }
 }
diff --git a/src/prog/dashboard3/src/store/index.js b/src/prog/dashboard3/src/store/index.js
index f18cd134..34663f94 100644
--- a/src/prog/dashboard3/src/store/index.js
+++ b/src/prog/dashboard3/src/store/index.js
@@ -6,14 +6,14 @@ import sprinklers from './modules/sprinklers'
 
 Vue.use(Vuex)
 
-const debug = process.env.NODE_ENV !== 'production'
+// const debug = process.env.NODE_ENV !== 'production'
 
 const store = new Vuex.Store({
   modules: {
-    domoStore,
-    sprinklers
+    domoStore
   },
-  strict: debug
+  ...sprinklers,
+  strict: false
 })
 
 export default store
diff --git a/src/prog/dashboard3/src/store/modules/sprinklers.js b/src/prog/dashboard3/src/store/modules/sprinklers.js
index 1b27a59c..ce817a3a 100644
--- a/src/prog/dashboard3/src/store/modules/sprinklers.js
+++ b/src/prog/dashboard3/src/store/modules/sprinklers.js
@@ -1,112 +1,43 @@
+import Vapi from 'vuex-rest-api'
 import api from '../../api/domo'
 
-// initial state
-// shape: [{ id, quantity }]
-const state = {
-  all: []
-}
-
-// getters
-const getters = {
-/*
-  cartProducts: (state, getters, rootState) => {
-    return state.items.map(({ id, quantity }) => {
-      const product = rootState.products.all.find(product => product.id === id)
-      return {
-        title: product.title,
-        price: product.price,
-        quantity
-      }
-    })
-  },
-
-  cartTotalPrice: (state, getters) => {
-    return getters.cartProducts.reduce((total, product) => {
-      return total + product.price * product.quantity
-    }, 0)
+const sprinklers = new Vapi({
+  baseURL: api.baseURL,
+  state: {
+    sprinklers: []
   }
-  */
-}
-
-// actions
-const actions = {
-  load ({ commit }) {
-    api.request(api.route.v1.sprinklers.get)
-      .then(data => {
-        console.log('on est la.', data)
-        commit('SET_SPRINKLERS', data.data.sprinklers)
-      })
-  }
-}
-
-/*
-  checkout ({ commit, state }, products) {
-    const savedCartItems = [...state.items]
-    commit('setCheckoutStatus', null)
-    // empty cart
-    commit('setCartItems', { items: [] })
-    shop.buyProducts(
-      products,
-      () => commit('setCheckoutStatus', 'successful'),
-      () => {
-        commit('setCheckoutStatus', 'failed')
-        // rollback to the cart saved before sending the request
-        commit('setCartItems', { items: savedCartItems })
-      }
-    )
-  },
-
-  addProductToCart ({ state, commit }, product) {
-    commit('setCheckoutStatus', null)
-    if (product.inventory > 0) {
-      const cartItem = state.items.find(item => item.id === product.id)
-      if (!cartItem) {
-        commit('pushProductToCart', { id: product.id })
-      } else {
-        commit('incrementItemQuantity', cartItem)
-      }
-      // remove 1 item from stock
-      commit('products/decrementProductInventory', { id: product.id }, { root: true })
+})
+  .get({
+    action: 'listSprinklers',
+    property: 'list',
+    path: '/v1/sprinklers',
+    onSuccess: (state, payload, axios, { params, data }) => {
+      // if you set the onSuccess function you have to set the state manually
+      // console.log('success avec ', payload)
+      state.sprinklers = payload.data.sprinklers
     }
-  }
-*/
+  })
+
+  .put({
+    action: 'updateSprinklers',
+    property: 'update',
+    path: ({id}) => `/v1/sprinklers/${id}`
+  })
 
-// mutations
-const mutations = {
-  SET_SPRINKLERS (state, sprinklers) {
-    console.log('sprinkler', sprinklers)
-    state.all = sprinklers
-  },
-  update (state, sprinkler) {
-    console.log('>>>sprinkler', sprinkler)
-  }
 /*
-  pushProductToCart (state, { id }) {
-    state.items.push({
-      id,
-      quantity: 1
-    })
-  },
+  .get({
+    action: 'getPost',
+    property: 'post',
+    path: ({ id }) => `/posts/${id}`
+  })
 
-  incrementItemQuantity (state, { id }) {
-    const cartItem = state.items.find(item => item.id === id)
-    cartItem.quantity++
-  },
-
-  setCartItems (state, { items }) {
-    state.items = items
-  },
-
-  setCheckoutStatus (state, status) {
-    state.checkoutStatus = status
-  }
+  .post({
+    action: 'updatePost',
+    property: 'post',
+    path: ({ id }) => `/posts/${id}`
+  })
 */
-}
+  // Step 4
+  .getStore()
 
-export default {
-  namespaced: true,
-  state,
-  getters,
-  actions,
-  mutations
-}
+export default sprinklers