update vuex version and update components for new vuex

Author: tyllo

package.json

@@ -44,7 +44,7 @@
  "vue-i18n": "^2.4.1",
  "vue-resource": "^0.7.0",
  "vue-router": "^0.7.11",
- "vuex": "^0.2.0",
+ "vuex": "^0.6.2",
  "webpack-stream": "2.1.0"
  },
  "scripts": {

src/components/navbar/index.js

@@ -1,5 +1,4 @@
 import load from 'promise?global,[name].promise!commons'
-import store from 'store'
 import template from './template.jade'
 import style from './style.scss'
 
@@ -11,11 +10,14 @@ export default res => load().then( ({ F7 }) => res({
  state: { type: String, default: 'index' },
  },
  template: template({name, style}),
- computed: {
- progress() {
- return store.state.progress
+
+ vuex: {
+ getters: {
+ progress: state => state.progress.active,
  },
+ },
 
+ computed: {
  isIndex() {
  return this.state === 'index'
  },
@@ -32,7 +34,7 @@ export default res => load().then( ({ F7 }) => res({
  if (this.isIndex) {
  F7.openPanel('left')
  } else {
- window.history.back()
+ this.$router.go(window.history.back())
  }
  },
  },

src/components/panel-left/index.js

@@ -1,23 +1,31 @@
 import load from 'promise?global,[name].promise!commons'
-import store from 'store'
+import formatSumm from 'mixins/filters/formatSumm'
+
 import menu from './menu'
 import style from './style.scss'
-import formatSumm from 'mixins/filters/formatSumm'
 import template from './template.jade'
 
 export let name = 'panel-left'
 
 var image = '//vsct.info/assets/i/jpg/main_svcs_01.jpg'
 
 export default resolve => load().then( ({ isIos }) => resolve({
+ mixins: [formatSumm],
  template: template({name, style}),
+
+ vuex: {
+ getters: {
+ companyName: state => state.auth.name_expeditor,
+ summa: state => state.advance.summa,
+ gravatar_hash: state => state.settings.gravatar_hash,
+ },
+ },
+
  data: () => ({isIos, menu, image}),
- mixins: [formatSumm],
+
  computed: {
- companyName: () => store.state.auth.name_expeditor,
- summa: () => store.state.advance.summa,
  src() {
- var hash = store.state.settings.gravatar_hash
+ var hash = this.$get('gravatar_hash')
  return hash ? `//s.gravatar.com/avatar/${hash}?s=80` : null
  },
  style() {

src/components/popover-lang/index.js

@@ -1,19 +1,22 @@
-/* globals DEBUG */
-
 import load from 'promise?global,[name].promise!commons'
-import store from 'store'
+import { changeLang } from 'vuex/actions'
+
 import template from './template.jade'
 import style from './style.scss'
 
 export let name = 'popover-lang'
 
 export default res => load().then( ({ F7 }) => res({
  template: template({name, style}),
- computed: {
- langs() {
- return store.state.locales.langs
- }
+
+ vuex: {
+ actions: { changeLang },
+
+ getters: {
+ langs: state => state.locales.langs
+ },
  },
+
  events: {
  ['open:popup:langs'] (target) {
  F7.popover(this.$els.popover, target)
@@ -22,11 +25,13 @@ export default res => load().then( ({ F7 }) => res({
  this.openActionSheet()
  },
  },
+
  methods: {
  changeLang(lang) {
  F7.closeModal(this.$els.popover)
- store.actions.changeLang(lang)
+ this.changeLang(lang)
  },
+
  openActionSheet() {
  var buttons = this.$get('langs').map( lang => ({
  text: lang.value,

src/components/popover-order/index.js

@@ -1,36 +1,47 @@
-/* globals DEBUG */
-
 import load from 'promise?global,[name].promise!commons'
-import store from 'store'
+import { changeOrder } from 'vuex/actions'
+
 import template from './template.jade'
 import style from './style.scss'
 
 export let name = 'popover-order'
 
 export default res => load().then( ({ F7 }) => res({
- template: template({name, style}),
+ template: template({ name, style }),
+
+ vuex: {
+ actions: { changeOrder },
+
+ getters: {
+ locales: state => state.locales,
+ },
+ },
+
  data: () => ({
  name: null,
  }),
+
  computed: {
  sortList() {
- var current = store.state.locales.current
  var name = this.$get('name')
- return name ? current[name].sortList : {}
+ return name ? this.$get('locales')[name].sortList : {}
  }
  },
+
  events: {
- ['open:popup:order'] ({target, name}) {
+ ['open:popup:order'] ({ target, name }) {
  this.$set('name', name)
  F7.popover(this.$els.popover, target)
  }
  },
+
  methods: {
  changeOrder(orderName) {
- store.actions.changeOrder({
+ this.changeOrder({
  orderName,
  name: this.$get('name'),
  })
+
  F7.closeModal(this.$els.popover)
  },
  },

src/fixtures/auth.js

@@ -20,9 +20,9 @@ export function login() {
  ready_check: randomNumb % 2,
  create_at: randomDate(),
  login: 'demo',
- check_cnt: randomNumb % 2,
- check_doc: randomNumb % 2,
- check_zayav: randomNumb % 2,
+ check_cnt: randomNumb() % 2,
+ check_doc: randomNumb() % 2,
+ check_zayav: randomNumb() % 2,
  name_expeditor: 'Demo name',
  }))
 }

src/initials/F7.js

@@ -23,9 +23,7 @@ Object.assign(F7, new Framework7({
  swipeBackPageAnimateOpacity: false,
 }))
 
-console.log(F7)
 // http://goo.gl/0VB8sl
-
 // if (NODE_ENV === 'production') {
 // Dom7('head').append(`<link rel="stylesheet" href="assets/styles/${platform}.css">`)
 // }

src/mixins/global.js

@@ -1,12 +1,13 @@
 /* global DEBUG */
 
 import { F7 } from 'commons'
-import store from 'store'
+import store from 'vuex/store'
 
 export default {
  ready() {
  DEBUG && console.log('init component %s', this.$options.name)
  var mainView = store.mainView
+
  mainView.router.loadContent(this.$els.page)
  F7.params.swipePanel = 'left' // this.$route.panel
  },

src/modules/app/index.js

@@ -1,22 +1,27 @@
 /* global DEBUG */
 
 import { F7 } from 'commons'
-import store from 'store'
+import store from 'vuex/store'
 import template from './template.jade'
 
 var name = 'app'
 
 export default {
- name: name,
+ name,
+ store,
  template: template(),
+
+ vuex: {
+ getters: {
+ auth: state => state.auth.login,
+ },
+ },
+
  ready() {
  DEBUG && console.log('init', name)
 
  F7.init()
  var mainView = F7.addView(this.$els.view, {})
  store.mainView = mainView
  },
- computed: {
- auth: () => store.state.auth.login,
- }
 }

src/modules/main.js

@@ -2,7 +2,7 @@
 
 import load from 'promise?global,[name].promise!commons'
 import style from 'promise?global,[name].promise!android'
-import store from 'store'
+import store from 'vuex/store'
 import Storage from 'services/Storage'
 import app from 'modules/app'