头像

src/layout/components/Navbar.vue

@@ -16,8 +16,9 @@
       </template>
 
       <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
-        <div class="avatar-wrapper">
-          <img :src="'https://p9-passport.byteacctimg.com/img/user-avatar/9e20870d6d673cafe6a0e22aa2f2aa96~300x300.image'" class="user-avatar">
+       <div class="avatar-wrapper">
+          <el-avatar> {{user}} </el-avatar>
+          <!-- <img :src="'https://p9-passport.byteacctimg.com/img/user-avatar/9e20870d6d673cafe6a0e22aa2f2aa96~300x300.image'" class="user-avatar"> -->
           <i class="el-icon-caret-bottom" />
         </div>
         <el-dropdown-menu slot="dropdown">
@@ -58,6 +59,14 @@ export default {
     RuoYiGit,
     RuoYiDoc
   },
+  mounted(){
+    this.user=localStorage.getItem('username')||'用户'
+  },
+  data(){
+    return{
+      user:'用户'
+    }
+  },
   computed: {
     ...mapGetters([
       'sidebar',

src/main.js

 import Vue from 'vue'
 
 /* 引入公用UI插件 */
-import Element from 'element-ui'
-import Cookies from 'js-cookie'
-import './assets/styles/element-variables.scss'
-import '@/assets/styles/index.scss' // global css
-import '@/assets/styles/ruoyi.scss' // ruoyi css
-import store from './store'
-import router from './router'
+import Element from 'element-ui'
+import Cookies from 'js-cookie'
+import './assets/styles/element-variables.scss'
+import '@/assets/styles/index.scss' // global css
+import '@/assets/styles/ruoyi.scss' // ruoyi css
+import store from './store'
+import router from './router'
 import plugins from './plugins' // plugins
 /* 引入公用主页面 */
 import {App} from 'common'
 /* 注册common */
-import framework from "common"
-import {
-  download
-} from '@/utils/request'
-
-import './assets/icons' // icon
-import './permission' // permission control
-import {
-  getDicts
-} from "@/api/system/dict/data";
-import {
-  getConfigKey
-} from "@/api/system/config";
-import {
-  parseTime,
-  resetForm,
-  addDateRange,
-  selectDictLabel,
-  selectDictLabels,
-  handleTree
-} from "@/utils/ruoyi";
-// 分页组件
-import Pagination from "@/components/Pagination";
-// 自定义表格工具组件
-import RightToolbar from "@/components/RightToolbar"
-// 富文本组件
-import Editor from "@/components/Editor"
-// 文件上传组件
-import FileUpload from "@/components/FileUpload"
-// 图片上传组件
-import ImageUpload from "@/components/ImageUpload"
-// 图片预览组件
-import ImagePreview from "@/components/ImagePreview"
-// 字典标签组件
-import DictTag from '@/components/DictTag'
-// 头部标签组件
-import VueMeta from 'vue-meta'
-// 字典数据组件
-import DictData from '@/components/DictData'
+import framework from "common"
+import {
+  download
+} from '@/utils/request'
 
+import './assets/icons' // icon
+import './permission' // permission control
+import {
+  getDicts
+} from "@/api/system/dict/data";
+import {
+  getConfigKey
+} from "@/api/system/config";
+import {
+  parseTime,
+  resetForm,
+  addDateRange,
+  selectDictLabel,
+  selectDictLabels,
+  handleTree
+} from "@/utils/ruoyi";
+// 分页组件
+import Pagination from "@/components/Pagination";
+// 自定义表格工具组件
+import RightToolbar from "@/components/RightToolbar"
+// 富文本组件
+import Editor from "@/components/Editor"
+// 文件上传组件
+import FileUpload from "@/components/FileUpload"
+// 图片上传组件
+import ImageUpload from "@/components/ImageUpload"
+// 图片预览组件
+import ImagePreview from "@/components/ImagePreview"
+// 字典标签组件
+import DictTag from '@/components/DictTag'
+// 头部标签组件
+import VueMeta from 'vue-meta'
+// 字典数据组件
+import DictData from '@/components/DictData'
 
-/*  */
-
-
-// 全局方法挂载
-Vue.prototype.getDicts = getDicts
-Vue.prototype.getConfigKey = getConfigKey
-Vue.prototype.parseTime = parseTime
-Vue.prototype.resetForm = resetForm
-Vue.prototype.addDateRange = addDateRange
-Vue.prototype.selectDictLabel = selectDictLabel
-Vue.prototype.selectDictLabels = selectDictLabels
-Vue.prototype.download = download
-Vue.prototype.handleTree = handleTree
-
-
-// 全局组件挂载
-Vue.component('DictTag', DictTag)
-Vue.component('Pagination', Pagination)
-Vue.component('RightToolbar', RightToolbar)
-Vue.component('Editor', Editor)
-Vue.component('FileUpload', FileUpload)
-Vue.component('ImageUpload', ImageUpload)
+
+/*  */
+
+
+// 全局方法挂载
+Vue.prototype.getDicts = getDicts
+Vue.prototype.getConfigKey = getConfigKey
+Vue.prototype.parseTime = parseTime
+Vue.prototype.resetForm = resetForm
+Vue.prototype.addDateRange = addDateRange
+Vue.prototype.selectDictLabel = selectDictLabel
+Vue.prototype.selectDictLabels = selectDictLabels
+Vue.prototype.download = download
+Vue.prototype.handleTree = handleTree
+
+
+// 全局组件挂载
+Vue.component('DictTag', DictTag)
+Vue.component('Pagination', Pagination)
+Vue.component('RightToolbar', RightToolbar)
+Vue.component('Editor', Editor)
+Vue.component('FileUpload', FileUpload)
+Vue.component('ImageUpload', ImageUpload)
 Vue.component('ImagePreview', ImagePreview)
-Vue.use(framework)
-Vue.use(plugins)
-Vue.use(VueMeta)
-DictData.install()
-/**
- * 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! ! !
- */
-Vue.use(Element, {
-  size: Cookies.get('size') || 'medium' // set element-ui default size
-})
-/*  */
-Vue.prototype.$asyncRun = (arr, fn) => {
-  if (!arr || !fn) {
-    console.warn('$asyncRun方法参数必填')
-    return
-  }
-  let isArray = arr instanceof Array
-  let isFn = fn instanceof Function
-  if (isArray && isFn) {
-    return Promise.all(arr).then(fn)
-  } else {
-    console.warn('$asyncRun方法参数1需要数组，参数2为回调方法')
-  }
-}
-
-Vue.prototype.$asRun = function() {
-  let csArr = []
-  let fnArr = []
-  let length = arguments.length
-  for (let i = 0; i < length; i++) {
-    let arr = arguments[i]
-    csArr.push(arr[0])
-    fnArr.push(arr[1])
-  }
-  return Promise.all(csArr).then(e => {
-    for (let i = 0; i < length; i++) {
-      fnArr[i](e[i])
-    }
- })
-}
-/* alert */
-Vue.prototype.$warning = function(text) {
-  var text = text || '警告'
-  this.$message({      showClose: true,      message: text,
     type: 'warning'
-  });
-}
-Vue.prototype.$success = function(text) {
-  var text = text || 'no info'
-  this.$message({      showClose: true,      message: text,      type: 'success'
-  });
-}
-Vue.prototype.$error = function(text) {
-  var text = text || 'no info'
-  this.$message({      showClose: true,
     message: text,
     type: 'error'
-  });
-}
-
-
-Vue.config.productionTip = false
-
-new Vue({
-  el: '#app',
-  router,
-  store,
-  render: h => h(App)
+Vue.use(framework)
+Vue.use(plugins)
+Vue.use(VueMeta)
+DictData.install()
+/**
+ * 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! ! !
+ */
+Vue.use(Element, {
+  size: Cookies.get('size') || 'medium' // set element-ui default size
+})
+/*  */
+Vue.prototype.$asyncRun = (arr, fn) => {
+  if (!arr || !fn) {
+    console.warn('$asyncRun方法参数必填')
+    return
+  }
+  let isArray = arr instanceof Array
+  let isFn = fn instanceof Function
+  if (isArray && isFn) {
+    return Promise.all(arr).then(fn)
+  } else {
+    console.warn('$asyncRun方法参数1需要数组，参数2为回调方法')
+  }
+}
+
+Vue.prototype.$asRun = function() {
+  let csArr = []
+  let fnArr = []
+  let length = arguments.length
+  for (let i = 0; i < length; i++) {
+    let arr = arguments[i]
+    csArr.push(arr[0])
+    fnArr.push(arr[1])
+  }
+  return Promise.all(csArr).then(e => {
+    for (let i = 0; i < length; i++) {
+      fnArr[i](e[i])
+    }
+ }
+)
+
+}
+/* alert */
+Vue.prototype.$warning = function(text) {
+  var text = text || '警告'
+  this.$message({      showClose: true,      message: text,
+     type: 'warning'
+  });
+}
+Vue.prototype.$success = function(text) {
+  var text = text || 'no info'
+  this.$message({      showClose: true,      message: text,      type: 'success'
+  });
+}
+Vue.prototype.$error = function(text) {
+  var text = text || 'no info'
+  this.$message({      showClose: true,
+     message: text,
+     type: 'error'
+  });
+}
+
+
+Vue.config.productionTip = false
+
+new Vue({
+  el: '#app',
+  router,
+  store,
+  render:function(h){
+    return h(App)
+  }
 })