From a68413cb8f1976742c02f122aa4f51b4fd060c71 Mon Sep 17 00:00:00 2001
From: Pan <panfree23@gmail.com>
Date: Wed, 13 Dec 2017 13:52:14 +0800
Subject: [PATCH] refactor[errorLog]: save the logs in vuex

---
 src/errorLog.js                        | 18 ++++++++++--------
 src/store/errorLog.js                  | 13 -------------
 src/store/getters.js                   |  3 ++-
 src/store/index.js                     |  2 ++
 src/store/modules/errorLog.js          | 17 +++++++++++++++++
 src/views/layout/components/Navbar.vue | 12 +++---------
 6 files changed, 34 insertions(+), 31 deletions(-)
 delete mode 100644 src/store/errorLog.js
 create mode 100644 src/store/modules/errorLog.js

diff --git a/src/errorLog.js b/src/errorLog.js
index 53f6f16d..f5aa6644 100644
--- a/src/errorLog.js
+++ b/src/errorLog.js
@@ -1,15 +1,17 @@
 import Vue from 'vue'
-import errLog from '@/store/errorLog'
+import store from './store'
 
 // you can set only in production env show the error-log
 // if (process.env.NODE_ENV === 'production') {
-Vue.config.errorHandler = function(err, vm, info) {
-  errLog.pushLog({
-    err,
-    vm,
-    info,
-    url: window.location.href
+Vue.config.errorHandler = function(err, vm, info, a) {
+  Vue.nextTick(() => {
+    store.dispatch('addErrorLog', {
+      err,
+      vm,
+      info,
+      url: window.location.href
+    })
+    console.error(err, info)
   })
-  console.error(err, info)
 }
 // }
diff --git a/src/store/errorLog.js b/src/store/errorLog.js
deleted file mode 100644
index 6cfbe3cb..00000000
--- a/src/store/errorLog.js
+++ /dev/null
@@ -1,13 +0,0 @@
-const errLog = {
-  state: {
-    errLog: []
-  },
-  pushLog(log) {
-    this.state.errLog.unshift(log)
-  },
-  clearLog() {
-    this.state.errLog = []
-  }
-}
-
-export default errLog
diff --git a/src/store/getters.js b/src/store/getters.js
index 2227a606..8adc5e81 100644
--- a/src/store/getters.js
+++ b/src/store/getters.js
@@ -11,6 +11,7 @@ const getters = {
   roles: state => state.user.roles,
   setting: state => state.user.setting,
   permission_routers: state => state.permission.routers,
-  addRouters: state => state.permission.addRouters
+  addRouters: state => state.permission.addRouters,
+  errorLogs: state => state.errorLog.logs
 }
 export default getters
diff --git a/src/store/index.js b/src/store/index.js
index 0a3fa8be..24778fad 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -1,6 +1,7 @@
 import Vue from 'vue'
 import Vuex from 'vuex'
 import app from './modules/app'
+import errorLog from './modules/errorLog'
 import permission from './modules/permission'
 import tagsView from './modules/tagsView'
 import user from './modules/user'
@@ -11,6 +12,7 @@ Vue.use(Vuex)
 const store = new Vuex.Store({
   modules: {
     app,
+    errorLog,
     permission,
     tagsView,
     user
diff --git a/src/store/modules/errorLog.js b/src/store/modules/errorLog.js
new file mode 100644
index 00000000..50fc1b1a
--- /dev/null
+++ b/src/store/modules/errorLog.js
@@ -0,0 +1,17 @@
+const errorLog = {
+  state: {
+    logs: []
+  },
+  mutations: {
+    ADD_ERROR_LOG: (state, log) => {
+      state.logs.push(log)
+    }
+  },
+  actions: {
+    addErrorLog({ commit }, log) {
+      commit('ADD_ERROR_LOG', log)
+    }
+  }
+}
+
+export default errorLog
diff --git a/src/views/layout/components/Navbar.vue b/src/views/layout/components/Navbar.vue
index 14c7c69c..5d635adf 100644
--- a/src/views/layout/components/Navbar.vue
+++ b/src/views/layout/components/Navbar.vue
@@ -5,8 +5,7 @@
     <breadcrumb class="breadcrumb-container"></breadcrumb>
 
     <div class="right-menu">
-
-      <error-log v-if="log.length>0" class="errLog-container right-menu-item" :logsList="log"></error-log>
+      <error-log v-if="errorLogs.length>0" class="errLog-container right-menu-item" :logsList="errorLogs"></error-log>
 
       <el-tooltip effect="dark" content="全屏" placement="bottom">
         <screenfull class="screenfull right-menu-item"></screenfull>
@@ -58,7 +57,6 @@ import Hamburger from '@/components/Hamburger'
 import ThemePicker from '@/components/ThemePicker'
 import Screenfull from '@/components/Screenfull'
 import ErrorLog from '@/components/ErrorLog'
-import errLogStore from '@/store/errorLog'
 
 export default {
   components: {
@@ -68,17 +66,13 @@ export default {
     ErrorLog,
     Screenfull
   },
-  data() {
-    return {
-      log: errLogStore.state.errLog
-    }
-  },
   computed: {
     ...mapGetters([
       'sidebar',
       'name',
       'avatar',
-      'language'
+      'language',
+      'errorLogs'
     ])
   },
   methods: {