chore: optimize the code of workplace; :star2:

chenghongxing

2020-07-20 d91f3a866189530368c204ce264f231818b1e715

chore: optimize the code of workplace; :star2:

 src/main.js

@@ -6,7 +6,6 @@
import Viser from 'viser-vue'
import '@/mock'
import store from './store'
import PouchDB from 'pouchdb'
import 'animate.css/source/animate.css'
import VueI18n from 'vue-i18n'
import Plugins from '@/plugins'
@@ -16,6 +15,8 @@
Vue.use(Antd)
Vue.use(VueI18n)
Vue.use(Plugins)



const i18n = new VueI18n({
  locale: 'CN',
@@ -28,10 +29,4 @@
  store,
  i18n,
  render: h => h(App),
  mounted () {
    let db = new PouchDB('adminDb')
    db.get('currUser').then(doc => {
      this.$store.commit('account/setUser', doc.user)
    })
  },
}).$mount('#app')

 src/mock/user/current.js

@@ -1,19 +1,11 @@
import Mock from 'mockjs'
import '@/mock/extend'

const userDB = Mock.mock({
  'list|2-10': [
    {
      name: '@ADMIN',
      avatar: '@AVATAR',
      address: '@CITY',
      welcome: '@WELCOME',
      timeFix: '@TIMEFIX',
      position: '@position'
    }
  ]
}).list
const welcome = Mock.mock({
  timeFix: '@TIMEFIX',
  message: '@WELCOME'
})

Mock.mock('/user/current', 'get', () => {
  return userDB[0]
Mock.mock('/user/welcome', 'get', () => {
  return welcome
})

 src/mock/user/login.js

@@ -5,8 +5,6 @@
  name: '@ADMIN',
  avatar: '@AVATAR',
  address: '@CITY',
  welcome: '@WELCOME',
  timeFix: '@TIMEFIX',
  position: '@POSITION'
})


 src/pages/dashboard/workplace/WorkPlace.vue

@@ -1,8 +1,8 @@
<template>
  <page-layout :avatar="currUser.avatar">
    <div slot="headerContent">
      <div class="title">{{$t('timeFix')}}，{{currUser.name}}，{{$t('welcome')}}</div>
      <div>{{$t('position')}}</div>
      <div class="title">{{welcome.timeFix[lang]}}，{{currUser.name}}，{{welcome.message[lang]}}</div>
      <div>{{currUser.position[lang]}}</div>
    </div>
    <template slot="extra">
      <head-info class="split-right" :title="$t('project')" content="56"/>
@@ -79,10 +79,11 @@
</template>

<script>
import PageLayout from '../../../layouts/PageLayout'
import HeadInfo from '../../../components/tool/HeadInfo'
import Radar from '../../../components/chart/Radar'
import PageLayout from '@/layouts/PageLayout'
import HeadInfo from '@/components/tool/HeadInfo'
import Radar from '@/components/chart/Radar'
import {mapState} from 'vuex'
import {request, METHOD} from '@/utils/request'

export default {
  name: 'WorkPlace',
@@ -94,53 +95,24 @@
      loading: true,
      activities: [],
      teams: [],
      welcome: {
        timeFix: '',
        message: ''
      }
    }
  },
  created() {
    let user = this.currUser
    let langList = ['CN', 'HK', 'US']
    langList.forEach(lang => {
      this.$i18n.mergeLocaleMessage(lang, {
        timeFix: user.timeFix[lang],
        welcome: user.welcome[lang],
        position: user.position[lang]
      })
    })
  },
  computed: {
    ...mapState('account', {currUser: 'user'})
    ...mapState('account', {currUser: 'user'}),
    ...mapState('setting', ['lang'])
  },
  mounted () {
    this.getProjectList()
    this.getActivites()
    this.getTeams()
  },
  methods: {
    getProjectList () {
      this.$axios({
        method: 'get',
        url: '/project'
      }).then(res => {
  beforeCreate() {
    request('/user/welcome', METHOD.GET).then(res => this.welcome = res.data)
    request('/work/activity', METHOD.GET).then(res => this.activities = res.data)
    request('/work/team', METHOD.GET).then(res => this.teams = res.data)
    request('/project', METHOD.GET).then(res => {
        this.projects = res.data
        this.loading = false
      })
    },
    getActivites () {
      this.$axios({
        method: 'get',
        url: '/work/activity'
      }).then(res => {
        this.activities = res.data
      })
    },
    getTeams () {
      this.$axios({
        method: 'get',
        url: '/work/team'
      }).then(res => {
        this.teams = res.data
      })
    }
  }
}
</script>

 src/store/index.js

@@ -2,12 +2,21 @@
import Vuex from 'vuex'
import account from './modules/account'
import setting from './modules/setting'
import PouchDB from 'pouchdb'

const db = new PouchDB('adminDb')

Vue.use(Vuex)

export default new Vuex.Store({
const store = new Vuex.Store({
  modules: {
    account,
    setting
  }
})
// 读取用户信息
db.get('currUser')
  .then(doc => store.commit('account/setUser', doc.user))
  .catch(() => {})

export default store

 src/store/modules/account.js

@@ -5,7 +5,12 @@
export default {
  namespaced: true,
  state: {
    user: {}
    user: {
      name: '',
      avatar: '',
      position: '',
      address: ''
    }
  },
  mutations: {
    setUser (state, user) {