From afb4daf19d480ed3877b3b959ad8cb13a141b9e0 Mon Sep 17 00:00:00 2001
From: jiutianzhiyu <jiutianzhiyu@qq.com>
Date: Thu, 25 Mar 2021 19:47:32 +0800
Subject: [PATCH] =?UTF-8?q?=E8=87=AA=E5=AE=9A=E4=B9=89=E6=8C=87=E4=BB=A4?=
 =?UTF-8?q?=E5=A4=84=E7=90=86=E5=A4=B4=E5=83=8F=E5=8A=A0=E8=BD=BD=E5=A4=B1?=
 =?UTF-8?q?=E8=B4=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/directives/index.js          | 11 ++++
 src/layout/components/Navbar.vue |  7 +--
 src/main.js                      | 87 ++++++++++++++++----------------
 3 files changed, 56 insertions(+), 49 deletions(-)
 create mode 100644 src/directives/index.js

diff --git a/src/directives/index.js b/src/directives/index.js
new file mode 100644
index 0000000..dd0486c
--- /dev/null
+++ b/src/directives/index.js
@@ -0,0 +1,11 @@
+import Vue from 'vue'
+// 全局指令: 图片加载失败
+Vue.directive('imgerror', {
+  // dom被插入到组件中时, 第二个参数
+  inserted(el, options) {
+    // console.log(el)
+    el.onerror = function() {
+      el.src = options.value
+    }
+  }
+})
diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue
index ebb4cc3..b1cb5d6 100644
--- a/src/layout/components/Navbar.vue
+++ b/src/layout/components/Navbar.vue
@@ -11,7 +11,7 @@
     <div class="right-menu">
       <el-dropdown class="avatar-container" trigger="click">
         <div class="avatar-wrapper">
-          <img src="$store.getters.staffPhoto" class="user-avatar" @error="photoErrorHandle">
+          <img v-imgerror="require('@/assets/common/bigUserHeader.png')" src="$store.getters.staffPhoto" class="user-avatar">
           <span class="name">{{ $store.getters.name }}</span>
           <i class="el-icon-caret-bottom" style="color:#fff" />
         </div>
@@ -54,11 +54,6 @@ export default {
     async logout() {
       await this.$store.dispatch('user/logout')
       this.$router.push(`/login?redirect=${this.$route.fullPath}`)
-    },
-    // 头像加载失败处理
-    photoErrorHandle(e) {
-      // console.log(e.target)
-      e.target.src = 'https://dss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1851283359,3457678391&fm=26&gp=0.jpg'
     }
   }
 }
diff --git a/src/main.js b/src/main.js
index 674fde2..a510995 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,43 +1,44 @@
-import Vue from 'vue'
-
-import 'normalize.css/normalize.css' // A modern alternative to CSS resets
-
-import ElementUI from 'element-ui'
-import 'element-ui/lib/theme-chalk/index.css'
-import locale from 'element-ui/lib/locale/lang/en' // lang i18n
-
-import '@/styles/index.scss' // global css
-
-import App from './App'
-import store from './store'
-import router from './router'
-
-import '@/icons' // icon
-import '@/permission' // permission control
-
-/**
- * If you don't want to use mock-server
- * you want to use MockJs for mock api
- * you can execute: mockXHR()
- *
- * Currently MockJs will be used in the production environment,
- * please remove it before going online ! ! !
- */
-if (process.env.NODE_ENV === 'production') {
-  const { mockXHR } = require('../mock')
-  mockXHR()
-}
-
-// set ElementUI lang to EN
-Vue.use(ElementUI, { locale })
-// 如果想要中文版 element-ui，按如下方式声明
-// Vue.use(ElementUI)
-
-Vue.config.productionTip = false
-
-new Vue({
-  el: '#app',
-  router,
-  store,
-  render: h => h(App)
-})
+import Vue from 'vue'
+import '@/directives'
+
+import 'normalize.css/normalize.css' // A modern alternative to CSS resets
+
+import ElementUI from 'element-ui'
+import 'element-ui/lib/theme-chalk/index.css'
+import locale from 'element-ui/lib/locale/lang/en' // lang i18n
+
+import '@/styles/index.scss' // global css
+
+import App from './App'
+import store from './store'
+import router from './router'
+
+import '@/icons' // icon
+import '@/permission' // permission control
+
+/**
+ * If you don't want to use mock-server
+ * you want to use MockJs for mock api
+ * you can execute: mockXHR()
+ *
+ * Currently MockJs will be used in the production environment,
+ * please remove it before going online ! ! !
+ */
+if (process.env.NODE_ENV === 'production') {
+  const { mockXHR } = require('../mock')
+  mockXHR()
+}
+
+// set ElementUI lang to EN
+Vue.use(ElementUI, { locale })
+// 如果想要中文版 element-ui，按如下方式声明
+// Vue.use(ElementUI)
+
+Vue.config.productionTip = false
+
+new Vue({
+  el: '#app',
+  router,
+  store,
+  render: h => h(App)
+})